chenrui 4 lat temu
rodzic
commit
713960ae5e

+ 4 - 4
src/components/Table/index.js

@@ -110,7 +110,7 @@ export default {
       pageSize: this.pageSize,
       showSizeChanger: this.showSizeChanger
     }) || false
-    console.log('this.localPagination', this.localPagination)
+    // console.log('this.localPagination', this.localPagination)
     this.needTotalList = this.initTotalList(this.columns)
     this.loadData()
   },
@@ -149,14 +149,14 @@ export default {
         ...filters
       }
       )
-      console.log('parameter', parameter)
+      // console.log('parameter', parameter)
       const result = this.data(parameter)
       // 对接自己的通用数据接口需要修改下方代码中的 r.pageNo, r.count, r.data
       // eslint-disable-next-line
       if ((typeof result === 'object' || typeof result === 'function') && typeof result.then === 'function') {
         result.then(r => {
-          let list = r.list || r.data || r
-          console.log(r,'rrrrrrrrrr')
+          const list = r.list || r.data || r
+          console.log(r, 'rrrrrrrrrr')
           this.localPagination = this.showPagination && Object.assign({}, this.localPagination, {
             current: r.pageNo, // 返回结果中的当前分页数
             total: r.count, // 返回结果中的总记录数

+ 180 - 9
src/views/CarWashManagement/AddCarWashModal.vue

@@ -1,16 +1,147 @@
 <template>
-  <a-modal class="CarWashModal" :title="mtitle" :width="600" :footer="null" :destroyOnClose="true" @cancel="isShow=false" v-model="isShow">
-    <a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="{ span: 4 }" :wrapper-col="{ span: 14 }">
-      <a-form-model-item ref="name" label="网点名称" prop="name">
-        <a-input v-model="form.name" />
-      </a-form-model-item>
+  <a-modal class="CarWashModal" :title="mtitle" :width="1000" :footer="null" :destroyOnClose="true" @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-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-col>
+        <a-col :span="12">
+          <a-form-model-item label="地址" class="ant-sub-form-item">
+            <a-row :gutter="20">
+              <a-col :span="8">
+                <a-form-model-item prop="addrProvince">
+                  <a-select v-model="form.addrProvince" placeholder="请选择省">
+                    <a-select-option value="shanghai">
+                      Zone one
+                    </a-select-option>
+                  </a-select>
+                </a-form-model-item>
+              </a-col>
+              <a-col :span="8">
+                <a-form-model-item prop="addrCity">
+                  <a-select v-model="form.addrCity" placeholder="请选择市">
+                    <a-select-option value="shanghai">
+                      Zone one
+                    </a-select-option>
+                  </a-select>
+                </a-form-model-item>
+              </a-col>
+              <a-col :span="8">
+                <a-form-model-item prop="addrDistrict">
+                  <a-select v-model="form.addrDistrict" placeholder="请选择区">
+                    <a-select-option value="shanghai">
+                      Zone one
+                    </a-select-option>
+                  </a-select>
+                </a-form-model-item>
+              </a-col>
+            </a-row>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item label="详细地址" prop="name" :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }">
+            <a-input v-model="form.name" :maxLength="32" placeholder="请输入详细地址,32个字以内" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item label="设备" prop="name">
+            <a-row :gutter="20">
+              <a-col :span="19">
+                
+              </a-col>
+              <a-col :span="5">
+                <a-button type="primary" size="small" class="small-btn" @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="name">
+            <v-select ref="name" allowClear placeholder="请选择网点标签" v-model="form.name" code="CHECK_ENABLE_STATE"></v-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item label="经度" prop="name">
+            <a-row :gutter="20">
+              <a-col :span="17">
+                <a-input v-model="form.name" :maxLength="20" placeholder="请输入经度坐标" />
+              </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>
+                </a>
+              </a-col>
+            </a-row>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item label="纬度" prop="name">
+            <a-input v-model="form.name" :maxLength="20" placeholder="请输入纬度坐标" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item label="服务类型" prop="name">
+            <v-select ref="name" allowClear placeholder="请选择服务类型" v-model="form.name" code="CHECK_ENABLE_STATE"></v-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item label="营业时间" prop="name">
+            <a-row :gutter="20">
+              <a-col :span="11">
+                <a-time-picker :default-open-value="moment('00:00', 'HH:mm')" @change="onStartChange" format="HH:mm" placeholder="请选择开始时间" class="time-picker" />
+              </a-col>
+              <a-col :span="2">至</a-col>
+              <a-col :span="11">
+                <a-time-picker :default-open-value="moment('00:00', 'HH:mm')" @change="onStartChange" format="HH:mm" placeholder="请选择结束时间" class="time-picker" />
+              </a-col>
+            </a-row>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item label="时段价格" prop="name" :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }">
+            <a-button type="primary" size="small" class="small-btn">添加时段</a-button>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item label="路线指引" prop="name" :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }">
+            <editor ref="editor" @on-change="editorChange" :cache="false" v-model="form.name"></editor>
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item label="温馨提示" prop="name" :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }">
+            <a-textarea v-model="form.name" :maxLength="128" :auto-size="{ minRows: 3, maxRows: 5 }" placeholder="请输入温馨提示,128个字以内" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :span="24">
+          <a-form-model-item :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }" class="btn-cont">
+            <a-button type="primary" @click="onSubmit">保存</a-button>
+            <a-button style="margin-left: 10px;" @click="resetForm">取消</a-button>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
     </a-form-model>
