更新停车场配置

src/api/store/shop/index.js

@@ -7,6 +7,7 @@ const api = {
   detail: '/shop/detail',
   add: '/shop/add',
   edit: '/shop/edit',
+  updateParking: '/shop/updateParking',
   delete: '/shop/delete'
 }
 
@@ -61,6 +62,14 @@ export function edit (data) {
   })
 }
 
+export function updateParking (data) {
+  return axios({
+    url: api.updateParking,
+    method: 'post',
+    data
+  })
+}
+
 /**
  * 删除记录
  * @param {*} data

src/views/store/shop/Create.vue

@@ -109,21 +109,6 @@
           </div>
         </a-form-item>
 
-        <!-- <a-form-item label="停车场名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input
-            placeholder="请输入停车场名称"
-            v-decorator="['parking_name']"
-          />
-        </a-form-item>
-        <a-form-item label="停车场描述" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-textarea :autoSize="{ minRows: 4 }" v-decorator="['parking_desc']" />
-        </a-form-item>
-
-        <a-form-item label="停车场坐标" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-input placeholder="请选择停车场坐标" v-decorator="['parking_coordinate']" />
-          <Getpoint @setCoordinate="setParkingCoordinate" />
-        </a-form-item> -->
-
         <a-form-item label="状态" :labelCol="labelCol" :wrapperCol="wrapperCol">
           <a-radio-group v-decorator="['status', { initialValue: 1, rules: [{ required: true }] }]">
             <a-radio :value="1">启用</a-radio>

src/views/store/shop/Index.vue

@@ -53,21 +53,26 @@
       </span>
       <!-- 操作 -->
       <div class="actions" slot="action" slot-scope="text, item">
+        <a @click="handleParking(item)">停车场配置</a>
         <a v-if="$auth('/store/shop/update')" @click="handleEdit(item)">编辑</a>
         <a v-action:delete @click="handleDelete(item)">删除</a>
       </div>
     </s-table>
+
+    <UpdateParking ref="UpdateParking" @handleSubmit="handleRefresh" />
   </a-card>
 </template>
 
 <script>
 import * as Api from '@/api/store/shop'
 import { STable } from '@/components'
+import UpdateParking from './UpdateParking'
 
 export default {
   name: 'Index',
   components: {
-    STable
+    STable,
+    UpdateParking
   },
   data () {
     return {
@@ -173,6 +178,11 @@ export default {
       })
     },
 
+    // 停车场配置
+    handleParking (item) {
+      this.$refs.UpdateParking.edit(item)
+    },
+
     /**
      * 刷新列表
      * @param Boolean bool 强制刷新到第一页

src/views/store/shop/Update.vue

@@ -222,7 +222,7 @@ export default {
         form.setFieldsValue(pick(record, [
           'shop_name', 'logo_image_id', 'linkman', 'phone',
           'shop_hours', 'address', 'summary', 'cascader',
-          'coordinate', 'sort', 'is_check', 'status', 'is_main', 'shop_image_id', 'remark'
+          'coordinate', 'sort', 'is_check', 'status', 'is_main'
         ]))
       })
 

src/views/store/shop/UpdateParking.vue

@@ -0,0 +1,124 @@
+<template>
+  <a-modal
+    :title="title"
+    :width="1100"
+    :visible="visible"
+    :confirmLoading="confirmLoading"
+    :maskClosable="false"
+    :destroyOnClose="true"
+    @ok="handleSubmit"
+    @cancel="handleCancel"
+  >
+    <a-spin :spinning="confirmLoading">
+      <a-form :form="form">
+        <a-form-item label="停车场名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input
+            placeholder="请输入停车场名称"
+            v-decorator="['parking_name']"
+          />
+        </a-form-item>
+        <a-form-item label="停车场描述" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-textarea :autoSize="{ minRows: 4 }" v-decorator="['parking_desc']" />
+        </a-form-item>
+
+        <a-form-item label="停车场坐标" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input placeholder="请选择停车场坐标" v-decorator="['parking_coordinate']" />
+          <Getpoint @setCoordinate="setCoordinate" />
+        </a-form-item>
+      </a-form>
+    </a-spin>
+  </a-modal>
+</template>
+
+<script>
+import pick from 'lodash.pick'
+import * as Api from '@/api/store/shop'
+import { SelectImage, Getpoint } from '@/components'
+
+export default {
+  components: {
+    SelectImage,
+    Getpoint
+  },
+  data () {
+    return {
+      // 对话框标题
+      title: '停车场配置',
+      // 标签布局属性
+      labelCol: { span: 3 },
+      // 输入框布局属性
+      wrapperCol: { span: 20 },
+      // modal(对话框)是否可见
+      visible: false,
+      // modal(对话框)确定按钮 loading
+      confirmLoading: false,
+      // 当前表单元素
+      form: this.$form.createForm(this),
+      // 当前记录
+      record: {}
+    }
+  },
+  methods: {
+
+    // 显示对话框
+    edit (record) {
+      // 显示窗口
+      this.visible = true
+      // 当前记录
+      this.record = record
+
+      this.record['parking_coordinate'] = [record.parking_latitude, record.parking_longitude].join(',')
+      // 设置默认值
+      this.setFieldsValue()
+    },
+
+    // 设置默认值
+    setFieldsValue () {
+      const { record, form: { setFieldsValue } } = this
+      this.$nextTick(() => {
+        setFieldsValue(pick(record, ['parking_name', 'parking_desc', 'parking_coordinate']))
+      })
+    },
+
+    // 确认按钮
+    handleSubmit (e) {
+      e.preventDefault()
+      // 表单验证
+      const { form: { validateFields } } = this
+      validateFields((errors, values) => {
+        // 提交到后端api
+        !errors && this.onFormSubmit(values)
+      })
+    },
+
+    // 关闭对话框事件
+    handleCancel () {
+      this.visible = false
+      this.form.resetFields()
+    },
+
+    // 提交到后端api
+    onFormSubmit (values) {
+      this.confirmLoading = true
+      Api.updateParking({ shopId: this.record.shop_id, form: values })
+        .then(result => {
+          // 显示成功
+          this.$message.success(result.message, 1.5)
+          // 关闭对话框事件
+          this.handleCancel()
+          // 通知父端组件提交完成了
+          this.$emit('handleSubmit', values)
+        })
+        .finally(() => this.confirmLoading = false)
+    },
+
+    setCoordinate (coordinate) {
+      const { form, $nextTick } = this
+      $nextTick(() => {
+        form.setFieldsValue({ parking_coordinate: coordinate })
+      })
+    }
+
+  }
+}
+</script>