chenrui 4 роки тому
батько
коміт
045a7fce31

+ 1 - 1
.env

@@ -2,4 +2,4 @@ NODE_ENV=production
 VUE_APP_PREVIEW=false
 VUE_APP_API_BASE_URL=http://carwash.zyucgj.com/cw-admin/
 VUE_APP_VERSION=V1.0.1
-VUE_APP_PRO_NAME=洗车机运营
+VUE_APP_PRO_NAME=洗车机运营管理平

+ 1 - 1
.env.development

@@ -2,4 +2,4 @@ NODE_ENV=development
 VUE_APP_PREVIEW=true
 VUE_APP_API_BASE_URL=/api
 VUE_APP_VERSION=V1.0.1
-VUE_APP_PRO_NAME=洗车机运营台-dev
+VUE_APP_PRO_NAME=洗车机运营管理平台-dev

+ 1 - 1
.env.preview

@@ -2,4 +2,4 @@ NODE_ENV=production
 VUE_APP_PREVIEW=true
 VUE_APP_API_BASE_URL=http://carwash.test.zyucgj.com/cw-admin/
 VUE_APP_VERSION=V1.0.1
-VUE_APP_PRO_NAME=洗车机运营台-pro
+VUE_APP_PRO_NAME=洗车机运营管理平台-pro

+ 1 - 1
public/index.html

