|
@@ -12,7 +12,7 @@
|
|
|
<a-col :xs="24" :sm="12" :md="6" :lg="5">
|
|
|
<a-form-model-item label="最后清运时间" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
|
|
|
<a-range-picker
|
|
|
- id="netWorkCleanRecord-time"
|
|
|
+ id="notCleanNetwork-time"
|
|
|
v-model="time"
|
|
|
style="width: 100%;"
|
|
|
:format="dateFormat"
|
|
@@ -24,7 +24,7 @@
|
|
|
<a-col :xs="24" :sm="12" :md="6" :lg="5">
|
|
|
<a-form-model-item label="网点名称" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
|
|
|
<a-select
|
|
|
- id="netWorkCleanRecord-stationNo"
|
|
|
+ id="notCleanNetwork-stationNo"
|
|
|
placeholder="请选择网点名称"
|
|
|
allowClear
|
|
|
v-model="queryParam.stationNo"
|
|
@@ -37,37 +37,37 @@
|
|
|
</a-col>
|
|
|
<a-col :xs="24" :sm="12" :md="6" :lg="5">
|
|
|
<a-form-model-item label="设备编号" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
|
|
|
- <a-input allowClear placeholder="请输入设备编号" v-model.trim="queryParam.srcDeviceCode" id="netWorkCleanRecord-stationNo"/>
|
|
|
+ <a-input allowClear placeholder="请输入设备编号" v-model.trim="queryParam.srcDeviceCode" id="notCleanNetwork-stationNo"/>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
- <!-- <a-col :xs="24" :sm="12" :md="6" :lg="5">
|
|
|
+ <a-col :xs="24" :sm="12" :md="6" :lg="5">
|
|
|
<a-form-model-item label="排序规则" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
|
|
|
- <v-select code="ENABLE_FLAG" v-model="queryParam.loginFlag" allowClear placeholder="请选择操作人" id="netWorkCleanRecord-stationNo" ></v-select>
|
|
|
+ <v-select code="WAIT_CLEAN_SORT_RULE" v-model="queryParam.orderType" allowClear placeholder="请选择" id="notCleanNetwork-stationNo" ></v-select>
|
|
|
</a-form-model-item>
|
|
|
- </a-col> -->
|
|
|
+ </a-col>
|
|
|
<a-col :xs="24" :sm="12" :md="6" :lg="4">
|
|
|
- <a-button type="primary" @click="$refs.table.refresh(true)" id="netWorkCleanRecord-refresh" style="margin: 4px 10px 0 20px">查询</a-button>
|
|
|
- <a-button type="" @click="reset" id="netWorkCleanRecord-reset" style="margin-top: 4px">重置</a-button>
|
|
|
+ <a-button type="primary" @click="$refs.table.refresh(true)" id="notCleanNetwork-refresh" style="margin: 4px 10px 0 20px">查询</a-button>
|
|
|
+ <a-button type="" @click="reset" id="notCleanNetwork-reset" style="margin-top: 4px">重置</a-button>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
<a-row :gutter="24">
|
|
|
<a-col :xs="24" :sm="12" :md="6" :lg="5">
|
|
|
- <a-form-model-item prop="provinceName" label="所属区域:" :label-col="{ span:8 }" :wrapper-col="{ span:16}">
|
|
|
- <a-select id="rubbishTotal-provinceName" allowClear v-model="queryParam.provinceName" @change="getCityList" placeholder="请选择省">
|
|
|
+ <a-form-model-item prop="provinceCode" label="所属区域:" :label-col="{ span:8 }" :wrapper-col="{ span:16}">
|
|
|
+ <a-select id="notCleanNetwork-provinceCode" allowClear v-model="queryParam.provinceCode" @change="getCityList" placeholder="请选择省">
|
|
|
<a-select-option v-for="item in addrProvinceList" :value="item.id" :key="item.id + 'a'">{{ item.name }}</a-select-option>
|
|
|
</a-select>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
<a-col :xs="24" :sm="12" :md="6" :lg="5">
|
|
|
- <a-form-model-item prop="cityName" label=" " :colon="false" :label-col="{ span:8 }" :wrapper-col="{ span:16}">
|
|
|
- <a-select allowClear id="rubbishTotal-cityName" v-model="queryParam.cityName" @change="getAreaList" placeholder="请选择市">
|
|
|
+ <a-form-model-item prop="cityCode" label=" " :colon="false" :label-col="{ span:8 }" :wrapper-col="{ span:16}">
|
|
|
+ <a-select allowClear id="notCleanNetwork-cityCode" v-model="queryParam.cityCode" @change="getAreaList" placeholder="请选择市">
|
|
|
<a-select-option v-for="item in addrCityList" :value="item.id" :key="item.id + 'b'">{{ item.name }}</a-select-option>
|
|
|
</a-select>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
<a-col :xs="24" :sm="12" :md="6" :lg="5">
|
|
|
- <a-form-model-item prop="districtName" label=" " :colon="false" :label-col="{ span:8}" :wrapper-col="{ span:16}">
|
|
|
- <a-select allowClear id="rubbishTotal-districtName" v-model="queryParam.districtName" placeholder="请选择区/县">
|
|
|
+ <a-form-model-item prop="districtCode" label=" " :colon="false" :label-col="{ span:8}" :wrapper-col="{ span:16}">
|
|
|
+ <a-select allowClear id="notCleanNetwork-districtCode" v-model="queryParam.districtCode" placeholder="请选择区/县">
|
|
|
<a-select-option v-for="item in addrDistrictList" :value="item.id" :key="item.id + 'c'">{{ item.name }}</a-select-option>
|
|
|
</a-select>
|
|
|
</a-form-model-item>
|
|
@@ -77,16 +77,10 @@
|
|
|
</div>
|
|
|
<!-- 合计 -->
|
|
|
<a-alert type="info" showIcon style="margin-bottom:15px">
|
|
|
- <div class="ftext" slot="message">总计<span> {{ }} </span>条,可回收垃圾总计<span> {{ }} </span>kg。 其中,废旧衣物<span> {{ }} </span>kg,废旧纸张<span> {{ }} </span>kg,废旧金属<span> {{ }} </span>kg,废旧塑料<span> {{ }} </span>kg,废旧金属/塑料<span> {{ }} </span>kg,废旧玻璃<span> {{ }} </span>kg,可回收物<span> {{ }} </span>kg</div>
|
|
|
+ <div class="ftext" slot="message">总计<span> {{ orderTotal }} </span>条,可回收垃圾总计<span> {{ recyclableWasteTotal }} </span>kg。 其中,废旧衣物<span> {{ wasteClothes }} </span>kg,废旧纸张<span> {{ wastePaper }} </span>kg,废旧金属<span> {{ wasteMetal }} </span>kg,废旧塑料<span> {{ wastePlastics }} </span>kg,废旧金属/塑料<span> {{ wasteMetalPlastic }} </span>kg,废旧玻璃<span> {{ wasteGlass }} </span>kg,可回收物<span> {{ recyclable }} </span>kg</div>
|
|
|
</a-alert>
|
|
|
<!-- 列表 -->
|
|
|
- <s-table
|
|
|
- ref="table"
|
|
|
- :rowKey="(record) => record.id"
|
|
|
- :columns="columns"
|
|
|
- :data="loadData"
|
|
|
- bordered
|
|
|
- >
|
|
|
+ <s-table ref="table" :rowKey="(record) => record.id" :columns="columns" :data="loadData" bordered >
|
|
|
<template slot="customTitle">
|
|
|
<a-tooltip placement="top">
|
|
|
<template slot="title">
|
|
@@ -96,13 +90,41 @@
|
|
|
<a-icon type="question-circle" :style="{ color: '#1890FF' }" />
|
|
|
</a-tooltip>
|
|
|
</template>
|
|
|
+ <!-- 废旧衣物 -->
|
|
|
+ <template slot="clothes" slot-scope="text,record">
|
|
|
+ <span :style="{ color: record.maxVal==record.clothes ? 'red' : '' }">{{ record.clothes || 0 }}</span>
|
|
|
+ </template>
|
|
|
+ <!-- 废旧纸张 -->
|
|
|
+ <template slot="paper" slot-scope="text,record">
|
|
|
+ <span :style="{ color: record.maxVal==record.paper ? 'red' : '' }">{{ record.paper || 0 }}</span>
|
|
|
+ </template>
|
|
|
+ <!-- 废旧塑料 -->
|
|
|
+ <template slot="plastic" slot-scope="text,record">
|
|
|
+ <span :style="{ color: record.maxVal==record.plastic ? 'red' : '' }">{{ record.plastic || 0 }}</span>
|
|
|
+ </template>
|
|
|
+ <!-- 废旧金属 -->
|
|
|
+ <template slot="metal" slot-scope="text,record">
|
|
|
+ <span :style="{ color: record.maxVal==record.metal ? 'red' : '' }">{{ record.metal || 0 }}</span>
|
|
|
+ </template>
|
|
|
+ <!-- 废旧金属/塑料 -->
|
|
|
+ <template slot="metPla" slot-scope="text,record">
|
|
|
+ <span :style="{ color: record.maxVal==record.metPla ? 'red' : '' }">{{ record.metPla || 0 }}</span>
|
|
|
+ </template>
|
|
|
+ <!-- 废旧玻璃 -->
|
|
|
+ <template slot="glass" slot-scope="text,record">
|
|
|
+ <span :style="{ color: record.maxVal==record.glass ? 'red' : '' }">{{ record.glass || 0 }}</span>
|
|
|
+ </template>
|
|
|
+ <!-- 可回收物 -->
|
|
|
+ <template slot="recycling" slot-scope="text,record">
|
|
|
+ <span :style="{ color: record.maxVal==record.recycling ? 'red' : '' }">{{ record.recycling || 0 }}</span>
|
|
|
+ </template>
|
|
|
<!-- 操作 -->
|
|
|
<span slot="action" slot-scope="text,record">
|
|
|
<a-button type="primary" @click="handleDetail(record)">立即清运</a-button>
|
|
|
</span>
|
|
|
</s-table>
|
|
|
<!-- 清运弹窗 -->
|
|
|
- <cleanModal :id="itemId" :visible="isOpenModal" @close="isOpenModal=false"></cleanModal>
|
|
|
+ <cleanModal :clernId="clernId" :openModal="isOpenModal" @close="closeCleanModal"></cleanModal>
|
|
|
</a-card>
|
|
|
</template>
|
|
|
|
|
@@ -114,61 +136,62 @@ import { getProvince, getCityByPro, getDistrictByCity } from '@/api/station'
|
|
|
import cleanModal from './cleanModal.vue'
|
|
|
import moment from 'moment'
|
|
|
export default {
|
|
|
- components: {
|
|
|
- STable,
|
|
|
- VSelect,
|
|
|
- cleanModal
|
|
|
- },
|
|
|
+ components: { STable, VSelect, cleanModal },
|
|
|
data () {
|
|
|
return {
|
|
|
formItemLayout: {
|
|
|
- labelCol: {
|
|
|
- span: 8
|
|
|
- },
|
|
|
- wrapperCol: {
|
|
|
- span: 16
|
|
|
- }
|
|
|
+ labelCol: { span: 8 },
|
|
|
+ wrapperCol: { span: 16 }
|
|
|
},
|
|
|
isOpenModal: false, // 默认弹窗关闭
|
|
|
- itemId: '', // 行id
|
|
|
- // 查询参数
|
|
|
+ clernId: null, // 当前待清运记录id
|
|
|
+ orderTotal: '', // 总计条数
|
|
|
+ recyclableWasteTotal: '', // 可回收垃圾总计
|
|
|
+ wasteClothes: '', // 废旧衣物总计
|
|
|
+ wastePaper: '', // 废旧纸张总计
|
|
|
+ wasteMetal: '', // 废旧金属总计
|
|
|
+ wastePlastics: '', // 废旧塑料总计
|
|
|
+ wasteMetalPlastic: '', // 废旧金属/塑料总计
|
|
|
+ wasteGlass: '', // 废旧玻璃总计
|
|
|
+ recyclable: '', // 可回收物总计
|
|
|
queryParam: {
|
|
|
srcDeviceCode: undefined, // 设备编号
|
|
|
stationName: '', // 网点名称
|
|
|
- // login: '', // 状态
|
|
|
+ orderType: 'max', // 排序规则
|
|
|
beginDate: null, // 开始时间
|
|
|
endDate: null, // 结束时间
|
|
|
- provinceName: undefined, // 省
|
|
|
- districtName: undefined, // 市
|
|
|
+ provinceCode: undefined, // 省
|
|
|
+ cityCode: undefined, // 市
|
|
|
districtCode: undefined // 区
|
|
|
},
|
|
|
- // 网点名称数据
|
|
|
- optionData: [],
|
|
|
+ optionData: [], // 网点列表数据
|
|
|
addrProvinceList: [], // 省下拉
|
|
|
addrCityList: [], // 市下拉
|
|
|
addrDistrictList: [], // 区下拉
|
|
|
// 将默认当天时间日期回显在时间选择框中
|
|
|
time: [],
|
|
|
dateFormat: 'YYYY-MM-DD', // 日期格式
|
|
|
- columns: [{ title: '网点名称', dataIndex: 'no', width: 100, align: 'center' },
|
|
|
+ columns: [
|
|
|
+ { title: '网点名称', dataIndex: 'stationName', width: 100, align: 'center' },
|
|
|
{ title: '设备编号', dataIndex: 'srcDeviceCode', width: 100, align: 'center', customRender: (text) => { return text || '--' } },
|
|
|
{ slots: { title: 'customTitle' },
|
|
|
children: [
|
|
|
- { title: '废旧衣物', dataIndex: 'clothes', width: 100, align: 'center', customRender: (text) => { return text || 0 } },
|
|
|
- { title: '废旧纸张', dataIndex: 'paper', width: 100, align: 'center', customRender: (text) => { return text || 0 } },
|
|
|
- { title: '废旧塑料', dataIndex: 'plastic', width: 100, align: 'center', customRender: (text) => { return text || 0 } },
|
|
|
- { title: '废旧金属', dataIndex: 'metal', width: 100, align: 'center', customRender: (text) => { return text || 0 } },
|
|
|
- { title: '废旧金属/塑料', dataIndex: 'metPla', width: 100, align: 'center', customRender: (text) => { return text || 0 } },
|
|
|
- { title: '废旧玻璃', dataIndex: 'glass', width: 100, align: 'center', customRender: (text) => { return text || 0 } },
|
|
|
- { title: '可回收物', dataIndex: 'recycling', width: 100, align: 'center', customRender: (text) => { return text || 0 } }
|
|
|
+ { title: '废旧衣物', scopedSlots: { customRender: 'clothes' }, width: 100, align: 'center' },
|
|
|
+ { title: '废旧纸张', scopedSlots: { customRender: 'paper' }, width: 100, align: 'center' },
|
|
|
+ { title: '废旧塑料', scopedSlots: { customRender: 'plastic' }, width: 100, align: 'center' },
|
|
|
+ { title: '废旧金属', scopedSlots: { customRender: 'metal' }, width: 100, align: 'center' },
|
|
|
+ { title: '废旧金属/塑料', scopedSlots: { customRender: 'metPla' }, width: 100, align: 'center' },
|
|
|
+ { title: '废旧玻璃', scopedSlots: { customRender: 'glass' }, width: 100, align: 'center' },
|
|
|
+ { title: '可回收物', scopedSlots: { customRender: 'recycling' }, width: 100, align: 'center' }
|
|
|
]
|
|
|
},
|
|
|
{ title: '可回收垃圾小计(kg)', dataIndex: 'totalWeight', width: 100, align: 'center' },
|
|
|
{ title: '最后清运时间', dataIndex: 'lastCleanDate', width: 100, align: 'center', customRender: (text) => { return text || '--' } },
|
|
|
- { title: '操作', dataIndex: 'action', width: 100, align: 'center', scopedSlots: { customRender: 'action' } }],
|
|
|
+ { title: '操作', dataIndex: 'action', width: 100, align: 'center', scopedSlots: { customRender: 'action' } }
|
|
|
+ ],
|
|
|
// 加载数据方法 必须为 Promise 对象
|
|
|
loadData: parameter => {
|
|
|
- const searchData = Object.assign(parameter, this.queryParam, { orderType: 'max' })
|
|
|
+ const searchData = Object.assign(parameter, this.queryParam)
|
|
|
if (this.time && this.time.length) {
|
|
|
searchData.beginDate = moment(this.time[0]).format('YYYY-MM-DD')
|
|
|
searchData.endDate = moment(this.time[1]).format('YYYY-MM-DD')
|
|
@@ -176,20 +199,30 @@ export default {
|
|
|
searchData.beginDate = null
|
|
|
searchData.endDate = null
|
|
|
}
|
|
|
- return netWorkCleanRecordList({pageNo:1,pageSize:10}).then(res => {
|
|
|
+ return netWorkCleanRecordList(searchData).then(res => {
|
|
|
if (res.status == 200) {
|
|
|
- const no = (res.data.pageNo - 1) * res.data.pageSize
|
|
|
for (let i = 0; i < res.data.list.length; i++) {
|
|
|
const _item = res.data.list[i]
|
|
|
- _item.no = no + i + 1
|
|
|
- if (_item.cleanWeight != null || 0) {
|
|
|
- _item.cleanWeight = (_item.cleanWeight / 1000).toFixed(2)
|
|
|
- }
|
|
|
+ // 找出可回收垃圾库存量最大的值
|
|
|
+ const arr = [_item.clothes, _item.paper, _item.plastic, _item.metal, _item.metPla, _item.glass, _item.recycling]
|
|
|
+ const maxVal = Math.max(...arr)
|
|
|
+ _item.maxVal = maxVal
|
|
|
+ // const obj = [
|
|
|
+ // { 'clothes': _item.clothes },
|
|
|
+ // { 'paper': _item.paper },
|
|
|
+ // { 'plastic': _item.plastic },
|
|
|
+ // { 'metal': _item.metal },
|
|
|
+ // { 'metPla': _item.metPla },
|
|
|
+ // { 'glass': _item.glass },
|
|
|
+ // { 'recycling': _item.recycling }
|
|
|
+ // ]
|
|
|
+ // Object.keys(obj).forEach(key => {
|
|
|
+ // if (obj[key] == maxVal) {
|
|
|
+ // _item.maxName = key
|
|
|
+ // }
|
|
|
+ // })
|
|
|
}
|
|
|
- this.totalNum = res.data.count
|
|
|
return res.data
|
|
|
- } else {
|
|
|
- this.totalNum = 0
|
|
|
}
|
|
|
})
|
|
|
}
|
|
@@ -198,7 +231,6 @@ export default {
|
|
|
mounted () {
|
|
|
this.getStationList()
|
|
|
this.getProvinceList()
|
|
|
- this.queryParam.loginFlag = '1'
|
|
|
},
|
|
|
methods: {
|
|
|
// 不可选日期
|
|
@@ -217,14 +249,21 @@ export default {
|
|
|
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
|
|
)
|
|
|
},
|
|
|
- // 获取合作商数据
|
|
|
+ // 获取网点数据
|
|
|
getStationList () {
|
|
|
stationList().then(res => {
|
|
|
if (res.status == 200) {
|
|
|
this.optionData = res.data || []
|
|
|
+ } else {
|
|
|
+ this.optionData = []
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+ // 关闭清运弹框
|
|
|
+ closeCleanModal () {
|
|
|
+ this.clernId = null
|
|
|
+ this.isOpenModal = false
|
|
|
+ },
|
|
|
// 获取省列表
|
|
|
getProvinceList () {
|
|
|
getProvince().then(res => {
|
|
@@ -244,9 +283,7 @@ export default {
|
|
|
this.getCityListRequest(val)
|
|
|
},
|
|
|
getCityListRequest (val) {
|
|
|
- getCityByPro({
|
|
|
- id: val
|
|
|
- }).then(res => {
|
|
|
+ getCityByPro({ id: val }).then(res => {
|
|
|
if (res.status == 200) {
|
|
|
this.addrCityList = res.data || []
|
|
|
} else {
|
|
@@ -261,9 +298,7 @@ export default {
|
|
|
this.getAreaListRequest(val)
|
|
|
},
|
|
|
getAreaListRequest (val) {
|
|
|
- getDistrictByCity({
|
|
|
- id: val
|
|
|
- }).then(res => {
|
|
|
+ getDistrictByCity({ id: val }).then(res => {
|
|
|
if (res.status == 200) {
|
|
|
this.addrDistrictList = res.data || []
|
|
|
} else {
|
|
@@ -273,17 +308,19 @@ export default {
|
|
|
},
|
|
|
// 重置
|
|
|
reset () {
|
|
|
- this.queryParam = {
|
|
|
- stationNo: undefined,
|
|
|
- phone: '',
|
|
|
- loginFlag: '',
|
|
|
- beginDate: null,
|
|
|
- endDate: null
|
|
|
- }
|
|
|
+ this.queryParam.srcDeviceCode = undefined
|
|
|
+ this.queryParam.stationName = ''
|
|
|
+ this.queryParam.orderType = ''
|
|
|
+ this.queryParam.beginDate = null
|
|
|
+ this.queryParam.endDate = null
|
|
|
+ this.queryParam.provinceCode = undefined
|
|
|
+ this.queryParam.cityCode = undefined
|
|
|
+ this.queryParam.districtCode = undefined
|
|
|
this.time = []
|
|
|
},
|
|
|
// 查看清运详情
|
|
|
handleDetail (record) {
|
|
|
+ this.clernId = '11'
|
|
|
this.isOpenModal = true
|
|
|
}
|
|
|
}
|