+    
+    <!-- 选择设备 -->
+    <choose-equipment
+      :openEquipmentModal="openEquipmentModal"
+      @close="openEquipmentModal=false"
+    />
+    
   </a-modal>
 </template>
 
 <script>
+  import { VSelect } from '@/components'
+  import ChooseEquipment from './ChooseEquipment.vue'
+  import Editor from '@/components/WEeditor'
+  import moment from 'moment'
   export default{
     name: 'AddCarWashModal',
+    components: { VSelect, Editor, ChooseEquipment },
     props: {
       openModal: {  //  弹框是否展示
         type: Boolean,
@@ -29,26 +160,66 @@
         },
         rules: {
           name: [
-            { required: true, message: '请输入网店名称,20个字以内', trigger: 'blur' }
+            { required: true, message: '请输入网店名称', trigger: 'blur' }
           ]
-        }
+        },
+        openEquipmentModal: false  //  选择设备  弹框展示状态
+      }
+    },
+    methods: {
+      moment,
+      //  营业时间 开始时间  change
+      onStartChange(time, timeString) {
+        console.log(time, timeString)
+      },
+      // 文本编辑器  change
+      editorChange (html, text) {
+        this.form.name = html
+        // 点击查看详情时给文本编辑器赋值
+        // this.$refs.editor.setHtml(this.formData.content)
+      },
+      //  保存
+      onSubmit(){
+        
+      },
+      //  取消
+      resetForm(){
+        this.$refs.ruleForm.resetFields()
+        this.isShow = false
       }
     },
     watch: {
+      //  父页面传过来的弹框状态
       openModal (newValue, oldValue) {
         this.isShow = newValue
       },
+      //  重定义的弹框状态
       isShow (val){
         if (!val){
           this.$emit('close')
         }
-      },
+      }
     }
   }
 </script>
 
 <style lang="less">
   .CarWashModal{
-    
+    .ant-sub-form-item{
+      margin-bottom: 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;
+    }
   }
 </style>

+ 1 - 1
src/views/CarWashManagement/CarWashManagement.vue

@@ -45,7 +45,7 @@
     </s-table>
     
     <!-- 新增/编辑 洗车机 -->
-    <AddCarWashModal
+    <add-car-wash-modal
       :openModal="openModal"
       :mtitle="mtitle"
       @close="openModal=false"

+ 71 - 0
src/views/CarWashManagement/ChooseEquipment.vue

@@ -0,0 +1,71 @@
+<template>
+  <a-modal class="CarWashEquipmentModal" title="选择设备" :width="600" :footer="null" :destroyOnClose="true" @cancel="modalIsShow=false" v-model="modalIsShow">
+    <!-- <a-input v-model="searchVal" placeholder="请输入" /> -->
+    <a-input-search placeholder="input search text" enter-button="查询" @search="onSearch" />
+    <a-radio-group v-model="equipment" @change="onChange">
+      <a-radio :style="radioStyle" :value="1">
+        Option A
+      </a-radio>
+      <a-radio :style="radioStyle" :value="2">
+        Option B
+      </a-radio>
+      <a-radio :style="radioStyle" :value="3">
+        Option C
+      </a-radio>
+      <a-radio :style="radioStyle" :value="4">
+        More...
+      </a-radio>
+    </a-radio-group>
+  </a-modal>
+</template>
+
+<script>
+  export default{
+    name: 'ChooseEquipment',
+    props: {
+      openEquipmentModal: {  //  弹框是否展示
+        type: Boolean,
+        default: false
+      },
+    },
+    data(){
+      return{
+        modalIsShow: this.openEquipmentModal,  //  弹框是否展示
+        searchVal: '',  // 查询条件
+        radioStyle: {  //  设备选项样式
+          display: 'block',
+          width: '100%',
+          border: '1px solid red',
+          borderRadius: '6px',
+          padding: '3px 15px',
+        },
+        equipment: '',  //  选中的设备
+      }
+    },
+    methods: {
+      //  查询
+      onSearch(value) {
+        console.log(value);
+      },
+      // 设备  change
+      onChange(e) {
+        console.log('radio checked', e.target.value)
+      }
+    },
+    watch: {
+      //  父页面传过来的弹框状态
+      openEquipmentModal (newValue, oldValue) {
+        this.modalIsShow = newValue
+      },
+      //  重定义的弹框状态
+      modalIsShow (val){
+        if (!val){
+          this.$emit('close')
+        }
+      }
+    }
+  }
+</script>
+
+<style>
+</style>