242 lines
7.5 KiB
Vue
242 lines
7.5 KiB
Vue
<template>
|
|
<div class="rank-page">
|
|
<div class="left">
|
|
<div class="rank-content">
|
|
<div class="content-title">
|
|
<!-- <img src="@/assets/images/hzImg/assessmentImg/textImg1.png" alt="" /> -->
|
|
<span>评分对象</span>
|
|
</div>
|
|
<div class="content-main" style="overflow-y: visible">
|
|
<leftMenu2 :records="dicMainData" class="leftMenu">
|
|
<template #default="scope">
|
|
<div class="leftProject" @click="onSearch(scope.data)">
|
|
<div class="leftMenu_item">
|
|
<div class="video">
|
|
<img :src="scope.select ? scope.data.activeIcon : scope.data.defaultIcon" alt="" />
|
|
<span class="middleSize">{{ scope.data.dictValue }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</leftMenu2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="center">
|
|
<div class="rank-content">
|
|
<div class="content-title">
|
|
<!-- <img src="@/assets/images/hzImg/assessmentImg/redRank.png" alt="" /> -->
|
|
<span>排行榜</span>
|
|
</div>
|
|
<div class="content-main">
|
|
<div class="search-content">
|
|
<!-- <div class="search-sum">企业数量: {{ allRankCount }}</div> -->
|
|
<div class="search-sum">企业数量: {{ allRankList.length }}</div>
|
|
<el-input
|
|
class="search-input"
|
|
v-model="allCountSearch.enterpriseName"
|
|
@input="getAllCountData"
|
|
placeholder="请输入企业名称"
|
|
>
|
|
<template #suffix>
|
|
<el-icon><search /></el-icon>
|
|
</template>
|
|
</el-input>
|
|
</div>
|
|
<!-- <div class="type-title">未验收项目</div> -->
|
|
<div class="table-content">
|
|
<div class="table-header">
|
|
<div class="td">序号</div>
|
|
<div class="td">企业名称</div>
|
|
<div class="td">企业类型</div>
|
|
<div class="td">项目名称</div>
|
|
<div class="td" @click="changeSort(1)">
|
|
<span>得分</span>
|
|
<el-icon color="#5BC7F7" :size="12"><d-caret /></el-icon>
|
|
</div>
|
|
</div>
|
|
<template v-for="(item, index) in allRankList" :key="index">
|
|
<div class="table-body">
|
|
<div class="td">{{ index + 1 }}</div>
|
|
<div class="td">{{ item.enterpriseName }}</div>
|
|
<div class="td">{{ item.enterpriseTypeName }}</div>
|
|
<div class="td">{{ item.engineeringName }}</div>
|
|
<div class="td">{{ item.score }}</div>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="right">
|
|
<div class="rank-content">
|
|
<div class="content-title">
|
|
<!-- <img src="@/assets/images/hzImg/assessmentImg/textImg2.png" alt="" /> -->
|
|
<span>项目统计</span>
|
|
</div>
|
|
<div class="content-main">
|
|
<div class="search-content">
|
|
<el-input
|
|
class="search-input"
|
|
v-model="engineerCountSearch.enterpriseName"
|
|
@input="getEngineerData"
|
|
placeholder="请输入企业名称"
|
|
>
|
|
<template #suffix>
|
|
<el-icon><search /></el-icon>
|
|
</template>
|
|
</el-input>
|
|
</div>
|
|
<div class="table-content">
|
|
<div class="table-header">
|
|
<div class="td">序号</div>
|
|
<div class="td">企业名称</div>
|
|
<div class="td">企业类型</div>
|
|
<div class="td">项目名称</div>
|
|
<div class="td" @click="changeSort(2)">
|
|
<span>得分</span>
|
|
<el-icon color="#5BC7F7" :size="12"><d-caret /></el-icon>
|
|
</div>
|
|
</div>
|
|
<div class="table-body" v-for="(item, index) in engineerCountList" :key="index">
|
|
<div class="td">{{ index + 1 }}</div>
|
|
<div class="td">{{ item.enterpriseName }}</div>
|
|
<div class="td">{{ item.enterpriseTypeName }}</div>
|
|
<div class="td">{{ item.engineeringName }}</div>
|
|
<div class="td">{{ item.score }}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref, onMounted } from "vue";
|
|
import leftMenu2 from "@/components/leftMenu2/index.vue";
|
|
import { getDicList } from "@/api/modules/jxjview";
|
|
import { rankScoreList, rankCompanyCount } from "@/api/modules/huizhou";
|
|
const dicMainData = ref([]);
|
|
const imgOption = ref([
|
|
"../../../../../assets/images/hzImg/assessmentImg/dicIcon1.png",
|
|
"../../../../../assets/images/hzImg/assessmentImg/dicIcon2.png",
|
|
"../../../../../assets/images/hzImg/assessmentImg/dicIcon3.png",
|
|
"../../../../../assets/images/hzImg/assessmentImg/dicIcon4.png",
|
|
"../../../../../assets/images/hzImg/assessmentImg/dicIcon5.png"
|
|
]);
|
|
const activeImgOption = ref([
|
|
"../../../../../assets/images/hzImg/assessmentImg/dicActiveIcon1.png",
|
|
"../../../../../assets/images/hzImg/assessmentImg/dicActiveIcon2.png",
|
|
"../../../../../assets/images/hzImg/assessmentImg/dicActiveIcon3.png",
|
|
"../../../../../assets/images/hzImg/assessmentImg/dicActiveIcon4.png",
|
|
"../../../../../assets/images/hzImg/assessmentImg/dicActiveIcon5.png"
|
|
]);
|
|
const companyType = ref("");
|
|
const engineerCountList = ref([]);
|
|
const allRankCount = ref([]);
|
|
const allRankList = ref([]);
|
|
const engineerCountSearch = ref({
|
|
enterpriseName: "",
|
|
scoreSort: 1
|
|
});
|
|
const allCountSearch = ref({
|
|
enterpriseName: "",
|
|
scoreSort: 1
|
|
});
|
|
const getAllCountList = async () => {
|
|
let requestData = {
|
|
...allCountSearch.value,
|
|
enterpriseType: companyType.value,
|
|
scoreType: 0
|
|
};
|
|
const res = await rankScoreList(requestData);
|
|
if (res && res.result && res.result.length > 0) {
|
|
allRankList.value = res.result;
|
|
} else {
|
|
allRankList.value = [];
|
|
}
|
|
};
|
|
const getAllCountData = async () => {
|
|
// let requestData = {
|
|
// ...allCountSearch.value,
|
|
// enterpriseType: companyType.value
|
|
// };
|
|
// const res = await rankCompanyCount(requestData);
|
|
// if (res && res.result) {
|
|
// allRankCount.value = res.result;
|
|
// } else {
|
|
// allRankCount.value = 0;
|
|
// }
|
|
getAllCountList();
|
|
};
|
|
|
|
// 修改排序
|
|
const changeSort = (index: any) => {
|
|
if (index == 1) {
|
|
allCountSearch.value.scoreSort = allCountSearch.value.scoreSort == 0 ? 1 : 0;
|
|
getAllCountList();
|
|
getAllCountData();
|
|
} else if (index == 2) {
|
|
engineerCountSearch.value.scoreSort = engineerCountSearch.value.scoreSort == 0 ? 1 : 0;
|
|
getEngineerData();
|
|
}
|
|
};
|
|
const getEngineerData = async () => {
|
|
let requestData = {
|
|
...engineerCountSearch.value,
|
|
enterpriseType: companyType.value,
|
|
scoreType: 1
|
|
};
|
|
const res = await rankScoreList(requestData);
|
|
if (res && res.result && res.result.length > 0) {
|
|
engineerCountList.value = res.result;
|
|
} else {
|
|
engineerCountList.value = [];
|
|
}
|
|
};
|
|
// 获取本地静态资源
|
|
const getAssetsImg = (url: string) => {
|
|
return new URL(url, import.meta.url).href;
|
|
};
|
|
const getDicMainList = async () => {
|
|
// 获取单位字典
|
|
const { result } = await getDicList({ dictType: "enterprise_main", status: 1 });
|
|
console.log(result);
|
|
if (result) {
|
|
result.map((item, index) => {
|
|
if (index + 1 < 6) {
|
|
item.defaultIcon = getAssetsImg(imgOption.value[index]);
|
|
item.activeIcon = getAssetsImg(activeImgOption.value[index]);
|
|
} else {
|
|
let imgSelectIndex = (index + 1) % 5;
|
|
item.defaultIcon = getAssetsImg(imgOption.value[imgSelectIndex - 1]);
|
|
item.activeIcon = getAssetsImg(activeImgOption.value[imgSelectIndex - 1]);
|
|
}
|
|
});
|
|
dicMainData.value = result;
|
|
dicMainData.value.splice(0, 1);
|
|
}
|
|
console.log(dicMainData.value);
|
|
};
|
|
// div点击事件
|
|
const onSearch = async (params: any) => {
|
|
console.log(params);
|
|
companyType.value = params.dictLabel;
|
|
await getEngineerData();
|
|
await getAllCountData();
|
|
await getAllCountList();
|
|
};
|
|
onMounted(async () => {
|
|
await getDicMainList();
|
|
companyType.value = dicMainData.value[0].dictLabel;
|
|
await getEngineerData();
|
|
await getAllCountData();
|
|
await getAllCountList();
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "./index.scss";
|
|
</style>
|