<template>
|
<FYTable
|
@search="onSearch"
|
:pagination="false"
|
ref="tableRef"
|
@cell-click="cellClick"
|
:cell-class-name="cellClassName"
|
@table-paste="handlePaste"
|
@sort-change="handleSortChange"
|
>
|
<template #options>
|
<!-- 区县 -->
|
<FYOptionLocation
|
:allOption="false"
|
:level="3"
|
:checkStrictly="false"
|
v-model:value="formSearch.locations"
|
></FYOptionLocation>
|
<!-- 场景类型 -->
|
<FYOptionScene
|
:allOption="false"
|
:type="2"
|
v-model:value="formSearch.scenetype"
|
></FYOptionScene>
|
<!-- 时间 -->
|
<FYOptionTime :initValue="false" type="month" v-model:value="formSearch.time"></FYOptionTime>
|
</template>
|
<template #buttons>
|
<!-- <el-button icon="Download" size="default" type="success" @click="download"
|
>规范性评估与分析报告</el-button
|
> -->
|
<CompReport
|
:locations="formSearch.locations"
|
:scenetype="formSearch.scenetype"
|
:time="formSearch.time"
|
></CompReport>
|
</template>
|
|
<template #options-expand>
|
<el-form :inline="true">
|
<CompQuickSet @quick-set="setOptions"></CompQuickSet>
|
</el-form>
|
</template>
|
|
<template #table-column>
|
<el-table-column fixed="left" sortable="custom" prop="sceneIndex" label="编号" width="80">
|
</el-table-column>
|
<el-table-column prop="sceneName" :show-overflow-tooltip="true" label="名称" width="300">
|
</el-table-column>
|
<el-table-column
|
prop="subTaskTime"
|
label="巡查日期"
|
width="110"
|
sortable="custom"
|
:formatter="timeFormat"
|
/>
|
<el-table-column prop="evaluation.resultscorebef" label="得分" width="90" sortable="custom" />
|
<el-table-column prop="evaluation.resultscorebef" label="环信码" width="100">
|
<template #default="{ row }">
|
<span :style="`color: ${toCode(row).color};`">{{ toCode(row).name }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column prop="dname" label="区县" width="90" />
|
<el-table-column
|
prop="tname"
|
label="街道"
|
width="110"
|
:filters="townFilters"
|
:filter-method="filterHandler"
|
/>
|
<el-table-column prop="evaluation.scenseaddress" label="地址" />
|
<!-- <el-table-column prop="biArea" label="集中区" width="110" />
|
<el-table-column prop="biManagementCompany" label="物业" min-width="110"/> -->
|
<el-table-column fixed="right" align="right" label="监测数据超标" width="160">
|
<template #default="{ row }">
|
<el-input v-model="row.score1" />
|
</template>
|
</el-table-column>
|
<el-table-column fixed="right" align="right" label="监测数据超区月均值" width="160">
|
<template #default="{ row }">
|
<el-input v-model="row.score2" />
|
</template>
|
</el-table-column>
|
<el-table-column fixed="right" align="right" label="操作" width="160">
|
<!-- <template #header>
|
<el-button icon="Download" size="default" type="success" @click="exportExcel"
|
>导出结果</el-button
|
>
|
</template> -->
|
<template #default="{ row }">
|
<el-button type="primary" size="small" @click="editRow(row)">查看</el-button>
|
</template>
|
</el-table-column>
|
</template>
|
</FYTable>
|
</template>
|
|
<script>
|
import dayjs from 'dayjs';
|
import evaluateApi from '@/api/fysp/evaluateApi';
|
import { envCreditCode } from '@/constants/index';
|
import CompReport from './components/CompReport.vue';
|
import { useTablePaste } from '@/composables/tablePaste';
|
import { useCloned } from '@vueuse/core';
|
|
export default {
|
setup() {
|
const { cellClick, cellClassName, handlePaste, setTableData, addRefreshEvent, tableData } =
|
useTablePaste({
|
score1: 8,
|
score2: 9
|
});
|
return { cellClick, cellClassName, handlePaste, setTableData, addRefreshEvent, tableData };
|
},
|
components: { CompReport },
|
data() {
|
return {
|
formSearch: {
|
locations: {},
|
scenetype: {},
|
time: dayjs().add(-1, 'M').date(1).toDate()
|
},
|
townFilters: [],
|
// 原始数据，用于排序取消后
|
orginData: []
|
};
|
},
|
methods: {
|
_getParam() {
|
const { locations, scenetype, time } = this.formSearch;
|
return {
|
provincecode: locations.pCode,
|
provincename: locations.pName,
|
citycode: locations.cCode,
|
cityname: locations.cName,
|
districtcode: locations.dCode,
|
districtname: locations.dName,
|
starttime: dayjs(time).format('YYYY-MM-DD HH:mm:ss'),
|
scensetypeid: scenetype.value
|
};
|
},
|
editRow(row) {
|
this.$router.push(`evalutationEdit/${row.subTaskId}`);
|
},
|
setOptions(param) {
|
this.formSearch.locations = param.locations;
|
this.formSearch.scenetype = param.scenetype;
|
this.formSearch.sourceType = param.sourceType;
|
this.$refs.tableRef.onSearch();
|
},
|
onSearch(page, func) {
|
this.$refs.tableRef.clearSort();
|
const area = this._getParam();
|
evaluateApi.fetchAutoEvaluation(area).then((res) => {
|
if (res.data) {
|
this.tableData = res.data;
|
this.orginData = useCloned(this.tableData).cloned;
|
console.log(this.orginData);
|
this.getFilters(res.data);
|
if (typeof func === 'function') {
|
func({ data: this.tableData });
|
}
|
}
|
});
|
},
|
// 规范性评估与分析报告后台生成任务
|
download() {
|
const area = this._getParam();
|
evaluateApi.downloadAutoEvaluation(area).then((res) => {
|
if (res == false) {
|
// 未下载文档，而是开启了文档生成后台任务
|
this.$parent;
|
}
|
});
|
},
|
// 导出表格为excel格式
|
exportExcel() {},
|
getFilters(data) {
|
const townList = [];
|
data.forEach((e) => {
|
if (townList.indexOf(e.tname) == -1) {
|
townList.push(e.tname);
|
}
|
});
|
this.townFilters = townList.map((v) => {
|
return { text: v, value: v };
|
});
|
},
|
toCode(row, column) {
|
if (row.evaluation) {
|
return envCreditCode(row.evaluation.resultscorebef);
|
} else {
|
return '';
|
}
|
},
|
timeFormat(row, column) {
|
const time = row.subTaskTime;
|
if (time) {
|
return dayjs(time).format('MM-DD');
|
} else {
|
return '';
|
}
|
},
|
filterHandler(value, row, column) {
|
const property = column['property'];
|
return row[property] === value;
|
},
|
sortScore(a, b) {
|
const s1 = a.evaluation ? parseInt(a.evaluation.resultscorebef) : 0;
|
const s2 = b.evaluation ? parseInt(b.evaluation.resultscorebef) : 0;
|
return s1 - s2;
|
},
|
handleSortChange({ column, prop, order }) {
|
console.log(column, prop, order);
|
if (order == null) {
|
this.orginData.forEach((e, i) => {
|
this.tableData[i] = e;
|
});
|
} else if (prop == 'evaluation.resultscorebef') {
|
this.tableData.sort((a, b) => {
|
const s1 = a.evaluation ? parseInt(a.evaluation.resultscorebef) : 0;
|
const s2 = b.evaluation ? parseInt(b.evaluation.resultscorebef) : 0;
|
if (order == 'ascending') {
|
return s1 - s2;
|
} else if (order == 'descending') {
|
return s2 - s1;
|
}
|
});
|
} else if (prop == 'sceneIndex') {
|
this.tableData.sort((a, b) => {
|
if (order == 'ascending') {
|
if (a.sceneIndex === b.sceneIndex) {
|
return a.subTaskTime > b.subTaskTime ? 1 : -1;
|
} else {
|
return a.sceneIndex - b.sceneIndex;
|
}
|
} else if (order == 'descending') {
|
if (a.sceneIndex === b.sceneIndex) {
|
return b.subTaskTime > a.subTaskTime ? 1 : -1;
|
} else {
|
return b.sceneIndex - a.sceneIndex;
|
}
|
}
|
});
|
} else if (prop == 'subTaskTime') {
|
this.tableData.sort((a, b) => {
|
if (order == 'ascending') {
|
return a[prop] > b[prop] ? 1 : -1;
|
// return dayjs(a).isAfter(dayjs(b)) ? 1 : -1;
|
} else if (order == 'descending') {
|
return b[prop] > a[prop] ? 1 : -1;
|
// return dayjs(b).isAfter(dayjs(a)) ? 1 : -1;
|
}
|
});
|
}
|
}
|
},
|
mounted() {
|
this.addRefreshEvent(this.$refs.tableRef.doLayout);
|
}
|
};
|
</script>
|
<style scoped></style>
|
