zhangdan 4 年 前
コミット
39e9c29b72

+ 22 - 3
src/api/cleanManage.js

@@ -4,7 +4,7 @@ import { axios } from '@/utils/request'
 
 // 列表
 export const cleanRecordList = (params) => {
-  const url = `cleanStation/queryCleanStationByStation/${params.pageNo}/${params.pageSize}`
+  const url = `cleanStationDevice/queryCountByStation/${params.pageNo}/${params.pageSize}`
   delete params.pageNo
   delete params.pageSize
   return axios({
@@ -16,7 +16,7 @@ export const cleanRecordList = (params) => {
 
 // 总计
 export const getCleanStationTotal = (params) => {
-  const url = `cleanStation/getCleanStationTotal`
+  const url = `cleanStationDevice/getCleanStationDeviceTotal`
   return axios.request({
     url: url,
     data: params,
@@ -81,7 +81,7 @@ export const cleanUserList = (params) => {
 
 // 待清运列表
 export const netWorkCleanRecordList = (params) => {
-  const url = `clean/waitToClean/${params.pageNo}/${params.pageSize}`
+  const url = `cleanStation/waitToClean/${params.pageNo}/${params.pageSize}`
   delete params.pageNo
   delete params.pageSize
   return axios({
@@ -91,6 +91,25 @@ export const netWorkCleanRecordList = (params) => {
   })
 }
 
+// 总计
+export const getCleanStationSum = (params) => {
+  const url = `cleanStation/waitToClean/sum`
+  return axios.request({
+    url: url,
+    data: params,
+    method: 'post'
+  })
+}
+
+// 立即清运
+export const cleanByDevice = params => {
+  return axios({
+    url: 'cleanStationDevice/cleanByDevice',
+    data: params,
+    method: 'POST'
+  })
+}
+
 // 司机管理
 // 重置密码
 export const resetPSD = params => {

+ 2 - 2
src/views/cleanManage/netWorkCleanModal.vue

@@ -54,8 +54,8 @@ export default {
       loadData: parameter => {
         const searchDateModal = this.searchDate
         if (this.searchDate && this.searchDate.length) {
-          searchDateModal.beginDate = moment(this.searchDate[0]).format('YYYY-MM-DD')
-          searchDateModal.endDate = moment(this.searchDate[1]).format('YYYY-MM-DD')
+          searchDateModal.beginDate = moment(this.searchDate[0]).format('YYYY-MM-DD 00:00:00')
+          searchDateModal.endDate = moment(this.searchDate[1]).format('YYYY-MM-DD 23:59:59')
         } else {
           searchDateModal.beginDate = null
           searchDateModal.endDate = null

+ 1 - 1
src/views/cleanManage/netWorkCleanRecord.vue

@@ -176,7 +176,7 @@ export default {
       getCleanStationTotal(params).then(res => {
         if (res.status == 200) {
           if (res.data != 0 || null) {
-            this.cleanWeightTotal = (res.data / 1000).toFixed(2)
+            this.cleanWeightTotal = (res.data.cleanWeight / 1000).toFixed(2)
           }
         } else {
           this.cleanWeightTotal = 0

+ 428 - 343
src/views/cleanManage/notCleanNetwork.vue

@@ -1,351 +1,436 @@
 <template>
-  <a-card :bordered="false" class="cleanDetail-container">
-    <!-- 搜索条件 -->
-    <div class="cleanDetail-container-searchForm">
-      <a-form-model
-        ref="queryParam"
-        :model="queryParam"
-        layout="inline"
-        @keyup.enter.native="$refs.table.refresh(true)"
-        v-bind="formItemLayout">
-        <a-row :gutter="24">
-          <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="notCleanNetwork-time"
-                v-model="time"
-                style="width: 100%;"
-                :format="dateFormat"
-                :placeholder="['开始时间','结束时间']"
-                :disabledDate="disabledDate"
-                @change="onChange" />
-            </a-form-model-item>
-          </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-select
-                id="notCleanNetwork-stationNo"
-                placeholder="请选择网点名称"
-                allowClear
-                v-model="queryParam.stationNo"
-                :showSearch="true"
-                option-filter-prop="children"
-                :filter-option="filterOption">
-                <a-select-option v-for="item in optionData" :key="item.stationNo" :value="item.stationNo">{{ 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 label="设备编号" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
-              <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-form-model-item label="排序规则" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
-              <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 :xs="24" :sm="12" :md="6" :lg="4">
-            <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="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="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="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>
-          </a-col>
-        </a-row>
-      </a-form-model>
-    </div>
-    <!-- 合计 -->
-    <a-alert type="info" showIcon style="margin-bottom:15px">
-      <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 >
-      <template slot="customTitle">
-        <a-tooltip placement="top">
-          <template slot="title">
-            <span>1.可回收垃圾库存量:当箱体未清运过时,库存量即投递量;当箱体清运过时,库存量即最近一次清运时间后的投递量。2.红色:表示投递重量最大的分类。</span>
-          </template>
-          可回收垃圾库存量(kg)
-          <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/1000).toFixed(2) || 0 }}</span>
-      </template>
-      <!-- 废旧纸张 -->
-      <template slot="paper" slot-scope="text,record">
-        <span :style="{ color: record.maxVal==record.paper ? 'red' : '' }">{{ (record.paper/1000).toFixed(2) || 0 }}</span>
-      </template>
-      <!-- 废旧塑料 -->
-      <template slot="plastic" slot-scope="text,record">
-        <span :style="{ color: record.maxVal==record.plastic ? 'red' : '' }">{{ (record.plastic/1000).toFixed(2) || 0 }}</span>
-      </template>
-      <!-- 废旧金属 -->
-      <template slot="metal" slot-scope="text,record">
-        <span :style="{ color: record.maxVal==record.metal ? 'red' : '' }">{{ (record.metal/1000).toFixed(2) || 0 }}</span>
-      </template>
-      <!-- 废旧金属/塑料 -->
-      <template slot="metPla" slot-scope="text,record">
-        <span :style="{ color: record.maxVal==record.metPla ? 'red' : '' }">{{ (record.metPla/1000).toFixed(2) || 0 }}</span>
-      </template>
-      <!-- 废旧玻璃 -->
-      <template slot="glass" slot-scope="text,record">
-        <span :style="{ color: record.maxVal==record.glass ? 'red' : '' }">{{ (record.glass/1000).toFixed(2) || 0 }}</span>
-      </template>
-      <!-- 可回收物 -->
-      <template slot="recycling" slot-scope="text,record">
-        <span :style="{ color: record.maxVal==record.recycling ? 'red' : '' }">{{ record.recycling/1000 || 0 }}</span>
-      </template>
-      <!-- 操作 -->
-      <span slot="action" slot-scope="text,record">
-        <a-button type="primary" @click="handleDetail(record)">立即清运</a-button>
-      </span>
-    </s-table>
-    <!-- 清运弹窗 -->
-    <cleanModal :clernId="clernId" :openModal="isOpenModal" @close="closeCleanModal"></cleanModal>
-  </a-card>
+	<a-card :bordered="false" class="cleanDetail-container">
+		<!-- 搜索条件 -->
+		<div class="cleanDetail-container-searchForm">
+			<a-form-model ref="queryParam" :model="queryParam" layout="inline" @keyup.enter.native="$refs.table.refresh(true)"
+			 v-bind="formItemLayout">
+				<a-row :gutter="24">
+					<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="notCleanNetwork-time" v-model="time" style="width: 100%;" :format="dateFormat" :placeholder="['开始时间','结束时间']"
+							 :disabledDate="disabledDate" @change="onChange" />
+						</a-form-model-item>
+					</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-select id="notCleanNetwork-stationNo" placeholder="请选择网点名称" allowClear v-model="queryParam.stationNo"
+							 :showSearch="true" option-filter-prop="children" :filter-option="filterOption">
+								<a-select-option v-for="item in optionData" :key="item.stationNo" :value="item.stationNo">{{ 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 label="设备编号" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
+							<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-form-model-item label="排序规则" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
+							<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 :xs="24" :sm="12" :md="6" :lg="4">
+						<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="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="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="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>
+					</a-col>
+				</a-row>
+			</a-form-model>
+		</div>
+		<!-- 合计 -->
+		<a-alert type="info" showIcon style="margin-bottom:15px">
+			<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>
+			<template slot="customTitle">
+				<a-tooltip placement="top">
+					<template slot="title">
+						<span>1.可回收垃圾库存量:当箱体未清运过时,库存量即投递量;当箱体清运过时,库存量即最近一次清运时间后的投递量。2.红色:表示投递重量最大的分类。</span>
+					</template>
+					可回收垃圾库存量(kg)
+					<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/1000).toFixed(2) || 0 }}</span>
+			</template>
+			<!-- 废旧纸张 -->
+			<template slot="paper" slot-scope="text,record">
+				<span :style="{ color: record.maxVal==record.paper ? 'red' : '' }">{{ (record.paper/1000).toFixed(2) || 0 }}</span>
+			</template>
+			<!-- 废旧塑料 -->
+			<template slot="plastic" slot-scope="text,record">
+				<span :style="{ color: record.maxVal==record.plastic ? 'red' : '' }">{{ (record.plastic/1000).toFixed(2) || 0 }}</span>
+			</template>
+			<!-- 废旧金属 -->
+			<template slot="metal" slot-scope="text,record">
+				<span :style="{ color: record.maxVal==record.metal ? 'red' : '' }">{{ (record.metal/1000).toFixed(2) || 0 }}</span>
+			</template>
+			<!-- 废旧金属/塑料 -->
+			<template slot="metPla" slot-scope="text,record">
+				<span :style="{ color: record.maxVal==record.metPla ? 'red' : '' }">{{ (record.metPla/1000).toFixed(2) || 0 }}</span>
+			</template>
+			<!-- 废旧玻璃 -->
+			<template slot="glass" slot-scope="text,record">
+				<span :style="{ color: record.maxVal==record.glass ? 'red' : '' }">{{ (record.glass/1000).toFixed(2) || 0 }}</span>
+			</template>
+			<!-- 可回收物 -->
+			<template slot="recycling" slot-scope="text,record">
+				<span :style="{ color: record.maxVal==record.recycling ? 'red' : '' }">{{ record.recycling/1000 || 0 }}</span>
+			</template>
+			<!-- 操作 -->
+			<span slot="action" slot-scope="text,record">
+				<a-button type="primary" @click="handleDetail(record)">立即清运</a-button>
+			</span>
+		</s-table>
+		<!-- 清运弹窗 -->
+		<cleanModal :clernId="clernId" :openModal="isOpenModal" @close="closeCleanModal"></cleanModal>
+	</a-card>
 </template>
 
 <script>
-import { STable, VSelect } from '@/components'
-import { stationList } from '@/api/releaseRecord.js'
-import { netWorkCleanRecordList } from '@/api/cleanManage.js'
-import { getProvince, getCityByPro, getDistrictByCity } from '@/api/station'
-import cleanModal from './cleanModal.vue'
-import moment from 'moment'
-export default {
-  components: { STable, VSelect, cleanModal },
-  data () {
-    return {
-      formItemLayout: {
-        labelCol: { span: 8 },
-        wrapperCol: { span: 16 }
-      },
-      isOpenModal: false, // 默认弹窗关闭
-      clernId: null, // 当前待清运记录id
-      orderTotal: '', //  总计条数
-      recyclableWasteTotal: '', //  可回收垃圾总计
-      wasteClothes: '', //  废旧衣物总计
-      wastePaper: '', //  废旧纸张总计
-      wasteMetal: '', //  废旧金属总计
-      wastePlastics: '', //  废旧塑料总计
-      wasteMetalPlastic: '', //  废旧金属/塑料总计
-      wasteGlass: '', //  废旧玻璃总计
-      recyclable: '', //  可回收物总计
-      queryParam: {
-        srcDeviceCode: undefined, // 设备编号
-        stationName: '', // 网点名称
-        orderType: 'max', // 排序规则
-        beginDate: null, // 开始时间
-        endDate: null, // 结束时间
-        provinceCode: undefined, //  省
-        cityCode: undefined, // 市
-        districtCode: undefined // 区
-      },
-      optionData: [], // 网点列表数据
-      addrProvinceList: [], //  省下拉
-      addrCityList: [], //  市下拉
-      addrDistrictList: [], //  区下拉
-      // 将默认当天时间日期回显在时间选择框中
-      time: [],
-      dateFormat: 'YYYY-MM-DD', // 日期格式
-      columns: [
-        { title: '网点名称', dataIndex: 'stationName', width: 100, align: 'center' },
-        { title: '设备编号', dataIndex: 'srcDeviceCode', width: 100, align: 'center', customRender: (text) => { return text || '--' } },
-        { slots: { title: 'customTitle' },
-          children: [
-            { 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',customRender: (text) => { return (text/1000).toFixed(2) || 0 } },
-        { title: '最后清运时间', dataIndex: 'lastCleanDate', width: 100, align: 'center', customRender: (text) => { return text || '--' } },
-        { title: '操作', dataIndex: 'action', width: 100, align: 'center', scopedSlots: { customRender: 'action' } }
-      ],
-      // 加载数据方法 必须为 Promise 对象
-      loadData: parameter => {
-        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')
-        } else {
-          searchData.beginDate = null
-          searchData.endDate = null
-        }
-        return netWorkCleanRecordList(searchData).then(res => {
-          if (res.status == 200) {
-            for (let i = 0; i < res.data.list.length; i++) {
-              const _item = res.data.list[i]
-              //  找出可回收垃圾库存量最大的值
-              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
-              //   }
-              // })
-            }
-            return res.data
-			this.getTotal()
-          }
-        })
-      }
-    }
-  },
-  mounted () {
-    this.getStationList()
-    this.getProvinceList()
-  },
-  methods: {
-    // 不可选日期
-    disabledDate (date, dateStrings) {
-      return date && date.valueOf() > Date.now()
-    },
-    // 创建时间change
-    onChange (dates, dateStrings) {
-      if ((dates, dateStrings)) {
-        this.queryParam.beginDate = dateStrings[0]
-        this.queryParam.endDate = dateStrings[1]
-      }
-    },
-    filterOption (input, option) {
-      return (
-        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 => {
-        if (res.status == 200) {
-          this.addrProvinceList = res.data || []
-        } else {
-          this.addrProvinceList = []
-        }
-      })
-    },
-    // 获取城市列表
-    getCityList (val) {
-      this.addrCityList = []
-      this.addrDistrictList = []
-      this.queryParam.cityCode = undefined
-      this.queryParam.districtCode = undefined
-      this.getCityListRequest(val)
-    },
-    getCityListRequest (val) {
-      getCityByPro({ id: val }).then(res => {
-        if (res.status == 200) {
-          this.addrCityList = res.data || []
-        } else {
-          this.addrCityList = []
-        }
-      })
-    },
-    // 获取区县列表
-    getAreaList (val) {
-      this.addrDistrictList = []
-      this.queryParam.districtCode = undefined
-      this.getAreaListRequest(val)
-    },
-    getAreaListRequest (val) {
-      getDistrictByCity({ id: val }).then(res => {
-        if (res.status == 200) {
-          this.addrDistrictList = res.data || []
-        } else {
-          this.addrDistrictList = []
-        }
-      })
-    },
-	// 总计
-	getTotal(){
-		const params=this.queryParam
-		if (this.time && this.time.length) {
-			params.beginDate = moment(this.time[0]).format('YYYY-MM-DD')
-			params.endDate = moment(this.time[1]).format('YYYY-MM-DD')
-		} else {
-			params.beginDate = null
-			params.endDate = null
+	import {
+		STable,
+		VSelect
+	} from '@/components'
+	import {
+		stationList
+	} from '@/api/releaseRecord.js'
+	import {
+		netWorkCleanRecordList,
+		getCleanStationSum
+	} from '@/api/cleanManage.js'
+	import {
+		getProvince,
+		getCityByPro,
+		getDistrictByCity
+	} from '@/api/station'
+	import cleanModal from './cleanModal.vue'
+	import moment from 'moment'
+	export default {
+		components: {
+			STable,
+			VSelect,
+			cleanModal
+		},
+		data() {
+			return {
+				formItemLayout: {
+					labelCol: {
+						span: 8
+					},
+					wrapperCol: {
+						span: 16
+					}
+				},
+				isOpenModal: false, // 默认弹窗关闭
+				clernId: null, // 当前待清运记录id
+				orderTotal: '', //  总计条数
+				recyclableWasteTotal: '', //  可回收垃圾总计
+				wasteClothes: '', //  废旧衣物总计
+				wastePaper: '', //  废旧纸张总计
+				wasteMetal: '', //  废旧金属总计
+				wastePlastics: '', //  废旧塑料总计
+				wasteMetalPlastic: '', //  废旧金属/塑料总计
+				wasteGlass: '', //  废旧玻璃总计
+				recyclable: '', //  可回收物总计
+				queryParam: {
+					srcDeviceCode: undefined, // 设备编号
+					stationName: '', // 网点名称
+					orderType: 'max', // 排序规则
+					beginDate: null, // 开始时间
+					endDate: null, // 结束时间
+					provinceCode: undefined, //  省
+					cityCode: undefined, // 市
+					districtCode: undefined // 区
+				},
+				optionData: [], // 网点列表数据
+				addrProvinceList: [], //  省下拉
+				addrCityList: [], //  市下拉
+				addrDistrictList: [], //  区下拉
+				// 将默认当天时间日期回显在时间选择框中
+				time: [],
+				dateFormat: 'YYYY-MM-DD', // 日期格式
+				columns: [{title: '网点名称',dataIndex: 'stationName',width: 100,align: 'center'},
+					{title: '设备编号',dataIndex: 'srcDeviceCode',width: 100,align: 'center',customRender: (text) => {return text || '--'}},
+					{slots: {title: 'customTitle'},
+						children: [{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',
+						customRender: (text) => {
+							return (text / 1000).toFixed(2) || 0
+						}
+					},
+					{
+						title: '最后清运时间',
+						dataIndex: 'lastCleanDate',
+						width: 100,
+						align: 'center',
+						customRender: (text) => {
+							return text || '--'
+						}
+					},
+					{
+						title: '操作',
+						dataIndex: 'action',
+						width: 100,
+						align: 'center',
+						scopedSlots: {
+							customRender: 'action'
+						}
+					}
+				],
+				// 加载数据方法 必须为 Promise 对象
+				loadData: parameter => {
+					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')
+					} else {
+						searchData.beginDate = null
+						searchData.endDate = null
+					}
+					return netWorkCleanRecordList(searchData).then(res => {
+						if (res.status == 200) {
+							for (let i = 0; i < res.data.list.length; i++) {
+								const _item = res.data.list[i]
+								//  找出可回收垃圾库存量最大的值
+								const arr = [_item.clothes, _item.paper, _item.plastic, _item.metal, _item.metPla, _item.glass, _item.recycling]
+								const maxVal = Math.max(...arr)
+								_item.maxVal = maxVal
+							}
+							this.orderTotal = res.data.count || 0
+							this.getTotal()
+							return res.data
+						} else {
+							this.orderTotal = 0
+						}
+					})
+				}
+			}
+		},
+		mounted() {
+			this.getStationList()
+			this.getProvinceList()
+		},
+		methods: {
+			// 不可选日期
+			disabledDate(date, dateStrings) {
+				return date && date.valueOf() > Date.now()
+			},
+			// 创建时间change
+			onChange(dates, dateStrings) {
+				if ((dates, dateStrings)) {
+					this.queryParam.beginDate = dateStrings[0]
+					this.queryParam.endDate = dateStrings[1]
+				}
+			},
+			filterOption(input, option) {
+				return (
+					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 => {
+					if (res.status == 200) {
+						this.addrProvinceList = res.data || []
+					} else {
+						this.addrProvinceList = []
+					}
+				})
+			},
+			// 获取城市列表
+			getCityList(val) {
+				this.addrCityList = []
+				this.addrDistrictList = []
+				this.queryParam.cityCode = undefined
+				this.queryParam.districtCode = undefined
+				this.getCityListRequest(val)
+			},
+			getCityListRequest(val) {
+				getCityByPro({
+					id: val
+				}).then(res => {
+					if (res.status == 200) {
+						this.addrCityList = res.data || []
+					} else {
+						this.addrCityList = []
+					}
+				})
+			},
+			// 获取区县列表
+			getAreaList(val) {
+				this.addrDistrictList = []
+				this.queryParam.districtCode = undefined
+				this.getAreaListRequest(val)
+			},
+			getAreaListRequest(val) {
+				getDistrictByCity({
+					id: val
+				}).then(res => {
+					if (res.status == 200) {
+						this.addrDistrictList = res.data || []
+					} else {
+						this.addrDistrictList = []
+					}
+				})
+			},
+			// 总计
+			getTotal() {
+				const params = this.queryParam
+				if (this.time && this.time.length) {
+					params.beginDate = moment(this.time[0]).format('YYYY-MM-DD')
+					params.endDate = moment(this.time[1]).format('YYYY-MM-DD')
+				} else {
+					params.beginDate = null
+					params.endDate = null
+				}
+				getCleanStationSum(params).then(res => {
+					if (res.status == 200) {
+						this.recyclableWasteTotal = (res.data.totalWeight / 1000).toFixed(2) || 0
+						this.wastePaper = (res.data.paper / 1000).toFixed(2) || 0
+						
+						this.wasteClothes = (res.data.clothes / 1000).toFixed(2) || 0
+						this.wasteMetal = (res.data.metal / 1000).toFixed(2) || 0
+						this.wastePlastics = (res.data.plastic / 1000).toFixed(2) || 0
+						this.wasteMetalPlastic = (res.data.metPla / 1000).toFixed(2) || 0
+						this.wasteGlass = (res.data.glass / 1000).toFixed(2) || 0
+						this.recyclable = (res.data.recycling / 1000).toFixed(2) || 0
+					} else {
+						this.recyclableWasteTotal = 0
+						this.wasteClothes =0
+						this.wastePaper = 0
+						this.wasteMetal = 0
+						this.wastePlastics = 0
+						this.wasteMetalPlastic = 0
+						this.wasteGlass = 0
+						this.recyclable = 0
+					}
+				})
+			},
+			// 重置
+			reset() {
+				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
+			}
 		}
-		// getCleanStationTotal(params).then(res => {
-		//   if (res.status == 200) {
-		//     if (res.data != 0 || null) {
-		//       this.cleanWeightTotal = (res.data / 1000).toFixed(2)
-		//     }
-		//   } else {
-		//     this.cleanWeightTotal = 0
-		//   }
-		// })
-	},
-    // 重置
-    reset () {
-      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
-    }
-  }
-}
+	}
 </script>
 
 <style lang='less' scoped>

+ 150 - 44
src/views/cleanManage/statisticalReport.vue

@@ -63,7 +63,7 @@
       <!-- 各回收物类型数据 -->
       <a-card class="panel " title="各回收物类型清运数据">
         <a-row :gutter="24">
-          <a-col :md="4" :lg="4">
+          <a-col :md="2" :lg="3">
             <a-card class="border-radius background-skyblue">
               <div class="module-list ">
                 <p>废旧金属</p>
@@ -71,7 +71,7 @@
               </div>
             </a-card>
           </a-col>
-          <a-col :md="4" :lg="4">
+          <a-col :md="2" :lg="3">
             <a-card class="border-radius background-greenBlue">
               <div class="module-list ">
                 <p>废旧塑料</p>
@@ -79,13 +79,44 @@
               </div>
             </a-card>
           </a-col>
-          <a-col :md="4" :lg="4">
-            <a-card class="border-radius background-blackGreen">
+          <a-col :md="2" :lg="3">
+            <a-card class="border-radius background-yellow">
               <div class="module-list ">
                 <p>废旧纸张</p>
                 <span>{{ chartData.DLX }}kg</span>
               </div>
-
+            </a-card>
+          </a-col>
+          <a-col :md="2" :lg="3">
+            <a-card class="border-radius background-pop">
+              <div class="module-list ">
+                <p>废旧玻璃</p>
+                <span>{{ chartData.DLX }}kg</span>
+              </div>
+            </a-card>
+          </a-col>
+          <a-col :md="2" :lg="3">
+            <a-card class="border-radius background-black">
+              <div class="module-list ">
+                <p>废旧衣物</p>
+                <span>{{ chartData.DLX }}kg</span>
+              </div>
+            </a-card>
+          </a-col>
+          <a-col :md="2" :lg="3">
+            <a-card class="border-radius background-pink">
+              <div class="module-list ">
+                <p>废旧金属/塑料</p>
+                <span>{{ chartData.DLX }}kg</span>
+              </div>
+            </a-card>
+          </a-col>
+          <a-col :md="2" :lg="3">
+            <a-card class="border-radius background-orange">
+              <div class="module-list ">
+                <p>可回收物</p>
+                <span>{{ chartData.DLX }}kg</span>
+              </div>
             </a-card>
           </a-col>
         </a-row>
@@ -125,35 +156,41 @@
           </a-col>
         </a-row>
       </a-card>
-      <a-card class="panel chart-pie" title="各回收物类型占比">
-        <a-row :gutter="24">
-          <a-col span="12">
-            <chart-pie
-              ref="chartPie"
-              class="chartPie-box"
-              :searchData="XdaysData"
-              :value="washTypePieData"
-              title="清运总量(kg)"
-              :total="chartData.allOrderNum"
-              :color="washTypePieColor"
-              :xAxisRotate="resize"
-              text="" />
-          </a-col>
-          <a-col span="12">
-            <!-- 各清运司机占比 百分比展示 -->
-            <chart-pie
-              ref="serverChartPie"
-              class="chartPie-box"
-              :searchData="XdaysData"
-              :value="couponChartData"
-              title="清运总量(台)"
-              :total="chartData.allOrderNum"
-              :color="couponColor"
-              :xAxisRotate="resize"
-              text="" />
-          </a-col>
-        </a-row>
-      </a-card>
+      <div style="display: flex;justify-content: space-between;">
+        <a-card class="panel chart-pie" title="各回收物类型占比" style="width: 49.5%;">
+          <a-row :gutter="24">
+            <a-col span="12">
+              <chart-pie
+                ref="chartPie"
+                class="chartPie-box"
+                :searchData="XdaysData"
+                :value="washTypePieData"
+                title="清运总量(kg)"
+                :total="chartData.allOrderNum"
+                :color="washTypePieColor"
+                :xAxisRotate="resize"
+                text="" />
+            </a-col>
+          </a-row>
+        </a-card>
+        <a-card class="panel chart-pie" title="各清运司机占比" style="width: 49.5%;">
+          <a-row :gutter="24">
+            <a-col span="12">
+              <!-- 各清运司机占比 百分比展示 -->
+              <chart-pie
+                ref="serverChartPie"
+                class="chartPie-box"
+                :searchData="XdaysData"
+                :value="couponChartData"
+                title="清运总量(kg)"
+                :total="chartData.allOrderNum"
+                :color="couponColor"
+                :xAxisRotate="resize"
+                text="" />
+            </a-col>
+          </a-row>
+        </a-card>
+      </div>
     </div>
   </div>
 </template>
@@ -212,31 +249,59 @@ export default {
     // 各类型占比总计数据
     washTypePieData () {
       const data = [{
-        'name': '快速洗车',
+        'name': '废旧塑料',
         'value': this.chartData.KX
       }, {
-        'name': '精致洗车',
+        'name': '废旧金属',
         'value': this.chartData.JX
       }, {
-        'name': '打蜡精洗',
+        'name': '废旧塑料/金属',
         'value': this.chartData.DLX
-      }]
+      }, {
+        'name': '废旧纸张',
+        'value': this.chartData.DLX
+      }, {
+        'name': '废旧玻璃',
+        'value': this.chartData.DLX
+      }, {
+	    'name': '废旧衣物',
+	    'value': this.chartData.DLX
+	  }, {
+	    'name': '可回收物',
+	    'value': this.chartData.DLX
+	  }]
       return data
     },
     // 洗车用券量占比数据
     couponChartData () {
       const data = [
         {
-          'name': '未用券洗车量',
+          'name': '废旧塑料',
           'value': this.chartData.notUseCouponOrderNum
         },
         {
-          'name': '用券洗车量',
+          'name': '废旧纸张',
           'value': this.chartData.useCouponOrderNum
         },
         {
-          'name': '用券洗车量11',
+          'name': '废旧玻璃',
           'value': this.chartData.useCouponOrderNum
+        },
+        {
+		  'name': '废旧塑料/金属',
+		  'value': this.chartData.useCouponOrderNum
+        },
+        {
+		  'name': '废旧金属',
+		  'value': this.chartData.useCouponOrderNum
+        },
+        {
+		  'name': '废旧衣物',
+		  'value': this.chartData.useCouponOrderNum
+        },
+        {
+		  'name': '可回收物',
+		  'value': this.chartData.useCouponOrderNum
         }
       ]
       return data
@@ -313,7 +378,27 @@ export default {
         name: '打蜡精洗',
         type: 'bar',
         data: []
-      }
+      },
+	  {
+	    name: '打蜡精洗',
+	    type: 'bar',
+	    data: []
+	  },
+	  {
+	    name: '打蜡精洗',
+	    type: 'bar',
+	    data: []
+	  },
+	  {
+	    name: '打蜡精洗',
+	    type: 'bar',
+	    data: []
+	  },
+	  {
+	    name: '打蜡精洗',
+	    type: 'bar',
+	    data: []
+	  }
       ],
       // 洗车类型折线图表数据
       washTypeLineData: [{
@@ -330,7 +415,27 @@ export default {
         name: '打蜡精洗',
         type: 'line',
         data: []
-      }
+      },
+	  {
+	    name: '打蜡精洗',
+	    type: 'bar',
+	    data: []
+	  },
+	  {
+	    name: '打蜡精洗',
+	    type: 'bar',
+	    data: []
+	  },
+	  {
+	    name: '打蜡精洗',
+	    type: 'bar',
+	    data: []
+	  },
+	  {
+	    name: '打蜡精洗',
+	    type: 'bar',
+	    data: []
+	  }
       ],
       // 各类型占比
       washTypePieColor: ['#ffaa00', '#00ff00', '#00aaff', '#ff55ff', '#1dc5d4', '#8465c7', '#00ffff'],
@@ -535,7 +640,7 @@ export default {
     }
 
     .panel {
-      margin-top: 10px;
+      margin-top: 10px ;
       background-color: #FFFFFF;
 
       .noData {
@@ -549,6 +654,7 @@ export default {
       .chartPie-box{
         height: 300px;
         width: 100%;
+
       }
       .panel-title {
         font-size: 18px;