@@ -5,7 +5,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="<%= BASE_URL %>logo.png">
-    <title>洗车机运营台</title>
+    <title>洗车机运营管理平台</title>
     <style>#loading-mask{position:fixed;left:0;top:0;height:100%;width:100%;background:#fff;user-select:none;z-index:9999;overflow:hidden}.loading-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-100%)}.loading-dot{animation:antRotate 1.2s infinite linear;transform:rotate(45deg);position:relative;display:inline-block;font-size:64px;width:64px;height:64px;box-sizing:border-box}.loading-dot i{width:22px;height:22px;position:absolute;display:block;background-color:#1890ff;border-radius:100%;transform:scale(.75);transform-origin:50% 50%;opacity:.3;animation:antSpinMove 1s infinite linear alternate}.loading-dot i:nth-child(1){top:0;left:0}.loading-dot i:nth-child(2){top:0;right:0;-webkit-animation-delay:.4s;animation-delay:.4s}.loading-dot i:nth-child(3){right:0;bottom:0;-webkit-animation-delay:.8s;animation-delay:.8s}.loading-dot i:nth-child(4){bottom:0;left:0;-webkit-animation-delay:1.2s;animation-delay:1.2s}@keyframes antRotate{to{-webkit-transform:rotate(405deg);transform:rotate(405deg)}}@-webkit-keyframes antRotate{to{-webkit-transform:rotate(405deg);transform:rotate(405deg)}}@keyframes antSpinMove{to{opacity:1}}@-webkit-keyframes antSpinMove{to{opacity:1}}</style>
     <!-- require cdn assets css -->
     <% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.css) { %>

+ 5 - 5
src/components/UploadFile/index.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="upload-file" :style="{width: maxNums>1?'100%':'auto'}">
+    <!-- previewFile 暂时去掉,否则不能正常回显 -->
     <a-upload
       :action="action"
       :listType="listType"
@@ -7,7 +8,6 @@
       @preview="handlePreview"
       @change="handleChange"
       :beforeUpload="beforeUpload"
-      :preview-file="previewFile"
       :data="params"
       :value="comVal"
     >
@@ -75,7 +75,7 @@ export default {
     value (a, b) {
       console.log(a, '=--====')
       this.comVal = a || ''
-      if (a == undefined) {
+      if (a === undefined) {
         this.fileList = []
       }
     }
@@ -116,7 +116,7 @@ export default {
       if (this.listType == 'text') {
         return
       }
-      console.log(file,'8888888888')
+      console.log(file, '8888888888')
       this.previewImage = file.url || file.thumbUrl
       // this.previewImage = file.response.data
       this.previewVisible = true
@@ -172,9 +172,9 @@ export default {
 
       // 文件大小
       const isLt2M = file.size / 1024 / 1024 < this.fileSize
-      if (!isLt2M ) {
+      if (!isLt2M) {
         if (tip != 0) {
-          if (this.fileType !='video/mp4') {
+          if (this.fileType != 'video/mp4') {
             this.$message.error('图片不能超过 ' + this.fileSize + 'MB!')
           } else {
             this.$message.error('视频不能超过 ' + this.fileSize + 'MB!')

+ 1 - 1
src/components/global.less

@@ -407,7 +407,7 @@ body {
 
     h1 {
       color: #fff;
-      font-size: 20px;
+      font-size: 16px;
       margin: 0 0 0 12px;
       font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
       font-weight: 600;

+ 1 - 1
src/store/modules/user.js

@@ -44,7 +44,7 @@ const user = {
           if (res.userid) {
             Vue.ls.set('hasError', 0)
             commit('SET_TOKEN', res.userid)
-            commit('SET_NAME', { name: res.username, welcome: welcome() })
+            commit('SET_NAME', { name: res.userNameCN, welcome: welcome() })
             commit('SET_AVATAR', res.avatar ? res.avatar : '')
             Vue.ls.set('rolesAccess', { permissionList: res.permCodes }, 7 * 24 * 60 * 60 * 1000)
             // 记住密码

+ 1 - 1
src/utils/domUtil.js

@@ -16,4 +16,4 @@ export const setDocumentTitle = function (title) {
   }
 }
 
-export const domTitle = '洗车机运营台'
+export const domTitle = '洗车机运营管理平台'

+ 186 - 158
src/views/CarWashManagement/AddCarWashModal.vue

@@ -5,16 +5,15 @@
     :width="1000"
     :footer="null"
     :destroyOnClose="true"
-    @cancel="isShow=false"
-    v-model="isShow">
+    @cancel="isShow = false"
+    v-model="isShow"
+  >
     <!-- 表单 -->
     <a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
       <a-row :gutter="20">
         <a-row>
           <a-col :span="12">
-            <a-form-model-item label="网点名称" prop="name">
-              <a-input v-model="form.name" :maxLength="20" placeholder="请输入网店名称,20个字以内" />
-            </a-form-model-item>
+            <a-form-model-item label="网点名称" prop="name"><a-input v-model="form.name" :maxLength="20" placeholder="请输入网店名称,20个字以内" /></a-form-model-item>
             <a-form-model-item label="地址" class="default-form-item form-item-required">
               <a-row :gutter="20">
                 <a-col :span="8">
@@ -53,9 +52,7 @@
                     listType="picture-card"
                     upText="上传图片"></Upload>
                 </a-col>
-                <a-col :span="16">
-                  <p class="pic-remarks">(尺寸为100*100px)</p>
-                </a-col>
+                <a-col :span="16"><p class="pic-remarks">(尺寸为100*100px)</p></a-col>
               </a-row>
             </a-form-model-item>
           </a-col>
@@ -72,13 +69,13 @@
                 <a-tag v-if="form.deviceDTOList.length > 0" color="blue">{{ deviceNo }}</a-tag>
               </a-col>
               <a-col :span="5">
-                <a-button type="primary" size="small" class="small-btn" @click="openEquipmentModal=true">选择</a-button>
+                <a-button type="primary" size="small" class="small-btn" v-if="pageType != 'edit'" @click="openEquipmentModal = true">选择</a-button>
               </a-col>
             </a-row>
           </a-form-model-item>
         </a-col>
         <a-col :span="12">
-          <a-form-model-item label="网点标签" prop="featuredServiceLabel" :rules="{required: true, message: '请选择网点标签', trigger: 'change'}">
+          <a-form-model-item label="网点标签" prop="featuredServiceLabel" :rules="{ required: true, message: '请选择网点标签', trigger: 'change' }">
             <v-select
               ref="featuredServiceLabel"
               v-model="featuredServiceLabel"
@@ -86,15 +83,14 @@
               mode="multiple"
               placeholder="请选择网点标签"
               showArrow
-              code="STORE_LABEL"></v-select>
+              code="STORE_LABEL"
+            ></v-select>
           </a-form-model-item>
         </a-col>
         <a-col :span="12">
           <a-form-model-item label="经度" prop="lng" class="default-form-item">
             <a-row :gutter="20">
-              <a-col :span="17">
-                <a-input-number v-model="form.lng" :min="0" :max="999" placeholder="请输入经度坐标" class="input-number-all" />
-              </a-col>
+              <a-col :span="17"><a-input-number v-model="form.lng" :min="-180" :max="180" placeholder="请输入经度坐标" class="input-number-all" /></a-col>
               <a-col :span="6">
                 <a href="https://lbs.qq.com/tool/getpoint/" target="_blank">
                   <a-button type="primary" size="small" icon="search" class="small-btn">查询坐标</a-button>
@@ -105,7 +101,7 @@
         </a-col>
         <a-col :span="12">
           <a-form-model-item label="纬度" prop="lat">
-            <a-input-number v-model="form.lat" :min="0" :max="999" placeholder="请输入纬度坐标" class="input-number-all" />
+            <a-input-number v-model="form.lat" :min="-90" :max="90" placeholder="请输入纬度坐标" class="input-number-all" />
           </a-form-model-item>
         </a-col>
         <a-col :span="12">
@@ -120,13 +116,25 @@
             <a-row :gutter="20">
               <a-col :span="11">
                 <a-form-model-item prop="beginTime">
-                  <a-time-picker v-model="form.beginTime" @change="isResetstoreItemPriceDTOList('beginTime', $event)" format="HH:mm" placeholder="请选择开始时间" class="time-picker" />
+                  <a-time-picker
+                    v-model="form.beginTime"
+                    @change="isResetstoreItemPriceDTOList('beginTime', $event)"
+                    format="HH:mm"
+                    placeholder="请选择开始时间"
+                    class="time-picker"
+                  />
                 </a-form-model-item>
               </a-col>
               <a-col :span="2">至</a-col>
               <a-col :span="11">
                 <a-form-model-item prop="endTime">
-                  <a-time-picker v-model="form.endTime" @change="isResetstoreItemPriceDTOList('endTime', $event)" format="HH:mm" placeholder="请选择结束时间" class="time-picker" />
+                  <a-time-picker
+                    v-model="form.endTime"
+                    @change="isResetstoreItemPriceDTOList('endTime', $event)"
+                    format="HH:mm"
+                    placeholder="请选择结束时间"
+                    class="time-picker"
+                  />
                 </a-form-model-item>
               </a-col>
             </a-row>
@@ -136,7 +144,11 @@
         <a-col :span="24">
           <a-form-model-item :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }" prop="storeItemPriceDTOList">
             <div slot="label" class="form-item-label">
-              <a-tooltip placement="right" arrow-point-at-center title="时段价格是指车主在不同时段洗车需要支付不同的价格,主要用于日间服务和夜间服务的差异化管理,达到调节流量、集客引流的效果。不同时段区间采用起始时间包含,结束时间不包含原则。例如:时段区间为06:00(含)-22:00(不含),普通洗车10元;时间区间为22:00(含)-06:00(不含),普通洗车8元。客户在6点00分01秒普通洗车为10元,客户在22点00分01秒普通洗车为8元。">
+              <a-tooltip
+                placement="right"
+                arrow-point-at-center
+                title="时段价格是指车主在不同时段洗车需要支付不同的价格,主要用于日间服务和夜间服务的差异化管理,达到调节流量、集客引流的效果。不同时段区间采用起始时间包含,结束时间不包含原则。例如:时段区间为06:00(含)-22:00(不含),普通洗车10元;时间区间为22:00(含)-06:00(不含),普通洗车8元。客户在6点00分01秒普通洗车为10元,客户在22点00分01秒普通洗车为8元。"
+              >
                 时段价格
                 <a-icon :style="{ fontSize: '18px', color: '#1890ff', verticalAlign: 'sub' }" type="question-circle" />
               </a-tooltip>
@@ -145,20 +157,27 @@
               <a-col :span="9">
                 <a-row :gutter="20">
                   <a-col :span="11">
-                    <a-form-model-item :prop="'storeItemPriceDTOList.'+ ind + '.beginTime'" :rules="{required: true, message: '请选择开始时间', trigger: 'change'}">
+                    <a-form-model-item
+                      :prop="'storeItemPriceDTOList.' + ind + '.beginTime'"
+                      :rules="{ required: true, message: '请选择开始时间', trigger: 'change' }"
+                    >
                       <a-time-picker v-model="item.beginTime" disabled format="HH:mm" placeholder="请选择" class="time-picker" />
                     </a-form-model-item>
                   </a-col>
                   <a-col :span="2">至</a-col>
                   <a-col :span="11">
-                    <a-form-model-item :prop="'storeItemPriceDTOList.'+ ind + '.endTime'" :rules="{required: true, message: '请选择结束时间', trigger: 'change'}">
+                    <a-form-model-item
+                      :prop="'storeItemPriceDTOList.' + ind + '.endTime'"
+                      :rules="{ required: true, message: '请选择结束时间', trigger: 'change' }"
+                    >
                       <a-time-picker
                         v-model="item.endTime"
                         :default-open-value="item.beginTime"
                         @change="isResetBelowstoreItemPriceDTOList($event, ind)"
                         format="HH:mm"
                         placeholder="请选择"
-                        class="time-picker" />
+                        class="time-picker"
+                      />
                     </a-form-model-item>
                   </a-col>
                 </a-row>
@@ -166,24 +185,29 @@
               <a-col :span="14">
                 <a-row :gutter="20">
                   <a-col :span="8" v-for="(priceItem, subInd) in item.currentPrices" :key="subInd">
-                    <a-form-model-item :prop="'storeItemPriceDTOList.'+ ind +'.currentPrices.'+ subInd + '.price'" :rules="{required: true, message: `请输入【${priceItem.name}】单价`, trigger: 'blur'}">
+                    <a-form-model-item
+                      :prop="'storeItemPriceDTOList.' + ind + '.currentPrices.' + subInd + '.price'"
+                      :rules="{ required: true, message: `请输入【${priceItem.name}】单价`, trigger: 'blur' }"
+                    >
                       <a-input-number
                         v-model="priceItem.price"
                         :min="0"
                         :max="999999"
                         :precision="2"
-                        :placeholder="'【'+ priceItem.name +'】单价'"
-                        class="input-number-s" />
+                        :placeholder="'【' + priceItem.name + '】单价'"
+                        class="input-number-s"
+                      />
                       <span class="unit">元</span>
                     </a-form-model-item>
                   </a-col>
                 </a-row>
               </a-col>
-              <a-col :span="1">
-                <a-icon type="delete" title="删除" @click="delstoreItemPriceDTOList(ind)" :style="{ fontSize: '20px', color: 'red' }" />
-              </a-col>
+              <a-col :span="1"><a-icon type="delete" title="删除" @click="delstoreItemPriceDTOList(ind)" :style="{ fontSize: '20px', color: 'red' }" /></a-col>
             </a-row>
-            <a-button type="dashed" @click="setTimeInterval" class="setTimeInterval"><a-icon type="plus" />添加时段</a-button>
+            <a-button type="dashed" @click="setTimeInterval" class="setTimeInterval">
+              <a-icon type="plus" />
+              添加时段
+            </a-button>
           </a-form-model-item>
         </a-col>
         <!-- 时段价格设置  end -->
@@ -207,11 +231,7 @@
     </a-form-model>
 
     <!-- 选择设备 -->
-    <choose-equipment
-      :openEquipmentModal="openEquipmentModal"
-      @close="closeChooseEquipment"
-    />
-
+    <choose-equipment :openEquipmentModal="openEquipmentModal" @close="closeChooseEquipment" />
   </a-modal>
 </template>
 
@@ -226,15 +246,18 @@ export default {
   name: 'AddCarWashModal',
   components: { VSelect, Upload, Editor, ChooseEquipment },
   props: {
-    openModal: { //  弹框是否展示
+    openModal: {
+      //  弹框是否展示
       type: Boolean,
       default: false
     },
-    pageType: { //  页面类型
+    pageType: {
+      //  页面类型
       type: String,
       default: ''
     },
-    carWashId: { //  网点id
+    carWashId: {
+      //  网点id
       type: String,
       default: ''
     }
@@ -264,45 +287,28 @@ export default {
         reminder: '' //  温馨提示
       },
       rules: {
-        icon: [
-          { required: true, message: '请选择网店照片', trigger: 'change' }
-        ],
-        name: [
-          { required: true, message: '请输入网店名称', trigger: 'blur' }
-        ],
-        addrProvince: [
-          { required: true, message: '请选择所在省份', trigger: 'change' }
-        ],
-        addrCity: [
-          { required: true, message: '请选择所在市', trigger: 'change' }
-        ],
-        addrDistrict: [
-          { required: true, message: '请选择所在区县', trigger: 'change' }
-        ],
-        addrDetail: [
-          { required: true, message: '请输入详细地址', trigger: 'blur' }
-        ],
-        deviceDTOList: [
-          { required: true, message: '请选择设备', trigger: 'change' }
-        ],
+        icon: [{ required: true, message: '请选择网店照片', trigger: 'change' }],
+        name: [{ required: true, message: '请输入网店名称', trigger: 'blur' }],
+        addrProvince: [{ required: true, message: '请选择所在省份', trigger: 'change' }],
+        addrCity: [{ required: true, message: '请选择所在市', trigger: 'change' }],
+        addrDistrict: [{ required: true, message: '请选择所在区县', trigger: 'change' }],
+        addrDetail: [{ required: true, message: '请输入详细地址', trigger: 'blur' }],
+        deviceDTOList: [{ required: true, message: '请选择设备', trigger: 'change' }],
         lng: [
-          { required: true, message: '请输入经度', trigger: 'blur' }
+          {
+            required: true,
+            pattern: /^[\\-\\+]?(0?\d{1,2}\.\d{1,8}|1[0-7]?\d{1}\.\d{1,8}|180\.0{1,8})$/,
+            message: '请输入正确的经度,整数部分为0~180,必须输入1到8位小数',
+            trigger: 'blur'
+          }
         ],
         lat: [
-          { required: true, message: '请输入纬度', trigger: 'blur' }
-        ],
-        serviceType: [
-          { required: true, message: '请选择服务类型', trigger: 'change' }
-        ],
-        beginTime: [
-          { required: true, message: '请选择开始时间', trigger: 'change' }
+          { required: true, pattern: /^[\\-\\+]?([0-8]?\d{1}\.\d{1,8}|90\.0{1,8})$/, message: '请输入正确的纬度,整数部分为0~90,必须输入1到8位小数', trigger: 'blur' }
         ],
-        endTime: [
-          { required: true, message: '请选择结束时间', trigger: 'change' }
-        ],
-        storeItemPriceDTOList: [
-          { required: true, message: '请设置时段价格', trigger: 'change' }
-        ]
+        serviceType: [{ required: true, message: '请选择服务类型', trigger: 'change' }],
+        beginTime: [{ required: true, message: '请选择开始时间', trigger: 'change' }],
+        endTime: [{ required: true, message: '请选择结束时间', trigger: 'change' }],
+        storeItemPriceDTOList: [{ required: true, message: '请设置时段价格', trigger: 'change' }]
       },
       openEquipmentModal: false, //  选择设备  弹框展示状态
       serviceType: [], //  服务类型  change前的值
@@ -339,9 +345,21 @@ export default {
     },
     //  表单赋值
     setVal (item) {
-      const _this = this
-      console.log(item)
-      const arr = [ 'id', 'icon', 'name', 'addrProvince', 'addrProvinceName', 'addrCityName', 'addrDistrictName', 'featuredServiceLabel', 'lng', 'lat', 'serviceType', 'guidance', 'reminder' ]
+      const arr = [
+        'id',
+        'icon',
+        'name',
+        'addrProvince',
+        'addrProvinceName',
+        'addrCityName',
+        'addrDistrictName',
+        'featuredServiceLabel',
+        'lng',
+        'lat',
+        'serviceType',
+        'guidance',
+        'reminder'
+      ]
       arr.map(k => {
         this.form[k] = item[k]
       })
@@ -357,8 +375,9 @@ export default {
       this.form.beginTime = moment(item.beginTime, 'HH:mm') //  营业时间  开始时间
       this.form.endTime = moment(item.endTime, 'HH:mm') //  营业时间  结束时间
       this.setPeriodPrice(item.storeItemPriceDTOList) // 时段价格
-      this.isShow ? this.$refs.editor.setHtml(item.guidance) : null //  文本编辑器赋值
-      console.log(this.form, '----赋值后的表单')
+      if (this.isShow) {
+        this.$refs.editor.setHtml(item.guidance) //  文本编辑器赋值
+      }
     },
     // 时段价格  赋值处理
     setPeriodPrice (storeItemPriceDTOList) {
@@ -385,7 +404,7 @@ export default {
           const formData = JSON.parse(JSON.stringify(_this.form))
           //  校验营业时间结束时间是否与时段价格一致
           const endTime = formData.storeItemPriceDTOList[formData.storeItemPriceDTOList.length - 1].endTime
-          if (_this.timeFormat(formData.endTime) != _this.timeFormat(endTime)) {
+          if (_this.timeFormat(formData.endTime) !== _this.timeFormat(endTime)) {
             _this.$message.error('时段价格与营业时间不一致,请修改后再保存!')
             return
           }
@@ -446,8 +465,11 @@ export default {
       this.deviceNo = '' //  已选设备序列号
       // this.$refs.ruleForm.resetFields()    //  无效
       this.form.id = null
-      this.form.icon = '' //  网点照片
-      this.$refs.showPicture ? this.$refs.showPicture.setFileList('') : null
+      this.form.icon = ''
+      if (this.$refs.showPicture) {
+        //  网点照片
+        this.$refs.showPicture.setFileList('')
+      }
       this.form.name = '' //  网点名称
       this.form.addrProvince = undefined //  省  编码
       this.form.addrProvinceName = '' //  省
@@ -472,20 +494,24 @@ export default {
       // type: serviceType  服务类型  beginTime  营业时间  开始时间  endTime  营业时间  结束时间
       const _this = this
       setTimeout(() => {
-        if (_this.form.storeItemPriceDTOList.length != 0) {
+        if (_this.form.storeItemPriceDTOList.length !== 0) {
           _this.$confirm({
             title: '提示',
             content: '更改后已设置的时段价格将会全部清空,确定要更改吗?',
             onOk () {
-              type == 'serviceType' ? _this.serviceType = val : type == 'beginTime' ? _this.beginTime = val : _this.endTime = val
+              type === 'serviceType' ? (_this.serviceType = val) : type === 'beginTime' ? (_this.beginTime = val) : (_this.endTime = val)
               _this.form.storeItemPriceDTOList = []
             },
             onCancel () {
-              type == 'serviceType' ? _this.form.serviceType = _this.serviceType : type == 'beginTime' ? _this.form.beginTime = _this.beginTime : _this.form.endTime = _this.endTime
+              type === 'serviceType'
+                ? (_this.form.serviceType = _this.serviceType)
+                : type === 'beginTime'
+                  ? (_this.form.beginTime = _this.beginTime)
+                  : (_this.form.endTime = _this.endTime)
             }
           })
         } else {
-          type == 'serviceType' ? _this.serviceType = val : type == 'beginTime' ? _this.beginTime = val : _this.endTime = val
+          type === 'serviceType' ? (_this.serviceType = val) : type === 'beginTime' ? (_this.beginTime = val) : (_this.endTime = val)
         }
       }, 0)
     },
@@ -523,7 +549,7 @@ export default {
     },
     //  设置时段价格
     setTimeInterval () {
-      if (this.form.serviceType.length == 0) {
+      if (this.form.serviceType.length === 0) {
         this.$message.error('请先选择服务类型')
         return
       }
@@ -538,7 +564,7 @@ export default {
       const arr = {}
       // 时段价格开始时间
       let timeStr = ''
-      if (this.form.storeItemPriceDTOList.length == 0) {
+      if (this.form.storeItemPriceDTOList.length === 0) {
         timeStr = this.form.beginTime.format('HH:mm')
       } else {
         timeStr = this.form.storeItemPriceDTOList[this.form.storeItemPriceDTOList.length - 1].endTime
@@ -551,7 +577,7 @@ export default {
       arr.endTime = null
       arr.currentPrices = []
       this.form.serviceType.map((item, index) => {
-        const i = this.itemQueryList.findIndex(k => k.id == item)
+        const i = this.itemQueryList.findIndex(k => Number(k.id) === Number(item))
         arr.currentPrices.push({ name: this.itemQueryList[i].itemName, price: '', itemId: item })
       })
       this.form.storeItemPriceDTOList.push(arr)
@@ -559,7 +585,7 @@ export default {
     // 删除时段价格
     delstoreItemPriceDTOList (ind) {
       const _this = this
-      const msg = Number(ind + 1) == _this.form.storeItemPriceDTOList.length ? '确定要删除该时段吗?' : '确定要删除该时段以及其之后已设置的时段吗?'
+      const msg = Number(ind + 1) === _this.form.storeItemPriceDTOList.length ? '确定要删除该时段吗?' : '确定要删除该时段以及其之后已设置的时段吗?'
       _this.$confirm({
         title: '提示',
         content: msg,
@@ -585,7 +611,7 @@ export default {
         }
       })
     },
-    // 获取省列表'
+    // 获取省列表
     getProvinceList () {
       const _this = this
       getProvince().then(res => {
@@ -603,11 +629,11 @@ export default {
       this.form.addrCity = undefined
       this.form.addrDistrict = undefined
       this.form.addrDetail = ''
-      if (val == null || val == '') {
+      if (val == null || val === '') {
         this.form.addrProvinceName = ''
       } else {
         for (let i = 0; i < this.addrProvinceList.length; i++) {
-          if (this.addrProvinceList[i].id == val) {
+          if (Number(this.addrProvinceList[i].id) === Number(val)) {
             this.form.addrProvinceName = this.addrProvinceList[i].name
             break
           }
@@ -630,11 +656,11 @@ export default {
       this.addrDistrictList = []
       this.form.addrDistrict = undefined
       this.form.addrDetail = ''
-      if (val == null || val == '') {
+      if (val == null || val === '') {
         this.form.addrCityName = ''
       } else {
         for (let i = 0; i < this.addrCityList.length; i++) {
-          if (this.addrCityList[i].id == val) {
+          if (Number(this.addrCityList[i].id) === Number(val)) {
             this.form.addrCityName = this.addrCityList[i].name
             break
           }
@@ -654,11 +680,11 @@ export default {
     },
     // 区县变更
     areaCharged (val) {
-      if (val == null || val == '') {
+      if (val == null || val === '') {
         this.form.addrDistrictName = ''
       } else {
         for (let i = 0; i < this.addrDistrictList.length; i++) {
-          if (this.addrDistrictList[i].id == val) {
+          if (Number(this.addrDistrictList[i].id) === Number(val)) {
             this.form.addrDistrictName = this.addrDistrictList[i].name
             break
           }
@@ -693,68 +719,70 @@ export default {
 </script>
 
 <style lang="less">
-  .CarWashModal{
-    .default-form-item{
-      margin-bottom: 0;
-    }
-    .form-item-label{
-        display: inline-block;
-        cursor: pointer;
-    }
-    .form-item-required{
-      .ant-form-item-label{
-        label:before{
-          display: inline-block;
-          margin-right: 4px;
-          color: #f5222d;
-          font-size: 14px;
-          font-family: SimSun, sans-serif;
-          line-height: 1;
-          content: '*';
-        }
-      }
-    }
-    .pic-remarks{
-      font-size: 12px;
-      color: #f5222d;
-      margin: 55px 0 0;
-    }
-    .small-btn{
-      background-color: #19be6b;
-      font-size: 13px;
-    }
-    .small-btn.ant-btn-primary:focus, .small-btn.ant-btn-primary:hover{
-      background-color: #19be6b;
-    }
-    .time-picker{
-      width: 100%;
-    }
-    .btn-cont{
-      text-align: center;
-      .cancel{
-        margin-left: 10px;
-      }
-    }
-    .setTimeInterval{
-      width: 40%;
-      color: #19be6b;
-    }
-    .input-number-all{
-      width: 100%;
-    }
-    .input-number-s{
-      width: 90%;
-    }
-    .unit{
-      display: inline-block;
-      width: 10%;
-      text-align: right;
-      padding-left: 5px;
-      box-sizing: border-box;
-    }
-    .upload-file .ant-upload.ant-upload-select-picture-card, .upload-file .ant-upload-list-picture-card .ant-upload-list-item{
-      width: 100px;
-      height: 100px;
-    }
-  }
+.CarWashModal {
+	.default-form-item {
+		margin-bottom: 0;
+	}
+	.form-item-label {
+		display: inline-block;
+		cursor: pointer;
+	}
+	.form-item-required {
+		.ant-form-item-label {
+			label:before {
+				display: inline-block;
+				margin-right: 4px;
+				color: #f5222d;
+				font-size: 14px;
+				font-family: SimSun, sans-serif;
+				line-height: 1;
+				content: '*';
+			}
+		}
+	}
+	.pic-remarks {
+		font-size: 12px;
+		color: #f5222d;
+		margin: 55px 0 0;
+	}
+	.small-btn {
+		background-color: #19be6b;
+		font-size: 13px;
+	}
+	.small-btn.ant-btn-primary:focus,
+	.small-btn.ant-btn-primary:hover {
+		background-color: #19be6b;
+	}
+	.time-picker {
+		width: 100%;
+	}
+	.btn-cont {
+		text-align: center;
+		.cancel {
+			margin-left: 10px;
+		}
+	}
+	.setTimeInterval {
+		width: 40%;
+		color: #19be6b;
+	}
+	.input-number-all {
+		width: 100%;
+	}
+	.input-number-s {
+		width: 90%;
+	}
+	.unit {
+		display: inline-block;
+		width: 10%;
+		text-align: right;
+		padding-left: 5px;
+		box-sizing: border-box;
+	}
+	.upload-file .ant-upload.ant-upload-select-picture-card,
+	.upload-file .ant-upload-list-picture-card .ant-upload-list-item {
+		width: 100px;
+		height: 100px;
+	}
+}
 </style>

+ 283 - 271
src/views/CarWashManagement/CarWashManagement.vue

@@ -6,7 +6,7 @@
         <a-row :gutter="48">
           <a-col :span="6">
             <a-form-item class="search-item" label="网点名称">
-              <a-input v-model.trim="queryParam.name" placeholder="请输入网点名称" @pressEnter="$refs.table.refresh(true)" allowClear/>
+              <a-input v-model.trim="queryParam.name" placeholder="请输入网点名称" @pressEnter="$refs.table.refresh(true)" allowClear />
             </a-form-item>
           </a-col>
           <a-col :span="6">
@@ -22,14 +22,14 @@
           <a-col :span="6">
             <a-form-item class="search-item" label="省">
               <a-select v-model="queryParam.addrProvince" placeholder="请选择省" @change="getCityList" allowClear>
-                <a-select-option v-for="item in addrProvinceList" :key="item.id" :value="item.id">{{item.name}}</a-select-option>
+                <a-select-option v-for="item in addrProvinceList" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
               </a-select>
             </a-form-item>
           </a-col>
           <a-col :span="6">
             <a-form-item class="search-item" label="市">
               <a-select v-model="queryParam.addrCity" placeholder="请选择市" @change="getAreaList" allowClear>
-                <a-select-option v-for="item in addrCityList" :key="item.id" :value="item.id">{{item.name}}</a-select-option>
+                <a-select-option v-for="item in addrCityList" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
               </a-select>
             </a-form-item>
           </a-col>
@@ -41,17 +41,27 @@
       </a-form>
     </div>
     <!-- 新建 -->
-    <div class="table-operator">
-      <a-button type="primary" icon="plus" @click="modalHandle('add')">新建</a-button>
-    </div>
+    <div class="table-operator"><a-button type="primary" icon="plus" @click="modalHandle('add')">新建</a-button></div>
     <!-- 表格列表 -->
-    <s-table ref="table" size="default" rowKey="id" :columns="columns" :data="loadData" bordered >
+    <s-table
+      ref="table"
+      size="default"
+      rowKey="id"
+      :columns="columns"
+      :data="loadData"
+      bordered>
       <!-- 营业时间 -->
-      <template slot="businessHours" slot-scope="text, record">{{ record.beginTime.substr(0,5) + '-' + record.endTime.substr(0,5) }}</template>
+      <template slot="businessHours" slot-scope="text, record">
+        {{ record.beginTime.substr(0, 5) + '-' + record.endTime.substr(0, 5) }}
+      </template>
       <!-- 设备状态 -->
-      <template slot="deviceStatus" slot-scope="text, record">{{ record.deviceStatus ? $refs.deviceStatus.getNameByCode(record.deviceStatus) : '-' }}</template>
+      <template slot="deviceStatus" slot-scope="text, record">
+        {{ record.deviceStatus ? $refs.deviceStatus.getNameByCode(record.deviceStatus) : '-' }}
+      </template>
       <!-- 营业状态 -->
-      <template slot="businessStatus" slot-scope="text, record">{{ record.businessStatus ? $refs.businessStatus.getNameByCode(record.businessStatus) : '-' }}</template>
+      <template slot="businessStatus" slot-scope="text, record">
+        {{ record.businessStatus ? $refs.businessStatus.getNameByCode(record.businessStatus) : '-' }}
+      </template>
       <!-- 操作 -->
       <template slot="action" slot-scope="text, record">
         <a-tooltip placement="left" overlayClassName="btn-cont">
@@ -65,7 +75,11 @@
                 <a-icon type="pause-circle" class="icon" />
                 暂停营业
               </p>
-              <p class="set-sub-btn soon" @click="setStoreUpdateStatus(record, 'TO_BE_OPENED')" v-if="record.deviceStatus != 'PAUSE' && record.businessStatus != 'TO_BE_OPENED'">
+              <p
+                class="set-sub-btn soon"
+                @click="setStoreUpdateStatus(record, 'TO_BE_OPENED')"
+                v-if="record.deviceStatus != 'PAUSE' && record.businessStatus != 'TO_BE_OPENED'"
+              >
                 <a-icon type="play-circle" class="icon" />
                 即将开业
               </p>
@@ -80,23 +94,20 @@
         <a-icon type="qrcode" title="查看小程序码" @click="getQrCode(record)" :style="{ fontSize: '20px', color: '#e29e14', padding: '0 10px' }" />
       </template>
     </s-table>
-    
+
     <!-- 新增/编辑 洗车机 -->
-    <add-car-wash-modal
-      :openModal="openModal"
-      :pageType="pageType"
-      :carWashId="carWashId"
-      @success="carWashSubmit"
-      @close="closeModal"
-    />
+    <add-car-wash-modal :openModal="openModal" :pageType="pageType" :carWashId="carWashId" @success="carWashSubmit" @close="closeModal" />
     <!-- 查看详情 洗车机 -->
-    <details-car-wash-modal
-      :openModal="openDetailsModal"
-      :carWashId="carWashId"
-      @close="closeDetailsModal"
-    />
+    <details-car-wash-modal :openModal="openDetailsModal" :carWashId="carWashId" @close="closeDetailsModal" />
     <!-- 查看小程序码 -->
-    <a-modal class="qrCodeModal" title="查看小程序码" :width="500" :footer="null" :destroyOnClose="true" @cancel="isQrCodeModal=false" v-model="isQrCodeModal">
+    <a-modal
+      class="qrCodeModal"
+      title="查看小程序码"
+      :width="500"
+      :footer="null"
+      :destroyOnClose="true"
+      @cancel="isQrCodeModal = false"
+      v-model="isQrCodeModal">
       <img :src="qrCode" width="400" height="400" class="qrCode" />
       <a-button type="primary" class="downQrCode" @click="downloadCode">下载小程序码</a-button>
     </a-modal>
@@ -104,269 +115,270 @@
 </template>
 
 <script>
-  import { STable, VSelect } from '@/components'
-  import AddCarWashModal from './AddCarWashModal.vue'
-  import DetailsCarWashModal from './DetailsCarWashModal.vue'
-  import { getProvince, getCityByPro } from '@/api/lookup'
-  import { storeQuery, storeFind, findItem, storeDel, storeQrCode, storeUpdateStatus } from '@/api/car-wash'
-  export default{
-    name: 'CarWashManagement',
-    components: { STable, VSelect, AddCarWashModal, DetailsCarWashModal },
-    data(){
-      return{
-        queryParam: {
-          name: '',  //  网点名称
-          businessStatus: '',  //  营业状态
-          deviceDTO: { deviceStatus: '' },  //  设备状态
-          addrProvince: undefined,  //  省
-          addrCity: undefined  //  市
-        },
-        columns: [
-          { title: '创建时间', dataIndex: 'createDate', width: '100', align: 'center' },
-          { title: '设备ID', dataIndex: 'deviceNos', width: '100', align: 'center' },
-          { title: '网点名称', dataIndex: 'name', width: '100', align: 'center' },
-          { title: '省', dataIndex: 'addrProvinceName', width: '100', align: 'center' },
-          { title: '市', dataIndex: 'addrCityName', width: '100', align: 'center' },
-          { title: '地址', dataIndex: 'addrDetail', width: '100', align: 'center' },
-          { title: '营业时间', scopedSlots: {customRender: 'businessHours'}, width: '100', align: 'center' },
-          { title: '设备状态', scopedSlots: {customRender: 'deviceStatus'}, width: '100', align: 'center' },
-          { title: '营业状态', scopedSlots: {customRender: 'businessStatus'}, width: '100', align: 'center' },
-          { title: '操作', scopedSlots: {customRender: 'action'}, width: '265', align: 'center' }
-        ],
-        // 加载数据方法 必须为 Promise 对象
-        loadData: parameter => {
-          return storeQuery(Object.assign(parameter, this.queryParam)).then(res => {
-            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
+import { STable, VSelect } from '@/components'
+import AddCarWashModal from './AddCarWashModal.vue'
+import DetailsCarWashModal from './DetailsCarWashModal.vue'
+import { getProvince, getCityByPro } from '@/api/lookup'
+import { storeQuery, storeDel, storeQrCode, storeUpdateStatus } from '@/api/car-wash'
+export default {
+  name: 'CarWashManagement',
+  components: { STable, VSelect, AddCarWashModal, DetailsCarWashModal },
+  data () {
+    return {
+      queryParam: {
+        name: '', //  网点名称
+        businessStatus: '', //  营业状态
+        deviceDTO: { deviceStatus: '' }, //  设备状态
+        addrProvince: undefined, //  省
+        addrCity: undefined //  市
+      },
+      columns: [
+        { title: '创建时间', dataIndex: 'createDate', width: '100', align: 'center' },
+        { title: '设备ID', dataIndex: 'deviceNos', width: '100', align: 'center' },
+        { title: '网点名称', dataIndex: 'name', width: '100', align: 'center' },
+        { title: '省', dataIndex: 'addrProvinceName', width: '100', align: 'center' },
+        { title: '市', dataIndex: 'addrCityName', width: '100', align: 'center' },
+        { title: '地址', dataIndex: 'addrDetail', width: '100', align: 'center' },
+        { title: '营业时间', scopedSlots: { customRender: 'businessHours' }, width: '100', align: 'center' },
+        { title: '设备状态', scopedSlots: { customRender: 'deviceStatus' }, width: '100', align: 'center' },
+        { title: '营业状态', scopedSlots: { customRender: 'businessStatus' }, width: '100', align: 'center' },
+        { title: '操作', scopedSlots: { customRender: 'action' }, width: '265', align: 'center' }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        return storeQuery(Object.assign(parameter, this.queryParam)).then(res => {
+          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
+          }
+          return res.data
+        })
+      },
+      openModal: false, //  新增/编辑 洗车机  弹框展示状态
+      pageType: '', //  新增/编辑 洗车机  页面类型
+      openDetailsModal: false, //  查看详情 洗车机  弹框展示状态
+      addrProvinceList: [], //  省列表数据
+      addrCityList: [], //  市列表数据
+      isQrCodeModal: false, //  查看小程序码   弹框展示状态
+      qrCode: '', //  小程序码
+      carWashId: '' //  网点id
+    }
+  },
+  methods: {
+    //  新建/编辑/查看
+    modalHandle (type, item) {
+      this.pageType = type
+      if (type === 'add') {
+        this.carWashId = ''
+        this.openModal = true
+        this.openDetailsModal = false
+      } else if (type === 'edit') {
+        this.carWashId = String(item.id)
+        this.openModal = true
+        this.openDetailsModal = false
+      } else if (type === 'details') {
+        this.carWashId = String(item.id)
+        this.openDetailsModal = true
+        this.openModal = false
+      }
+    },
+    // 新增编辑  提交成功
+    carWashSubmit () {
+      this.$refs.table.refresh(true)
+      this.openModal = false
+    },
+    // 删除
+    del (item) {
+      const _this = this
+      _this.$confirm({
+        title: '提示',
+        content: '确定要删除吗?',
+        onOk () {
+          storeDel({ id: item.id }).then(res => {
+            if (res.status == 200) {
+              _this.$message.success(res.message)
+              _this.$refs.table.refresh()
+            } else {
+              _this.$message.error(res.message)
             }
-            return res.data
           })
-        },
-        openModal: false,  //  新增/编辑 洗车机  弹框展示状态
-        pageType: '',  //  新增/编辑 洗车机  页面类型
-        openDetailsModal: false,  //  查看详情 洗车机  弹框展示状态
-        addrProvinceList: [],  //  省列表数据
-        addrCityList: [],  //  市列表数据
-        isQrCodeModal: false,  //  查看小程序码   弹框展示状态
-        qrCode: '',  //  小程序码
-        carWashId: '',  //  网点id
+        }
+      })
+    },
+    //  重置
+    reset () {
+      this.queryParam = {
+        name: '', //  网点名称
+        businessStatus: '', //  营业状态
+        deviceDTO: { deviceStatus: '' }, //  设备状态
+        addrProvince: undefined, //  省
+        addrCity: undefined //  市
       }
+      this.addrCityList = []
+      this.$refs.table.refresh(true)
     },
-    methods: {
-      //  新建/编辑/查看
-      modalHandle(type, item){
-        this.pageType = type
-        if(type == 'add'){
-          this.carWashId = ''
-          this.openModal = true
-          this.openDetailsModal = false
-        }else if(type == 'edit'){
-          this.carWashId = String(item.id)
-          this.openModal = true
-          this.openDetailsModal = false
-        }else if(type == 'details'){
-          this.carWashId = String(item.id)
-          this.openDetailsModal = true
-          this.openModal = false
+    // 查看小程序码
+    getQrCode (item) {
+      storeQrCode({ id: item.id, deviceNo: item.deviceNos }).then(res => {
+        if (res.status == 200) {
+          this.qrCode = 'data:image/png;base64,' + res.data
+          this.isQrCodeModal = true
+        } else {
+          this.qrCode = ''
+          this.$message.error(res.message)
         }
-      },
-      // 新增编辑  提交成功
-      carWashSubmit(){
-        this.$refs.table.refresh(true)
-        this.openModal = false
-      },
-      // 删除
-      del(item){
-        const _this = this
-        _this.$confirm({
-          title: '提示',
-          content: '确定要删除吗?',
-          onOk () {
-            storeDel({ id: item.id }).then(res => {
-              if(res.status == 200){
-                _this.$message.success(res.message)
-                _this.$refs.table.refresh()
-              }else{
-                _this.$message.error(res.message)
-              }
-            })
-          }
-        })
-      },
-      //  重置
-      reset(){
-        this.queryParam = {
-          name: '',  //  网点名称
-          businessStatus: '',  //  营业状态
-          deviceDTO: { deviceStatus: '' },  //  设备状态
-          addrProvince: undefined,  //  省
-          addrCity: undefined  //  市
+      })
+    },
+    //  下载小程序码
+    downloadCode () {
+      const link = document.createElement('a')
+      link.href = this.qrCode
+      link.download = 'qrCode.png'
+      link.click()
+    },
+    // 更改网点营业状态
+    setStoreUpdateStatus (item, businessStatus) {
+      storeUpdateStatus({ id: item.id, businessStatus: businessStatus }).then(res => {
+        if (res.status == 200) {
+          this.$message.success(res.message)
+          this.$refs.table.refresh(true)
+        } else {
+          this.$message.success(res.message)
         }
-        this.$refs.table.refresh(true)
-      },
-      // 查看小程序码
-      getQrCode(item){
-        storeQrCode({ id: item.id,deviceNo: item.deviceNos }).then(res => {
-          if(res.status == 200){
-            this.qrCode = 'data:image/png;base64,' + res.data
-            this.isQrCodeModal = true
-          }else{
-            this.qrCode = ''
-            this.$message.success(res.message)
-          }
-        })
-      },
-      //  下载小程序码
-      downloadCode (){
-        let link = document.createElement('a')
-        link.href = this.qrCode
-        link.download = 'qrCode.png'
-        link.click()
-      },
-      // 更改网点营业状态
-      setStoreUpdateStatus(item, businessStatus){
-        storeUpdateStatus({ id: item.id, businessStatus: businessStatus }).then(res => {
-          if(res.status == 200){
-            this.$message.success(res.message)
-            this.$refs.table.refresh(true)
-          }else{
-            this.$message.success(res.message)
-          }
-        })
-      },
-      //  设置提示
-      tooltipSet(){
-        this.$message.warning('洗车机设备离线(或暂停),暂不能设置营业状态!')
-      },
-      // 获取省列表
-      getProvinceList() {
-        const _this = this
-        getProvince().then(res => {
-          if (res.status == 200) {
-            _this.addrProvinceList = res.data || []
-          } else {
-            _this.addrProvinceList = []
-          }
-        })
-      },
-      // 获取城市列表
-      getCityList (val) {
-        this.addrCityList = []
-        this.queryParam.addrCity = undefined
-        if (val == null || val == '') {
-          this.addrProvinceName = ''
+      })
+    },
+    //  设置提示
+    tooltipSet () {
+      this.$message.warning('洗车机设备离线(或暂停),暂不能设置营业状态!')
+    },
+    // 获取省列表
+    getProvinceList () {
+      const _this = this
+      getProvince().then(res => {
+        if (res.status == 200) {
+          _this.addrProvinceList = res.data || []
         } else {
-          for (let i = 0; i < this.addrProvinceList.length; i++) {
-            if (this.addrProvinceList[i].id == val) {
-              this.addrProvinceName = this.addrProvinceList[i].name
-              break
-            }
-          }
-          this.getCityListRequest(val)
+          _this.addrProvinceList = []
         }
-      },
-      getCityListRequest (val) {
-        getCityByPro({id: val}).then(res => {
-          if (res.status == 200) {
-            this.addrCityList = res.data || []
-          } else {
-            this.addrCityList = []
+      })
+    },
+    // 获取城市列表
+    getCityList (val) {
+      this.addrCityList = []
+      this.queryParam.addrCity = undefined
+      if (val == null || val === '') {
+        this.addrProvinceName = ''
+      } else {
+        for (let i = 0; i < this.addrProvinceList.length; i++) {
+          if (Number(this.addrProvinceList[i].id) === Number(val)) {
+            this.addrProvinceName = this.addrProvinceList[i].name
+            break
           }
-        })
-      },
-      // 获取区县列表
-      getAreaList (val) {
-        if (val == null || val == '') {
-          this.addrCityName = ''
+        }
+        this.getCityListRequest(val)
+      }
+    },
+    getCityListRequest (val) {
+      getCityByPro({ id: val }).then(res => {
+        if (res.status == 200) {
+          this.addrCityList = res.data || []
         } else {
-          for (let i = 0; i < this.addrCityList.length; i++) {
-            if (this.addrCityList[i].id == val) {
-              this.addrCityName = this.addrCityList[i].name
-              break
-            }
+          this.addrCityList = []
+        }
+      })
+    },
+    // 获取区县列表
+    getAreaList (val) {
+      if (val == null || val === '') {
+        this.addrCityName = ''
+      } else {
+        for (let i = 0; i < this.addrCityList.length; i++) {
+          if (Number(this.addrCityList[i].id) === Number(val)) {
+            this.addrCityName = this.addrCityList[i].name
+            break
           }
         }
-      },
-      // 新增、编辑 弹框关闭
-      closeModal(){
-        this.carWashId = ''
-        this.openModal = false
-      },
-      // 详情 弹框关闭
-      closeDetailsModal(){
-        this.carWashId = ''
-        this.openDetailsModal = false
       }
     },
-    mounted(){
-      //  获取省下拉
-      this.getProvinceList()
+    // 新增、编辑 弹框关闭
+    closeModal () {
+      this.carWashId = ''
+      this.openModal = false
+    },
+    // 详情 弹框关闭
+    closeDetailsModal () {
+      this.carWashId = ''
+      this.openDetailsModal = false
     }
+  },
+  mounted () {
+    //  获取省下拉
+    this.getProvinceList()
   }
+}
 </script>
 
 <style lang="less">
-  .CarWashManagement{
-    .table-page-search-wrapper{
-      .search-btn{
-        margin-right: 10px;
-      }
-    }
-  }
-  // 查看小程序码  弹框
-  .qrCodeModal{
-    .qrCode{
-      display: block;
-      max-width: 100%;
-      margin: 0 auto;
-    }
-    .downQrCode{
-      display: block;
-      margin: 40px auto 30px;
-    }
-  }
-  .btn-cont{
-    .ant-tooltip-inner{
-      background-color: #fff;
-    }
-    .ant-tooltip-arrow:before{
-      background-color: #fff;
-    }
-    .btn-set-cont{
-      .set-sub-btn{
-        padding: 5px 15px 6px;
-        font-size: 12px;
-        border: 1px dashed #dcdee2;
-        border-radius: 4px;
-        margin: 0;
-        cursor: pointer;
-      }
-      .normal{
-        color: rgb(0, 204, 0);
-        border-color: rgb(0, 204, 0);
-        margin: 7px 0;
-        .icon{
-          margin-right: 5px;
-        }
-      }
-      .suspension{
-        color: rgb(255, 85, 0);
-        border-color: rgb(255, 85, 0);
-        margin: 7px 0;
-        .icon{
-          margin-right: 5px;
-        }
-      }
-      .soon{
-        color: #2d8cf0;
-        border-color: #2d8cf0;
-        margin: 7px 0;
-        .icon{
-          margin-right: 5px;
-        }
-      }
-    }
-  }
+.CarWashManagement {
+	.table-page-search-wrapper {
+		.search-btn {
+			margin-right: 10px;
+		}
+	}
+}
+// 查看小程序码  弹框
+.qrCodeModal {
+	.qrCode {
+		display: block;
+		max-width: 100%;
+		margin: 0 auto;
+	}
+	.downQrCode {
+		display: block;
+		margin: 40px auto 30px;
+	}
+}
+.btn-cont {
+	.ant-tooltip-inner {
+		background-color: #fff;
+	}
+	.ant-tooltip-arrow:before {
+		background-color: #fff;
+	}
+	.btn-set-cont {
+		.set-sub-btn {
+			padding: 5px 15px 6px;
+			font-size: 12px;
+			border: 1px dashed #dcdee2;
+			border-radius: 4px;
+			margin: 0;
+			cursor: pointer;
+		}
+		.normal {
+			color: rgb(0, 204, 0);
+			border-color: rgb(0, 204, 0);
+			margin: 7px 0;
+			.icon {
+				margin-right: 5px;
+			}
+		}
+		.suspension {
+			color: rgb(255, 85, 0);
+			border-color: rgb(255, 85, 0);
+			margin: 7px 0;
+			.icon {
+				margin-right: 5px;
+			}
+		}
+		.soon {
+			color: #2d8cf0;
+			border-color: #2d8cf0;
+			margin: 7px 0;
+			.icon {
+				margin-right: 5px;
+			}
+		}
+	}
+}
 </style>

+ 143 - 123
src/views/CarWashManagement/ChooseEquipment.vue

@@ -1,146 +1,166 @@
 <template>
-  <a-modal class="CarWashEquipmentModal" title="选择设备" :width="600" :footer="null" :destroyOnClose="true" @cancel="modalIsShow=false" v-model="modalIsShow">
+  <a-modal
+    class="CarWashEquipmentModal"
+    title="选择设备"
+    :width="600"
+    :footer="null"
+    :destroyOnClose="true"
+    @cancel="modalIsShow = false"
+    v-model="modalIsShow">
     <a-input-search placeholder="请输入设备序列号" enter-button="查询" @search="onSearch" class="input-search" />
     <a-radio-group v-model="equipment" @change="onChange" class="radio-group">
-      <a-radio :style="radioStyle" v-for="(item,index) in equipmentList" :key="index" :value="item.id" :disabled="item.binding==1">
+      <a-radio :style="radioStyle" v-for="(item, index) in equipmentList" :key="index" :value="item.id" :disabled="item.binding == 1">
         <div class="radio-group-item">
-          <p class="item-label">{{item.deviceNo}}</p>
-          <p :class="['item-status', item.binding == 1 ? 'ybind' : '']">{{item.binding == 0 ? '绑定' : '已绑定'}}</p>
+          <p class="item-label">{{ item.deviceNo }}</p>
+          <p :class="['item-status', item.binding == 1 ? 'ybind' : '']">{{ item.binding == 0 ? '绑定' : '已绑定' }}</p>
         </div>
       </a-radio>
     </a-radio-group>
     <!-- 分页 -->
-    <a-pagination class="pagination-s" show-size-changer :current="pageNo" :pageSize.sync="pageSize" :total="total" @showSizeChange="onShowSizeChange" @change="onShowPageChange" />
+    <a-pagination
+      class="pagination-s"
+      show-size-changer
+      :current="pageNo"
+      :pageSize.sync="pageSize"
+      :total="total"
+      @showSizeChange="onShowSizeChange"
+      @change="onShowPageChange"
+    />
   </a-modal>
 </template>
 
 <script>
-  import { deviceQuery } from '@/api/car-wash'
-  export default{
-    name: 'ChooseEquipment',
-    props: {
-      openEquipmentModal: {  //  弹框是否展示
-        type: Boolean,
-        default: false
+import { deviceQuery } from '@/api/car-wash'
+export default {
+  name: 'ChooseEquipment',
+  props: {
+    openEquipmentModal: {
+      //  弹框是否展示
+      type: Boolean,
+      default: false
+    }
+  },
+  data () {
+    return {
+      modalIsShow: this.openEquipmentModal, //  弹框是否展示
+      searchVal: '', // 查询条件
+      radioStyle: {
+        //  设备选项样式
+        display: 'flex',
+        alignItems: 'center',
+        width: '100%',
+        border: '1px solid #e4e4e4',
+        borderRadius: '6px',
+        padding: '10px 15px',
+        marginTop: '15px'
       },
-    },
-    data(){
-      return{
-        modalIsShow: this.openEquipmentModal,  //  弹框是否展示
-        searchVal: '',  // 查询条件
-        radioStyle: {  //  设备选项样式
-          display: 'flex',
-          alignItems: 'center',
-          width: '100%',
-          border: '1px solid #e4e4e4',
-          borderRadius: '6px',
-          padding: '10px 15px',
-          marginTop: '15px'
-        },
-        equipment: null,  //  选中的设备 id
-        equipmentNo: '',  //  选中的设备   序列号
-        equipmentList: [],  //  设备数据列表
-        pageNo: 1,  //  页码
-        pageSize: 10,  //  每页条数
-        total: 0,  //  列表总条数
+      equipment: null, //  选中的设备 id
+      equipmentNo: '', //  选中的设备   序列号
+      equipmentList: [], //  设备数据列表
+      pageNo: 1, //  页码
+      pageSize: 10, //  每页条数
+      total: 0 //  列表总条数
+    }
+  },
+  methods: {
+    // 设备列表
+    getEquipmentList (pageNo) {
+      if (pageNo) {
+        this.pageNo = pageNo
       }
+      deviceQuery({
+        pageNo: this.pageNo,
+        pageSize: this.pageSize,
+        deviceNo: this.searchVal
+      }).then(res => {
+        if (res.status == 200) {
+          this.equipmentList = res.data.list || []
+          this.total = res.data.count
+        } else {
+          this.equipmentList = []
+          this.total = 0
+        }
+      })
     },
-    methods: {
-      // 设备列表
-      getEquipmentList(pageNo){
-        pageNo ? this.pageNo = pageNo : null
-        deviceQuery({
-          pageNo: this.pageNo,
-          pageSize: this.pageSize,
-          deviceNo: this.searchVal,
-        }).then(res => {
-          if(res.status == 200){
-            this.equipmentList = res.data.list || []
-            this.total = res.data.count
-          }else{
-            this.equipmentList = []
-            this.total = 0
-          }
-        })
-      },
-      //  查询
-      onSearch(value) {
-        this.searchVal = value
-        this.getEquipmentList(1)
-      },
-      // 设备  change
-      onChange(e) {
-        const _this = this
-        _this.equipment = e.target.value
-        let i = _this.equipmentList.findIndex(item => item.id == _this.equipment)
-        _this.equipmentNo = _this.equipmentList[i].deviceNo
-        setTimeout(()=>{
-          _this.modalIsShow = false
-        },300)
-      },
-      //  页码  change
-      onShowPageChange(page, pageSize){
-        this.pageNo = page
-        this.getEquipmentList()
-      },
-      //  pageSize 变化的回调
-      onShowSizeChange(current, size){
-        this.pageSize = size
-        this.getEquipmentList()
-      }
+    //  查询
+    onSearch (value) {
+      this.searchVal = value
+      this.getEquipmentList(1)
     },
-    watch: {
-      //  父页面传过来的弹框状态
-      openEquipmentModal (newValue, oldValue) {
-        this.modalIsShow = newValue
-      },
-      //  重定义的弹框状态
-      modalIsShow (val){
-        if (!val){
-          this.$emit('close', this.equipment, this.equipmentNo)
-        }else{
-          this.getEquipmentList(1)
-        }
+    // 设备  change
+    onChange (e) {
+      const _this = this
+      _this.equipment = e.target.value
+      const i = _this.equipmentList.findIndex(item => Number(item.id) === Number(_this.equipment))
+      _this.equipmentNo = _this.equipmentList[i].deviceNo
+      setTimeout(() => {
+        _this.modalIsShow = false
+      }, 300)
+    },
+    //  页码  change
+    onShowPageChange (page, pageSize) {
+      this.pageNo = page
+      this.getEquipmentList()
+    },
+    //  pageSize 变化的回调
+    onShowSizeChange (current, size) {
+      this.pageSize = size
+      this.getEquipmentList()
+    }
+  },
+  watch: {
+    //  父页面传过来的弹框状态
+    openEquipmentModal (newValue, oldValue) {
+      this.modalIsShow = newValue
+    },
+    //  重定义的弹框状态
+    modalIsShow (val) {
+      if (!val) {
+        this.$emit('close', this.equipment, this.equipmentNo)
+      } else {
+        this.searchVal = ''
+        this.getEquipmentList(1)
       }
     }
   }
+}
 </script>
 
 <style lang="less">
-  .CarWashEquipmentModal{
-    .input-search{
-      margin-bottom: 15px;
-    }
-    .radio-group{
-      display: block;
-      width: 100%;
-      .ant-radio-wrapper{
-        .ant-radio{
-          width: 16px;
-        }
-        span:nth-child(2){
-          width: 100%;
-        }
-      }
-      .radio-group-item{
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        .item-label{
-          margin: 0;
-        }
-        .item-status{
-          margin: 0;
-          font-size: 12px;
-          color: #19be6b;
-        }
-        .item-status.ybind{
-          color: #ff9900;
-        }
-      }
-    }
-    .pagination-s{
-      margin-top: 20px;
-    }
-  }
+.CarWashEquipmentModal {
+	.input-search {
+		margin-bottom: 15px;
+	}
+	.radio-group {
+		display: block;
+		width: 100%;
+		.ant-radio-wrapper {
+			.ant-radio {
+				width: 16px;
+			}
+			span:nth-child(2) {
+				width: 100%;
+			}
+		}
+		.radio-group-item {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			.item-label {
+				margin: 0;
+			}
+			.item-status {
+				margin: 0;
+				font-size: 12px;
+				color: #19be6b;
+			}
+			.item-status.ybind {
+				color: #ff9900;
+			}
+		}
+	}
+	.pagination-s {
+		margin-top: 20px;
+	}
+}
 </style>

+ 126 - 114
src/views/CarWashManagement/DetailsCarWashModal.vue

@@ -1,6 +1,13 @@
 <template>
   <div class="DetailsCarWash">
-    <a-modal class="DetailsCarWashModal" title="查看详情" :width="1000" :footer="null" :destroyOnClose="true" @cancel="isShow=false" v-model="isShow">
+    <a-modal
+      class="DetailsCarWashModal"
+      title="查看详情"
+      :width="1000"
+      :footer="null"
+      :destroyOnClose="true"
+      @cancel="isShow=false"
+      v-model="isShow">
       <v-select v-show="false" ref="featuredServiceLabel" placeholder="请选择网点标签" code="STORE_LABEL"></v-select>
       <a-row :gutter="20">
         <a-col :span="12" class="item-cont">
@@ -30,7 +37,7 @@
         <a-col :span="12" class="item-cont">
           <p class="item-label">网点标签:</p>
           <div class="item-main">
-            <a-tag color="blue" v-for="(item, index) in labelList" :ket="index">{{ item }}</a-tag>
+            <a-tag color="blue" v-for="(item, index) in labelList" :key="index">{{ item }}</a-tag>
           </div>
         </a-col>
         <a-col :span="12" class="item-cont">
@@ -62,7 +69,7 @@
         </a-col>
         <a-col :span="24" class="item-cont">
           <p class="item-label">路段指引:</p>
-          <p class="item-main guidance-con" v-html="carWashInfo.guidance"></p>
+          <p :class="['item-main', carWashInfo.guidance ? 'guidance-con' : '']" v-html="carWashInfo.guidance"></p>
         </a-col>
         <a-col :span="24" class="item-cont">
           <p class="item-label">温馨提示:</p>
@@ -75,137 +82,142 @@
           </p>
         </a-col>
         <a-col :span="24" class="btn-cont">
-          <a-button @click="isShow=false">取消</a-button>
+          <a-button @click="isShow=false">返回列表</a-button>
         </a-col>
       </a-row>
     </a-modal>
-    
+
     <!-- 查看现场照片 -->
-    <a-modal class="picModal" title="查看现场照片" :width="800" :footer="null" :destroyOnClose="true" @cancel="isPicModal=false" v-model="isPicModal">
+    <a-modal
+      class="picModal"
+      title="查看现场照片"
+      :width="800"
+      :footer="null"
+      :destroyOnClose="true"
+      @cancel="isPicModal=false"
+      v-model="isPicModal">
       <img :src="pic" class="pic" />
     </a-modal>
   </div>
 </template>
 
 <script>
-  import { VSelect } from '@/components'
-  import moment from 'moment'
-  import { storeFind, findItem, deviceImage, itemQuery } from '@/api/car-wash'
-  export default{
-    name: 'DetailsCarWashModal',
-    components: { VSelect },
-    props: {
-      openModal: {  //  弹框是否展示
-        type: Boolean,
-        default: false
-      },
-      carWashId: {  //  网点id
-        type: String,
-        default: ''
-      }
+import { VSelect } from '@/components'
+import { storeFind, findItem, deviceImage, itemQuery } from '@/api/car-wash'
+export default {
+  name: 'DetailsCarWashModal',
+  components: { VSelect },
+  props: {
+    openModal: { //  弹框是否展示
+      type: Boolean,
+      default: false
     },
-    data(){
-      return{
-        isShow: this.openModal,  //  弹框是否展示
-        labelList: [],  //  网点标签
-        isPicModal: false,  //  现场照片  弹框是否展示
-        pic: '',  //  现场照片  路径
-        carWashInfo: {}  ,//  网点信息
-        serviceType: [],  //  服务类型
-        storeItemPriceDTOList: [],  //  时段价格
-        itemQueryList: []  //  服务类型  列表数据
-      }
-    },
-    methods: {
-      // 网点详情
-      getCarWashInfo(id){
-        this.getItemQuery()
-        storeFind({ id: id }).then(res => {
-          if(res.status == 200){
-            // 查询门店的服务时段价格
-            findItem({ id: id }).then(result => {
-              if(result.status == 200){
-                this.carWashInfo = Object.assign(res.data, {storeItemPriceDTOList: result.data})
-                // 获取当前设备图片
-                console.log(res.data)
-                deviceImage({ deviceNo: res.data.deviceVOList[0].deviceNo }).then(results => {
-                  if(results.status == 200){
-                    this.pic = results.data
-                  }else{
-                    this.pic = ''
-                  }
-                })
-                this.setVal()
-              }
-            })
-          }
-        })
-      },
-      //  赋值
-      setVal(){
-        const _this = this
-        // 网点标签
-        setTimeout(()=>{
-          let featuredServiceLabel = this.carWashInfo.featuredServiceLabel.split(',')
-          let arr = []
-          featuredServiceLabel.map(k => {
-            arr.push(_this.$refs.featuredServiceLabel.getNameByCode(k))
-          })
-          _this.labelList = arr
-        },0)
-        // 时段价格
-        this.setPeriodPrice(this.carWashInfo.storeItemPriceDTOList)
-      },
-      // 时段价格  赋值处理
-      setPeriodPrice(storeItemPriceDTOList){
-        this.storeItemPriceDTOList = []
-        for(let i = 0; i < storeItemPriceDTOList.length; i++){
-          this.storeItemPriceDTOList.push({
-            beginTime: storeItemPriceDTOList[i][0].beginTime,
-            endTime: storeItemPriceDTOList[i][0].endTime,
-            currentPrices: []
+    carWashId: { //  网点id
+      type: String,
+      default: ''
+    }
+  },
+  data () {
+    return {
+      isShow: this.openModal, //  弹框是否展示
+      labelList: [], //  网点标签
+      isPicModal: false, //  现场照片  弹框是否展示
+      pic: '', //  现场照片  路径
+      carWashInfo: {}, //  网点信息
+      serviceType: [], //  服务类型
+      storeItemPriceDTOList: [], //  时段价格
+      itemQueryList: [] //  服务类型  列表数据
+    }
+  },
+  methods: {
+    // 网点详情
+    getCarWashInfo (id) {
+      this.getItemQuery()
+      storeFind({ id: id }).then(res => {
+        if (res.status == 200) {
+          // 查询门店的服务时段价格
+          findItem({ id: id }).then(result => {
+            if (result.status == 200) {
+              this.carWashInfo = Object.assign(res.data, { storeItemPriceDTOList: result.data })
+              // 获取当前设备图片
+              deviceImage({ deviceNo: res.data.deviceVOList[0].deviceNo }).then(results => {
+                if (results.status == 200) {
+                  this.pic = results.data
+                } else {
+                  this.pic = ''
+                }
+              })
+              this.setVal()
+            }
           })
-          this.serviceType = []
-          for(let j = 0; j < storeItemPriceDTOList[i].length; j++){
-            let k = storeItemPriceDTOList[i][j]
-            this.storeItemPriceDTOList[i].currentPrices.push({ name: k.itemName, price: k.currentPrice, itemId: k.itemId })
-            let ind = this.itemQueryList.findIndex(item => item.id == k.itemId)
-            this.serviceType.push(this.itemQueryList[ind].itemName)
-          }
         }
-      },
-      // 获取服务类型列表
-      getItemQuery(){
-        itemQuery({
-          pageNo: 1,
-          pageSize: 1000
-        }).then(res => {
-          if(res.status == 200){
-            this.itemQueryList = res.data.list || []
-          }else{
-            this.itemQueryList = []
-          }
+      })
+    },
+    //  赋值
+    setVal () {
+      const _this = this
+      // 网点标签
+      setTimeout(() => {
+        const featuredServiceLabel = this.carWashInfo.featuredServiceLabel.split(',')
+        const arr = []
+        featuredServiceLabel.map(k => {
+          arr.push(_this.$refs.featuredServiceLabel.getNameByCode(k))
         })
-      }
+        _this.labelList = arr
+      }, 0)
+      // 时段价格
+      this.setPeriodPrice(this.carWashInfo.storeItemPriceDTOList)
     },
-    watch: {
-      //  父页面传过来的弹框状态
-      openModal (newValue, oldValue) {
-        this.isShow = newValue
-      },
-      //  重定义的弹框状态
-      isShow (val){
-        if (!val){
-          this.$emit('close')
+    // 时段价格  赋值处理
+    setPeriodPrice (storeItemPriceDTOList) {
+      this.storeItemPriceDTOList = []
+      for (let i = 0; i < storeItemPriceDTOList.length; i++) {
+        this.storeItemPriceDTOList.push({
+          beginTime: storeItemPriceDTOList[i][0].beginTime,
+          endTime: storeItemPriceDTOList[i][0].endTime,
+          currentPrices: []
+        })
+        this.serviceType = []
+        for (let j = 0; j < storeItemPriceDTOList[i].length; j++) {
+          const k = storeItemPriceDTOList[i][j]
+          this.storeItemPriceDTOList[i].currentPrices.push({ name: k.itemName, price: k.currentPrice, itemId: k.itemId })
+          const ind = this.itemQueryList.findIndex(item => item.id == k.itemId)
+          this.serviceType.push(this.itemQueryList[ind].itemName)
         }
-      },
-      carWashId (newValue, oldValue){
-        if(newValue && this.isShow){
-          this.getCarWashInfo(newValue)
+      }
+    },
+    // 获取服务类型列表
+    getItemQuery () {
+      itemQuery({
+        pageNo: 1,
+        pageSize: 1000
+      }).then(res => {
+        if (res.status == 200) {
+          this.itemQueryList = res.data.list || []
+        } else {
+          this.itemQueryList = []
         }
+      })
+    }
+  },
+  watch: {
+    //  父页面传过来的弹框状态
+    openModal (newValue, oldValue) {
+      this.isShow = newValue
+    },
+    //  重定义的弹框状态
+    isShow (val) {
+      if (!val) {
+        this.$emit('close')
+      }
+    },
+    carWashId (newValue, oldValue) {
+      if (newValue && this.isShow) {
+        this.getCarWashInfo(newValue)
       }
     }
   }
+}
 </script>
 
 <style lang="less">