web 模块页面冗余代码优化整理

This commit is contained in:
任珮宇 2023-10-09 13:55:03 +08:00
parent 388911e20c
commit 1777ca2bf5

View File

@ -1,6 +1,13 @@
<template> <template>
<div style="height: 100%;"> <div style="height: 100%">
<a-spin :spinning="spinning"> <List
:stationList="stationList"
:columns="columns"
:dataType="dataType"
fileName="CALIBPHD"
pageType="CALIB"
></List>
<!-- <a-spin :spinning="spinning">
<a-card v-if="!isDetail" :bordered="false" style="margin-left: 20px"> <a-card v-if="!isDetail" :bordered="false" style="margin-left: 20px">
<search-form :items="formItems" v-model="queryParam" @search="searchQueryData"> <search-form :items="formItems" v-model="queryParam" @search="searchQueryData">
<a-space style="float: right" class="btn-group" slot="additional"> <a-space style="float: right" class="btn-group" slot="additional">
@ -28,7 +35,7 @@
</custom-table> </custom-table>
</a-card> </a-card>
</a-spin> </a-spin>
<Detail v-if="isDetail" type="BLANKPHD" :sampleId="currSampleId" :allData="detailJson" @back="handleBack"></Detail> <Detail v-if="isDetail" type="BLANKPHD" :sampleId="currSampleId" :allData="detailJson" @back="handleBack"></Detail> -->
</div> </div>
</template> </template>
<script> <script>
@ -36,7 +43,7 @@ const columns = [
{ {
title: 'NO', title: 'NO',
align: 'left', align: 'left',
width:80, width: 80,
scopedSlots: { scopedSlots: {
customRender: 'index', customRender: 'index',
}, },
@ -81,225 +88,227 @@ const columns = [
dataIndex: 'acquisitionStop', dataIndex: 'acquisitionStop',
}, },
] ]
import { JeecgListMixin } from '@/mixins/JeecgListMixin' // import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { getAction, getFileAction } from '../../../../../api/manage' import { getAction, getFileAction } from '../../../../../api/manage'
import dateFormat from '../../../../../components/jeecg/JEasyCron/format-date' import List from '../../../list.vue'
import Detail from "../../../detail.vue" // import dateFormat from '../../../../../components/jeecg/JEasyCron/format-date'
// import Detail from '../../../detail.vue'
export default { export default {
name: 'menuTree', // name: 'menuTree',
mixins: [JeecgListMixin], // mixins: [JeecgListMixin],
components: { components: {
Detail, List,
}, },
data() { data() {
return { return {
spinning: false, // spinning: false,
isImmediate:true, // isImmediate: true,
isDetail:false, // isDetail: false,
columns, columns,
queryParam: { dataType: 'B',
dataType: 'B', // queryParam: {
startTime: dateFormat(new Date(), 'yyyy-MM-dd'), // dataType: 'B',
endTime: dateFormat(new Date(), 'yyyy-MM-dd'), // startTime: dateFormat(new Date(), 'yyyy-MM-dd'),
stationIds: [], // endTime: dateFormat(new Date(), 'yyyy-MM-dd'),
spectralQualifie:"" // stationIds: [],
}, // spectralQualifie: '',
// },
url: { url: {
list: '/webStatistics/findParticulatePage', // list: '/webStatistics/findParticulatePage',
findStationList: '/webStatistics/findStationList', findStationList: '/webStatistics/findStationList',
}, },
stationList: [], stationList: [],
dataSource: [], // dataSource: [],
detailJson: {}, // detailJson: {},
strIds: "", // strIds: '',
allChecked: false, // allChecked: false,
currSampleId: "", // currSampleId: '',
pageType:"ACQ" // pageType: 'ACQ',
} }
}, },
created() { created() {
this.findStationList() this.findStationList()
}, },
methods: { methods: {
handleExcel() { // handleExcel() {
if (this.dataSource.length>0) { // if (this.dataSource.length>0) {
let params = { // let params = {
...this.queryParam, // ...this.queryParam,
pageType:this.pageType // pageType:this.pageType
} // }
getFileAction("/webStatistics/radionuclideExport", params).then(res => { // getFileAction("/webStatistics/radionuclideExport", params).then(res => {
if (res.code && res.code == 500) { // if (res.code && res.code == 500) {
this.$message.warning("This operation fails. Contact your system administrator") // this.$message.warning("This operation fails. Contact your system administrator")
} else { // } else {
const blob = new Blob([res], { type: "application/vnd.ms-excel" }) // const blob = new Blob([res], { type: "application/vnd.ms-excel" })
let link = document.createElement('a') // let link = document.createElement('a')
link.href = window.URL.createObjectURL(blob) // link.href = window.URL.createObjectURL(blob)
link.download = "BLANKPHD" // link.download = "BLANKPHD"
document.body.appendChild(link) // document.body.appendChild(link)
link.click() // link.click()
URL.revokeObjectURL(link.href) // URL.revokeObjectURL(link.href)
document.body.removeChild(link) // document.body.removeChild(link)
} // }
}) // })
} else { // } else {
this.$message.warning("No downloadable data") // this.$message.warning("No downloadable data")
} // }
}, // },
searchQueryData() { // searchQueryData() {
this.isImmediate = false // this.isImmediate = false
this.loading = true // this.loading = true
let params = { // let params = {
...this.queryParam, // ...this.queryParam,
pageNo: 1, // pageNo: 1,
pageSize: 10 // pageSize: 10
} // }
getAction(this.url.list, params).then((res) => { // getAction(this.url.list, params).then((res) => {
this.loading = false // this.loading = false
if (res.success) { // if (res.success) {
this.ipagination.current = res.result.current // this.ipagination.current = res.result.current
this.ipagination.pageSize = res.result.size // this.ipagination.pageSize = res.result.size
this.ipagination.total = res.result.total // this.ipagination.total = res.result.total
this.dataSource = res.result.records // this.dataSource = res.result.records
} else { // } else {
this.$message.warning("This operation fails. Contact your system administrator") // this.$message.warning("This operation fails. Contact your system administrator")
} // }
}) // })
}, // },
handleDetail(record) { // handleDetail(record) {
this.spinning = true // this.spinning = true
this.currSampleId = record.sampleId // this.currSampleId = record.sampleId
getAction("webStatistics/findGeneratedReport", { sampleId: record.sampleId }).then(res => { // getAction('webStatistics/findGeneratedReport', { sampleId: record.sampleId })
this.spinning = false // .then((res) => {
if (res.success) { // this.spinning = false
this.detailJson = res.result // if (res.success) {
this.detailJson = JSON.parse(JSON.stringify(this.detailJson)) // this.detailJson = res.result
this.isDetail = true // this.detailJson = JSON.parse(JSON.stringify(this.detailJson))
} else { // this.isDetail = true
this.$message.warning("This operation fails. Contact your system administrator") // } else {
} // this.$message.warning('This operation fails. Contact your system administrator')
}).catch(err => { // }
this.spinning = false // })
}) // .catch((err) => {
}, // this.spinning = false
handleBack(flag) { // })
this.isDetail = flag // },
}, // handleBack(flag) {
// this.isDetail = flag
// },
findStationList() { findStationList() {
getAction(this.url.findStationList, { menuName: 'Particulate' }).then((res) => { getAction(this.url.findStationList, { menuName: 'Particulate' }).then((res) => {
if (res.success) { if (res.success) {
if (res.result.length>0) { if (res.result.length > 0) {
this.stationList = res.result.map((res) => ({ label: res.stationCode, value: res.stationId })) this.stationList = res.result.map((res) => ({ label: res.stationCode, value: res.stationId }))
} else { } else {
this.stationList=[] this.stationList = []
} }
} else { } else {
this.$message.warning("This operation fails. Contact your system administrator") this.$message.warning('This operation fails. Contact your system administrator')
} }
}) })
}, },
handleSelectChange(val) { // handleSelectChange(val) {
let length = this.stationList.length // let length = this.stationList.length
if (val.length === length) { // if (val.length === length) {
this.allChecked = true // this.allChecked = true
} else { // } else {
this.allChecked = false // this.allChecked = false
} // }
}, // },
handleSelectChangeAll(val) { // handleSelectChangeAll(val) {
this.allChecked = val // this.allChecked = val
if (val) { // if (val) {
this.queryParam.stationIds = this.stationList.map(item => item.value) // this.queryParam.stationIds = this.stationList.map(item => item.value)
} else { // } else {
this.queryParam.stationIds =[] // this.queryParam.stationIds =[]
} // }
}, // },
filterOption(input, option) { // filterOption(input, option) {
return ( // return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0 // },
);
},
},
computed: {
formItems() {
return [
{
type: 'a-input',
label: '',
name: 'search',
props: {
placeholder: 'search...',
style: {
width: '166px',
},
},
style: {
width: 'auto',
},
},
{
type: 'custom-all-select',
label: 'Stations',
name: 'stationIds',
props: {
allChecked: this.allChecked,
filterOption:this.filterOption,
placeholder: 'select stations',
mode: 'multiple',
maxTagCount: 1,
options: [
...this.stationList,
],
style: {
width: '200px',
},
},
on: {
change: this.handleSelectChange,
changeAll: this.handleSelectChangeAll
},
style: {
width: 'auto',
},
},
{
label: 'Start date',
type: 'custom-date-picker',
name: 'startTime',
props: {
format: 'YYYY-MM-DD',
valueFormat: 'YYYY-MM-DD',
style: {
minWidth: 'auto',
width: '200px',
},
},
style: {
width: 'auto',
},
},
{
label: 'End date',
type: 'custom-date-picker',
name: 'endTime',
props: {
format: 'YYYY-MM-DD',
valueFormat: 'YYYY-MM-DD',
style: {
minWidth: 'auto',
width: '200px',
},
},
style: {
width: 'auto',
},
},
]
},
}, },
// computed: {
// formItems() {
// return [
// {
// type: 'a-input',
// label: '',
// name: 'search',
// props: {
// placeholder: 'search...',
// style: {
// width: '166px',
// },
// },
// style: {
// width: 'auto',
// },
// },
// {
// type: 'custom-all-select',
// label: 'Stations',
// name: 'stationIds',
// props: {
// allChecked: this.allChecked,
// filterOption:this.filterOption,
// placeholder: 'select stations',
// mode: 'multiple',
// maxTagCount: 1,
// options: [
// ...this.stationList,
// ],
// style: {
// width: '200px',
// },
// },
// on: {
// change: this.handleSelectChange,
// changeAll: this.handleSelectChangeAll
// },
// style: {
// width: 'auto',
// },
// },
// {
// label: 'Start date',
// type: 'custom-date-picker',
// name: 'startTime',
// props: {
// format: 'YYYY-MM-DD',
// valueFormat: 'YYYY-MM-DD',
// style: {
// minWidth: 'auto',
// width: '200px',
// },
// },
// style: {
// width: 'auto',
// },
// },
// {
// label: 'End date',
// type: 'custom-date-picker',
// name: 'endTime',
// props: {
// format: 'YYYY-MM-DD',
// valueFormat: 'YYYY-MM-DD',
// style: {
// minWidth: 'auto',
// width: '200px',
// },
// },
// style: {
// width: 'auto',
// },
// },
// ]
// },
// },
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.icon-edit{ .icon-edit {
margin-right: 10px; margin-right: 10px;
} }
</style> </style>