20230303

src/views/modules/order/set-deliver-dialog.vue

@@ -0,0 +1,154 @@
+<template>
+    <div>
+        <el-dialog title="发货配置" :close-on-click-modal="false" :visible.sync="visible" width='500px'
+            :before-close="beforeCloseDialog">
+            <!-- <el-steps :active="stepsActive" simple style="margin-bottom: 20px;;">
+                    <el-step title="获取电子面单" icon="el-icon-tickets"></el-step>
+                    <el-step title="打印电子面单" icon="el-icon-printer"></el-step>
+                </el-steps> -->
+            <!-- <el-alert style="margin-bottom: 15px;" v-if="selectData.length > 0"
+                    :title="`您正在对 ${selectData.length} 条数据进行发货操作。`" :closable="false" type="success">
+                </el-alert> -->
+            <el-form v-if="ruleForm" :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px"
+                class="demo-ruleForm">
+                <el-form-item label="选择物流" prop="deliverLcd">
+                    <el-select size="mini" v-model="ruleForm.deliverLcd" placeholder="请选择物流" @change="selectChanged">
+                        <el-option v-for="(item, index) in expressList" :label="item.dictValue"
+                            :value="item.dictType"></el-option>
+                    </el-select>
+                </el-form-item>
+            </el-form>
+            <div slot="footer" class="dialog-footer" style="text-align: center;">
+                <el-button type="primary" @click="setDevliverHandle">立即发货</el-button>
+            </div>
+        </el-dialog>
+        <!-- <ul class="print-ul" style="display: block;">
+                <li v-for="(item, index) in printArr" :key="index" :id="'printDiv' + index"
+                    style="page-break-after:always;">
+                    <div v-html="item"></div>
+                </li>
+            </ul> -->
+
+</div>
+</template>
+
+<script>
+
+export default {
+    name: 'printOrderDialog',
+    props: {
+        visible: {
+            type: Boolean,
+            value: true
+        },
+        selectData: {
+            type: Array,
+            value: []
+        }
+    },
+    data() {
+        return {
+            // 快递列表
+            expressList: [],
+            fullscreenLoading: false,
+            // 后台返回的面单的打印数组：
+            printArr: [],
+            stepsActive: 1,  // 当前step激活索引值
+            ruleForm: {
+                deliverLcd: '',
+                dictValue: ''
+            },
+            orderDetailIdList: [],
+            rules: {
+                deliverLcd: [
+                    { required: true, message: '请先选择物流公司', trigger: 'change' }
+                ]
+            }
+        }
+    },
+    created() {
+        // 获取物流列表
+        this.getExpressList()
+    },
+    methods: {
+        // 获取快递公司列表
+        getExpressList() {
+            this.$http({
+                url: this.$http.adornUrl('/book/sysdictdata/selectByType/express_name'),
+                method: 'get',
+            }).then(({ data }) => {
+                console.log(data, '快递列表')
+                this.expressList = data.dataList
+            })
+        },
+        selectChanged(val) {
+            console.log(val.dictValue)
+            if (this.expressList && this.expressList.length > 0) {
+                this.expressList.forEach(element => {
+                    if (element.dictType == val) {
+                        return this.ruleForm.dictValue = element.dictValue
+                    }
+                });
+            }           
+        },        
+        // 关闭页面
+        beforeCloseDialog() {
+            this.$emit('closeDeliverDialog', false)
+            this.$refs['ruleForm'].resetFields()
+            this.$refs['ruleForm'].clearValidate()
+            this.selectData = []
+        },
+        // 发货操作
+        setDevliverHandle() {
+            this.$refs['ruleForm'].validate((valid) => {
+                if (valid) {
+                    const loading = this.$loading({
+                        lock: true,
+                        text: '正在处理，请稍后...',
+                        spinner: 'Loading',
+                        background: 'rgba(0, 0, 0, 0.7)'
+                    });
+                    // 发送后台请求
+                    this.$http({
+                        url: this.$http.adornUrl(`/book/buyorder/delivery/${this.ruleForm.deliverLcd}`),
+                        method: 'post',
+                        params: this.$http.adornParams({
+                            "shipperName": this.ruleForm.dictValue
+                        }),
+                        data: this.selectData,
+                        // 传orderid 
+                    }).then(({ data }) => {
+                        //  console.log(data)
+                        loading.close();
+                        if (data && data.code === 0) {
+                            console.log(data)
+                            this.beforeCloseDialog()  // 关闭弹窗                        
+                            return this.$message.success('发货成功')
+                        } else {
+                            this.beforeCloseDialog()  // 关闭弹窗
+                            return this.$message.error('发货失败')
+
+                        }
+                    }).catch((err) => {
+                        console.log(err)
+                    })
+                }
+            })
+        }
+    },
+
+}
+
+</script>
+<style>
+.content {
+    text-align: center;
+    margin-top: 15px;
+}
+
+.el-step {
+    font-size: 20px;
+    vertical-align: middle;
+    line-height: 0;
+}
+</style>