| | |
| | | </el-tag> |
| | | </template> |
| | | |
| | | <template slot-scope="{ row }" slot="dtype"> |
| | | <template slot-scope="{ row }" slot="dxzt"> |
| | | <el-tag>{{ |
| | | row.dtype == "0" ? "掉线" : row.dtype == "1" ? "在线" : "无" |
| | | row.dxzt == "0" ? "掉线" : row.dxzt == "1" ? "在线" : "无" |
| | | }} |
| | | </el-tag> |
| | | </template> |
| | | |
| | | <template slot-scope="{ row }" slot="expireTime"> |
| | | <span> |
| | | {{ |
| | | row.expireTime == "" ? row.expireTime : row.expireTime == null ? row.expireTime : row.expireTime.split(" ")[0] |
| | | }} |
| | | </span> |
| | | <i class="el-icon-warning" v-if="row.type == 1"></i> |
| | | </template> |
| | | |
| | | </avue-crud> |
| | | |
| | | </basic-container> |
| | | </el-col> |
| | | <el-dialog title="缴费提醒" :visible.sync="dialogTableVisible" custom-class="payWin" append-to-body="true"> |
| | | <el-table :data="gridData"> |
| | | <el-table-column property="xb" label="序号" width="50"></el-table-column> |
| | | <el-table-column property="deviceName" label="设备名称" width="150"></el-table-column> |
| | | <el-table-column property="deviceNumber" label="设备编号" width="150"></el-table-column> |
| | | <el-table-column property="street" label="所属单位" width="200"></el-table-column> |
| | | <el-table-column property="expireTime" label="到期时间"></el-table-column> |
| | | </el-table> |
| | | </el-dialog> |
| | | </el-row> |
| | | </template> |
| | | |
| | | <script> |
| | | import {getList, remove, update, add, getclient, getDeptLazyTree} from "@/api/client/client"; |
| | | import {getList, remove, update, add, getclient, getDeptLazyTree, getAll} from "@/api/client/client"; |
| | | import {mapGetters} from "vuex"; |
| | | |
| | | export default { |
| | | created() { |
| | | this.payWin(); |
| | | }, |
| | | data() { |
| | | return { |
| | | form: {}, |
| | |
| | | currentPage: 1, |
| | | total: 0 |
| | | }, |
| | | dialogTableVisible: false, |
| | | gridData: null, |
| | | selectionList: [], |
| | | treeDeptId: '', |
| | | treeData: [], |
| | |
| | | calcHeight: 80, |
| | | labelWidth: '100', |
| | | dialogWidth: 950, |
| | | menuWidth: 160, |
| | | size: "mini", |
| | | tip: false, |
| | | searchShow: true, |
| | | searchMenuSpan: 4, |
| | |
| | | border: true, |
| | | index: true, |
| | | viewBtn: true, |
| | | selection: true, |
| | | selection: false, |
| | | dialogClickModal: false, |
| | | column: [ |
| | | { |
| | |
| | | search: true, |
| | | }, |
| | | { |
| | | label: "到期时间", |
| | | prop: "releaseTimeRange", |
| | | type: "datetime", |
| | | format: "yyyy-MM-dd hh:mm:ss", |
| | | valueFormat: "yyyy-MM-dd hh:mm:ss", |
| | | searchRange: true, |
| | | searchSpan: 5, |
| | | hide: true, |
| | | addDisplay: false, |
| | | editDisplay: false, |
| | | viewDisplay: false, |
| | | search: true, |
| | | rules: [ |
| | | { |
| | | required: true, |
| | | message: "请输入时间", |
| | | trigger: "blur" |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | label: "设备编号", |
| | | prop: "deviceNumber", |
| | | width: 130 |
| | | }, |
| | | { |
| | | label: "行政区", |
| | | prop: "addvcd", |
| | | label: "省份", |
| | | prop: "province", |
| | | search: true, |
| | | searchSpan: 3, |
| | | searchLabelWidth: 60, |
| | | placeholder: "省份", |
| | | type: "select", |
| | | props: { |
| | | label: "name", |
| | | value: "code" |
| | | }, |
| | | cascaderItem: ["city", "district"], |
| | | dicUrl: "/api/blade-system/region/select", |
| | | span: 6, |
| | | className: "cityClass1" |
| | | }, |
| | | { |
| | | label: "地市", |
| | | prop: "city", |
| | | type: "select", |
| | | searchPlaceholder: "地市", |
| | | placeholder: "地市", |
| | | searchLabelWidth: 1, |
| | | searchSpan: 2, |
| | | search: true, |
| | | props: { |
| | | label: "name", |
| | | value: "code" |
| | | }, |
| | | dicUrl: "/api/blade-system/region/select?code={{key}}", |
| | | span: 3, |
| | | labelWidth: "0", |
| | | className: "cityClass2" |
| | | }, |
| | | { |
| | | label: "区县", |
| | | searchSpan: 2, |
| | | searchLabelWidth: 1, |
| | | searchPlaceholder: "区县", |
| | | placeholder: "区县", |
| | | search: true, |
| | | prop: "district", |
| | | type: "select", |
| | | props: { |
| | | label: "name", |
| | | value: "code" |
| | | }, |
| | | dicUrl: "/api/blade-system/region/select?code={{key}}", |
| | | span: 3, |
| | | labelWidth: "0", |
| | | className: "cityClass3" |
| | | }, { |
| | | label: "布撤防状态", |
| | | prop: "devicestate", |
| | | type: "select", |
| | | slot: true, |
| | | width: 100, |
| | | rules: [{ |
| | | required: true, |
| | | trigger: "blur" |
| | | }], |
| | | dicData: [ |
| | | { |
| | | label: "撤防", |
| | |
| | | ] |
| | | }, { |
| | | label: "设备状态", |
| | | prop: "dtype", |
| | | search: true, |
| | | prop: "dxzt", |
| | | slot: true, |
| | | type: "select", |
| | | dicData: [ |
| | | { |
| | | label: "掉线", |
| | | value: "0" |
| | | }, |
| | | { |
| | | label: "在线", |
| | | value: "1" |
| | | } |
| | | ] |
| | | addDisplay: false, |
| | | editDisplay: false, |
| | | }, { |
| | | label: "缴费信息", |
| | | prop: "pay", |
| | | }, { |
| | | label: "设备类型", |
| | | prop: "deviceType", |
| | |
| | | prop: "street", |
| | | width: 150 |
| | | }, { |
| | | label: "缴费信息", |
| | | prop: "pay", |
| | | }, { |
| | | label: "安装时间", |
| | | prop: "stime", |
| | | type: "datetime", |
| | | format: "yyyy-MM-dd", |
| | | valueFormat: "yyyy-MM-dd hh:mm:ss", |
| | | width: 130 |
| | | }, { |
| | | label: "到期时间", |
| | | prop: "expireTime", |
| | | width: 130 |
| | | type: "datetime", |
| | | slot: true, |
| | | format: "yyyy-MM-dd", |
| | | valueFormat: "yyyy-MM-dd hh:mm:ss", |
| | | width: 150 |
| | | }, { |
| | | label: "最后上传时间", |
| | | prop: "heartbeat", |
| | | type: "datetime", |
| | | format: "yyyy-MM-dd", |
| | | valueFormat: "yyyy-MM-dd hh:mm:ss", |
| | | width: 130 |
| | | }, |
| | | |
| | |
| | | if (releaseTimeRange) { |
| | | values = { |
| | | ...params, |
| | | releaseTime_datege: releaseTimeRange[0], |
| | | releaseTime_datelt: releaseTimeRange[1], |
| | | beginTime: releaseTimeRange[0], |
| | | endTime: releaseTimeRange[1], |
| | | ...this.query |
| | | }; |
| | | values.releaseTimeRange = null; |
| | | } else { |
| | | values = { |
| | | ...params, |
| | | ...this.query |
| | | }; |
| | | } |
| | | this.loading = true; |
| | | getList(page.currentPage, page.pageSize, values, this.treeDeptId).then(res => { |
| | | const data = res.data.data; |
| | | this.page.total = data.total; |
| | | |
| | | var Dqdate = new Date().getTime(); |
| | | |
| | | for (var i = 0; i < data.records.length; i++) { |
| | | var date = new Date(data.records[i].heartbeat).getTime(); |
| | | if ((Dqdate - date) >= (60 * 60 * 24 * 1000)) { |
| | | data.records[i].dxzt = 0; |
| | | } else if (data.records[i].heartbeat == "") { |
| | | data.records[i].dxzt = 0; |
| | | } else { |
| | | data.records[i].dxzt = 1; |
| | | } |
| | | } |
| | | |
| | | data.records.sort((a,b)=>{ |
| | | return a.dxzt - b.dxzt; |
| | | }); |
| | | |
| | | this.data = data.records; |
| | | this.loading = false; |
| | | this.selectionClear(); |
| | | }); |
| | | }, rowStyle({row, column, rowIndex}) { |
| | | if (row.heartbeat != null && row.heartbeat != "" ) { |
| | | if (row.heartbeat != null && row.heartbeat != "") { |
| | | var date = new Date(row.heartbeat).getTime(); |
| | | var Dqdate = new Date().getTime(); |
| | | if ((Dqdate - date) >= (60 * 60 * 24 * 1000)) { |
| | | return { |
| | | color: "#15a2fe" |
| | | color: "#fe1515" |
| | | }; |
| | | } |
| | | |
| | | }else if(row.heartbeat == ""){ |
| | | } else if (row.heartbeat == "") { |
| | | return { |
| | | color: "#15a2fe" |
| | | color: "#fe1515" |
| | | }; |
| | | } |
| | | }, |
| | | payWin() { |
| | | var that = this; |
| | | getAll().then(res => { |
| | | var data = res.data.data; |
| | | var lists = []; |
| | | var xb = 0; |
| | | for (var i = 0; i < data.length; i++) { |
| | | if (data[i].type == "1") { |
| | | xb++; |
| | | data[i].xb = xb; |
| | | lists.push(data[i]); |
| | | } |
| | | } |
| | | if (lists.length > 0) { |
| | | that.gridData = lists; |
| | | that.dialogTableVisible = true; |
| | | } |
| | | }); |
| | | |
| | | } |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style> |
| | | .payWin { |
| | | overflow-y: auto; |
| | | height: 350px; |
| | | } |
| | | |
| | | .payWin .el-dialog__body { |
| | | padding-top: 0px !important; |
| | | } |
| | | |
| | | </style> |