京东链接

src/views/order/Detail.vue

@@ -100,6 +100,9 @@
             <div v-if="$module('order-printer') && $auth('/order/detail.printer')" class="action-item">
               <a-button @click="handlePrinter">打印小票</a-button>
             </div>
+            <div class="action-item">
+              <a-button @click="onClickJongDongLink">京东链接</a-button>
+            </div>
           </div>
           <a-divider class="o-divider" />
         </template>
@@ -132,7 +135,7 @@
           <a-descriptions-item label="商家备注">
             <!-- <div v-html="record.merchant_remark" v-if="record.merchant_remark"></div> -->
             <!-- <Ueditor v-if="record.merchant_remark" v-decorator="['record.merchant_remark']" /> -->
-            <span style="color: #d6893b;cursor: pointer;" @click="handleMerchantRemark">查看备注</span>
+            <span style="color: #d6893b; cursor: pointer" @click="handleMerchantRemark">查看备注</span>
           </a-descriptions-item>
           <a-descriptions-item v-if="record.trade" label="第三方支付订单号">
             <span>{{ record.trade ? record.trade.out_trade_no : '-' }}</span>
@@ -258,13 +261,13 @@
                     item.delivery_method == 20 ? '无需物流' : item.express.express_name
                   }}</a-descriptions-item>
                   <!-- isLink -->
-                  <a-descriptions-item  label="物流单号">
+                  <a-descriptions-item label="物流单号">
                     <a
                       v-if="item.isLink"
                       :href="item.express_no"
                       style="white-space: pre-wrap; color: #00acff"
                       target="_blank"
-                      >{{ item.express_no ? '京东物流'  : '--' }}</a
+                      >{{ item.express_no ? '京东物流' : '--' }}</a
                     >
                     <p v-else style="white-space: pre-wrap">{{ item.express_no ? item.express_no : '--' }}</p>
                   </a-descriptions-item>
@@ -368,6 +371,7 @@
     <PrinterForm ref="PrinterForm" @handleSubmit="handleRefresh" />
     <PriceForm ref="PriceForm" @handleSubmit="handleRefresh" />
     <RemarkForm ref="RemarkForm" @handleSubmit="handleRefresh" />
+    <JingDong ref="JingDong" @handleSubmit="handleRefresh" />
   </div>
 </template>
 
@@ -375,8 +379,8 @@
 import { inArray } from '@/utils/util'
 import * as Api from '@/api/order'
 import { GoodsItem, UserItem } from '@/components/Table'
-import { DeliveryForm, ExtractForm, CancelForm, PrinterForm, PriceForm, RemarkForm } from './modules'
-import { Ueditor} from '@/components'
+import { DeliveryForm, ExtractForm, CancelForm, PrinterForm, PriceForm, RemarkForm, JingDong } from './modules'
+import { Ueditor } from '@/components'
 import {
   OrderTypeEnum,
   DeliveryStatusEnum,
@@ -432,7 +436,8 @@ export default {
     PrinterForm,
     PriceForm,
     RemarkForm,
-    Ueditor
+    Ueditor,
+    JingDong,
   },
   data() {
     return {
@@ -491,10 +496,10 @@ export default {
               }
             })
           } else {
-            if (this.containsLetterMix(record.express_no, 'http')) {
-              record.isLink = true
+            if (this.containsLetterMix(this.record.express_no, 'http')) {
+              this.record.isLink = true
             } else {
-              record.isLink = false
+              this.record.isLink = false
             }
           }
           // 初始化数据
@@ -581,6 +586,11 @@ export default {
       const { record } = this
       this.$refs.RemarkForm.show(record)
     },
+    // 京东链接
+    onClickJongDongLink() {
+      const { record } = this
+      this.$refs.JingDong.show(record)
+    },
   },
 }
 </script>

src/views/order/modules/JingDong.vue

@@ -0,0 +1,115 @@
+<template>
+  <a-modal
+    :title="title"
+    :width="560"
+    :visible="visible"
+    :isLoading="isLoading"
+    :confirmLoading="isLoading"
+    :maskClosable="false"
+    @ok="handleSubmit"
+    @cancel="handleCancel"
+  >
+    <a-spin :spinning="isLoading">
+      <a-form :form="form">
+        <a-form-item
+          label="京东链接"
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+        >
+          <a-textarea
+            placeholder="请输入京东链接"
+            :auto-size="{ minRows: 2, maxRows: 5 }"
+            v-decorator="['jd_link', { rules: [{ required: true, message: '请输入京东链接' }] }]"
+          />
+        </a-form-item>
+      </a-form>
+    </a-spin>
+  </a-modal>
+</template>
+
+<script>
+import _ from 'lodash'
+import * as Api from '@/api/order/event'
+import { Ueditor } from '@/components'
+export default {
+  components: {
+    Ueditor,
+  },
+  data() {
+    return {
+      // 对话框标题
+      title: '商家备注',
+      // 标签布局属性
+      labelCol: { span: 6 },
+      // 输入框布局属性
+      wrapperCol: { span: 14 },
+      // modal(对话框)是否可见
+      visible: false,
+      // modal(对话框)确定按钮 loading
+      isLoading: false,
+      // 当前表单元素
+      form: this.$form.createForm(this),
+      // 当前记录
+      record: {},
+    }
+  },
+  created() {},
+  methods: {
+    // 显示对话框
+    show(record) {
+      // 显示窗口
+      this.visible = true
+      // 当前记录
+      this.record = record
+      // 设置默认值
+      this.setFieldsValue()
+    },
+
+    // 设置默认值
+    setFieldsValue() {
+      const {
+        record,
+        $nextTick,
+        form: { setFieldsValue },
+      } = this
+      $nextTick(() => {
+        setFieldsValue({ jd_link: record.jd_link })
+      })
+    },
+
+    // 确认按钮
+    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.isLoading = true
+      Api.updateRemark({ orderId: this.record.order_id, form: values })
+        .then((result) => {
+          // 显示成功
+          this.$message.success(result.message, 1.5)
+          // 关闭对话框事件
+          this.handleCancel()
+          // 通知父端组件提交完成了
+          this.$emit('handleSubmit', values)
+        })
+        .finally(() => (this.isLoading = false))
+    },
+  },
+}
+</script>

src/views/order/modules/index.js

@@ -4,5 +4,6 @@ import CancelForm from './CancelForm'
 import PrinterForm from './PrinterForm'
 import PriceForm from './PriceForm'
 import RemarkForm from './RemarkForm'
+import JingDong from './JingDong'
 
-export { DeliveryForm, ExtractForm, CancelForm, PrinterForm, PriceForm, RemarkForm }
+export { DeliveryForm, ExtractForm, CancelForm, PrinterForm, PriceForm, RemarkForm,JingDong }