qimall/backend/modules/mall/views/setting/order.php

<?php
use common\helpers\ComponentHelper;
use common\helpers\AddonHelper;

ComponentHelper::loadComponentView('coupon-select', AddonHelper::getAddonRootPath('Coupon') . 'backend/views/components');
// ComponentHelper::loadComponentView('com-dialog-select');

ComponentHelper::loadComponentView('com-dialog-select');


?>
<style>
    .app-share {
        padding-top: 12px;
        border-top: 1px solid #e2e2e2;
        margin-top: -20px;
    }

    .app-share .app-share-bg {
        position: relative;
        width: 310px;
        height: 360px;
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center
    }

    .app-share .app-share-bg .title {
        width: 160px;
        height: 29px;
        line-height: 1;
        word-break: break-all;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

    .app-share .app-share-bg .pic-image {
        background-repeat: no-repeat;
        background-position: 0 0;
        background-size: cover;
        width: 160px;
        height: 130px;
    }
    .el-card__header {
        padding: 8px 20px;
    }
    .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item {
        margin: 5px;
    }
    .el-form-item__content, .el-form-item__label{
        margin-top: 10px;
    }
    
    .main_box {
        background: #fff;
        padding: 0 25px 25px;
    }

    .main_img_box {
        width: 376px;
        height: 760px;
        position: relative;
        margin-right: 48px;
    }

    .main_img {
        position: absolute;
        top: 0;
        left: 0;
    }

    .main_content {
        width: 750px;
        height: 1334px;
        position: absolute;
        top: 137px;
        left: 49.1%;
        transform: translateX(-50%);
        background-size:cover;
        background-repeat:no-repeat;
        background-position:center;
        border-radius: 0 0 77px 74px;
        scrollbar-width: none;
        zoom: 0.464;
        /* firefox */
        -ms-overflow-style: none;
        /* IE 10+ */
        overflow-x: hidden;
        overflow-y: hidden;
    }

    .main_content_img {
        position: absolute;
        top: 10px;
        left: 10px;
        right: 10px;
        bottom: 10px;
        background: url('resources/img/mall/decorate/sun_single.png') no-repeat center;
        background-size: 100%;
        padding: 20px; /* 设置内边距来实现边距效果 */
    }

    .main_content_border {
        position: absolute;
        top: 108px;
        left: 27px;
        width: 676px;
        height: 677px;
        background-color: transparent;
        border: 17px solid #000;
        border-radius: 27px 27px 0 0
    }

    .main_content_notch {
        position: absolute;
        top: 108px;
        left: 50%; /* 将左侧位置设置为50% */
        transform: translateX(-50%); /* 使用transform属性将元素水平居中 */
    }

    .main_content_priceBg {
        position: absolute;
        top: 808px;
        left: 56px;
        width: 264px;
        height: 64px;
        line-height: 64px;
        /* 背景颜色 */
        background-color: #ff4544; /* 红色背景 */
        border-radius: 48px; /* 圆角 */
        color: #ffffff; 
        font-size:26px;
        padding:0 29px; 
    }

    .edit_box .el-button {
        width: 158px;
        height: 35px;
        padding: 10px 20px;
    }

    .edit_box {
        padding-top: 40px;
    }

    .save_btn {
        margin-top: 80px;
    }

    /* 公共样式 */
    .flex {
        display: -webkit-box;
        display: -webkit-flex;
        /* #ifndef APP-NVUE */
        display: flex;
        /* #endif */
    }
    
    .flex-y-center {
        display: -webkit-box;
        display: -webkit-flex;
        /* #ifndef APP-NVUE */
        display: flex;
        /* #endif */
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        -ms-grid-row-align: center;
        align-items: center;
    }

    .default_tips {
        text-align: center;
        margin-top: 200px;
        color: #D0D2D6;
        font-size: 35px;
    }
    
</style>
<div id="app" v-cloak>
    <el-card class="box-card" v-loading="loading" shadow="never" style="border:0;min-width: 1200px;" body-style="background-color: #f3f3f3;padding: 10px 0 0;">
        <div class="form_box">
            <template>
                <el-card>
                    <el-form :model="ruleForm" size="small" ref="ruleForm"  label-width="150px">
                        <el-tabs v-model="activeName">
                            <el-tab-pane label="基础设置" name="basic">
                                <?=ComponentHelper::loadComponentView('order/basic', __DIR__ . '/');?>
                            </el-tab-pane>

                            <el-tab-pane label="退货地址" name="refund">
                                <?=ComponentHelper::loadComponentView('order/refund', __DIR__ . '/'); ?>
                            </el-tab-pane>

                            <el-tab-pane label="满邮减免" name="freight">
                                <?=ComponentHelper::loadComponentView('order/freight', __DIR__ . '/'); ?>
                            </el-tab-pane>

                            <el-tab-pane label="抵扣设置" name="score">
                                <?=ComponentHelper::loadComponentView('order/score', __DIR__ . '/'); ?>
                            </el-tab-pane>
                            <el-tab-pane label="营销设置" name="marketing">
                                <?=ComponentHelper::loadComponentView('order/marketing', __DIR__ . '/'); ?>
                            </el-tab-pane>
                            <el-tab-pane label="业绩设置" name="achievement">
                                <?=ComponentHelper::loadComponentView('order/achievement', __DIR__ . '/'); ?>
                            </el-tab-pane>
                            <el-tab-pane label="晒单设置" name="sun_single">
                                <?=ComponentHelper::loadComponentView('order/sun_single', __DIR__ . '/'); ?>
                            </el-tab-pane>
                        </el-tabs>
                        <el-button v-if="activeName=='basic' || activeName=='marketing'" :loading="btnLoading" class="button-item" type="primary" style="margin-top: 24px;" @click="submit" size="small">保存
                        </el-button>
                    </el-form>
                </el-card>
            </template>
        </div>
    </el-card>
</div>
<script src="<?= Yii::$app->request->baseUrl ?>/resources/unpkg/vuedraggable@2.18.1/dist/vuedraggable.umd.min.js"></script>
<script>
    const app = new Vue({
        el: '#app',
        data() {
            return {
                loading: false,
                btnLoading: false,
                params: {},
                pay_after_link_show: '我的订单',
                defaultTabs: [
                    {"name":"mall"}
                ],
                activeName: 'basic',
                dialogVisible: false,
                settingPop: false,
                isAdd: true,
                reloadData: false,
                couponLoading: false,
                addressForm: {
                    consignee: '',
                    name: '',
                    mobile: '',
                    address: ''
                },
                imgCaseImg: '',
                ruleForm: {
                    // 基础设置
                    order: {
                        is_town:{title:'收货地址是否精确到镇',value:'0',remark:'收货地址精确到镇，用户收货地址需要选择镇'},
                        payment_expire_time:{title:'未支付订单超时时间',value:10,remark:'注意：最长时间为7天，单位：分钟'},
                        auto_receiving_time:{title:'自动确认收货时间',value:7,remark:'从发货到自动确认收货的时间，单位：天'},
                        can_after_sale_time:{title:'可以申请售后时间',value:7,remark:'可以申请售后的时间，注意：分销订单中的已完成订单，只有订单已确认收货，并且时间超过设置的售后天数之后才计入其中！单位：天'},
                        send_type:{
                            title:'发货方式',
                            value:[],
                            remark:'需添加门店，到店自提方可生效',
                            type:'checkbox',
                            extra:{
                                express:'快递配送',
                                offline:'到店自提',
                                city:'同城配送',
                            }
                        },
                        pay_after_link:{title:'订单支付成功后跳转',value:10,remark:'订单支付成功后跳转的页面'},
                        is_show_username:{title:'显示真实姓名',value:'0',remark:'在订单管理处是否显示真实姓名'},
                        limit_multi_province:{title:'限制添加多个省份地址',value:'0',remark: '一个用户不可以添加多个省份的收货地址'},
                        is_show_return_btn:{title:'放弃退换货按钮显示',value:'0',remark: '若开启放弃退换货，则用户可在订单详情处进行放弃退换货，订单直接变成已完成状态'},
                        return_prompt_content:{title:'放弃退换货提示内容',value:'',remark: ''},
                        is_show_positioning: {
                            title: '显示定位按钮',
                            value: 1,
                            remark: '',
                        },
                        is_show_invoice: {
                            title: '显示申请开票按钮',
                            value: 0,
                            remark: '',
                        },
                        is_stop_order: {
                            title: '是否关闭下单',
                            value: 0,
                            remark: '',
                        },
                        is_show_update_address: {
                            title: '是否隐藏修改地址',
                            value: 0,
                            remark: '开启后，前端将不再显示修改地址按钮',
                        },
                        score_deduct_value_list: {
                            title: '折扣多选框',
                            value: [],
                            type:'checkbox',
                            extra: [
                                {name: '会员折扣价抵扣', value: 'member'},
                                {name: '经销商内购商品抵扣', value: 'distributor'},
                            ]
                        },
                        is_score_deduct_status: {
                            title: '积分抵扣',
                            value: 0,
                            remark: '注释：开启此功能后，如果客户购买的商品有会员价抵扣了部分金额，被抵扣的金额将会以积分的形式被扣除，如：' +
                            '商品价格100元，会员折扣7折，用户支付70元，剩余优惠的30元将以30积分（积分的比例在积分设置）被抵扣掉，若积分不足则无法生成订单',
                        },
                        is_designated_achievement_goods: {
                            title: '指定商品可增加业绩',
                            value: 0,
                            remark: '开启后，只有指定的商品才能增加业绩',
                            goodsIds: []
                        },
                        achievement_goods_ids: {
                            value: [],
                        },
                        goods_deduct:{
                            title: '内购抵扣',
                            value: 'agent',
                            remark: '当“渠道分红”及“渠道业绩”插件同时存在，被选中的插件的内购“商品抵扣”功能才能生效',
                        },
                        goods_deduct_list: {
                            title: '内购抵扣选项',
                            value: [],
                        },
                        bottom_background_color: [
                            {required: true, message: '请选择底栏背景颜色', trigger: 'change'},
                        ],
                        inactive_color: [
                            {required: true, message: '请选择文字颜色', trigger: 'change'},
                        ],
                        active_color: [
                            {required: true, message: '请选择文字选中状态颜色', trigger: 'change'},
                        ],
                        
                    },
                    // 售后设置
                    // return_address: {
                    //     consignee:{title:'收货人',value:'',remark: ''},
                    //     mobile:{title:'退货手机号',value:'',remark: ''},
                    //     address:{title:'退货地址',value:'',remark: ''}
                    // },
                    return_address:{
                        return_address: {value:[]}
                    },
                    freight: {
                        is_open:{title:'开启满邮减免',value:'0',remark:'开启后则会使用邮费满减规则'},
                        full_reduce: {
                            title:'满M元邮费减N元',
                            value: [
                                {
                                    full: 0.00,
                                    reduce: 0.00,
                                },
                            ],
                            remark:''
                        }
                    },
                    //营销设置
                    marketing: {
                        enable_marketing: {'title' : "是否开启全局营销配置", 'value' : 0}, 
                        total_price: {'title': "订单消费金额条件", 'value':0.00},
                        enable_give_score: {'title':"是否开启赠送积分", 'value': 0},
                        enable_give_balance: {'title': "是否开启赠送余额", 'value': 0},
                        enable_give_redpack: {'title': "是否开启赠送红包", 'value': 0},
                        enable_give_coupon: {'title': "是否开启赠送优惠券", 'value': 0},
                        score_give_setting: { //积分赠送配置
                            'title' : "积分赠送配置",
                            'value': {
                                give_type: '1', //类型
                                give_num: 0, //数量
                                score_giving_goods_type: [], //商品类型
                                score_giving_calculation: '0', //计算方式
                            }
                        },
                        balance_give_setting: { //余额赠送配置
                            'title': "余额赠送配置",
                            'value': {
                                give_type: '1', //类型
                                give_num: 0, //数量
                            }
                        },
                        redpack_give_setting: {//红包赠送配置
                            'title': "红包赠送配置",
                            'value': {
                                give_type: '1', //类型
                                give_num: 0, //数量
                            }
                        },
                        coupon_give_setting: { //优惠券赠送配置
                            'title': "优惠券赠送配置",
                            'value': {
                                multiple_selection: [],
                            }
                        },
                        settlement: {
                            'title': "结算方式 1：支付成功，2：订单完成",
                            'value': 1
                        }, //结算方式 1：支付成功，2：订单完成
                        is_install_coupon: {
                            'title': "是否安装优惠券插件",
                            'value': 1 //0:未安装，1：已安装
                        },
                        is_installed_redpack: {
                            'title': "是否安装红包插件",
                            'value': 1 //0:未安装，1：已安装
                        },
                    },
                    // 晒单
                    sun_single:{
                        setting:{title:'晒单设置',value:1,remark:''},
                        type:{title:'类型',value:1,remark:''},
                        border_color:{title:'边框颜色',value:'#ffdeb5',remark:''},
                        price_bg_color:{title:'活动价背景颜色',value:'#eb3534',remark:''},
                        price_font_color:{title:'活动价字体颜色',value:'#fff',remark:''},
                        poster_background:{title:'海报底图',value:'',remark:''},
                        poster_notch:{title:'刘海图',value:'',remark:''},

                    },
                },
                achievementGoodsList: [],
                keyword: '',
                rules: {
                    sun_single:{
                        border_color: [
                            {required: true, message: '请选择底栏背景颜色', trigger: 'change'},
                        ],
                        price_bg_color: [
                            {required: true, message: '请选择文字颜色', trigger: 'change'},
                        ],
                        price_font_color: [
                            {required: true, message: '请选择文字选中状态颜色', trigger: 'change'},
                        ],
                    }
                },
                predefineColors: [
                    '#000',
                    '#fff',
                    '#888',
                    '#ff4544'
                ],
            }
        },
        mounted: function() {
            this.loadData();
        },
        methods: {
            loadData() {
                if(this.loading === true) return;
                this.loading = true;
                request({
                    params: {
                        r: 'mall/setting/edit',
                        type: 'mall_order',
                    },
                    method: 'get'
                }).then(e => {
                    this.loading = false;
                    if (e.data.code == 0) {
                        if(e.data.data) {//有选中的
                            var data = e.data.data;
                            Object.keys(this.ruleForm).forEach((key) => {
                                Object.keys(this.ruleForm[key]).forEach((k) => {
                                    if (data[key][k]) {
                                        var dataValue = data[key][k].value;
                                        if(data[key][k].value!=null){
                                            if (typeof dataValue == 'string' && (dataValue.indexOf("{") !== -1 || dataValue.indexOf("[") !== -1)) {        
                                                // 将json字符串转为对象
                                                if (k == 'pay_after_link') {
                                                    var pay_after_link = JSON.parse(data[key][k].value);
                                                    this.pay_after_link_show = pay_after_link.params.title;
                                                    this.ruleForm[key][k].value = data[key][k].value;
                                                } else {
                                                    this.ruleForm[key][k].value = JSON.parse(data[key][k].value);
                                                }
                                            }else{
                                                this.ruleForm[key][k].value = data[key][k].value;
                                            }
                                        }
                                    }
                                });
                            });

                            this.achievementGoodsList = data.achievementGoodsList ?? []
                        }
                    }
                    console.log(this.ruleForm.return_address.return_address)
                }).catch(e => {
                    this.loading = false;
                })
            },
            submit() {
                if(!Number.isFinite(this.ruleForm.order.payment_expire_time.value)){
                    this.$message.error('设置未支付订单超时时间只能是数字');
                    return false;
                }if(this.ruleForm.order.payment_expire_time.value<10){
                    this.$message.error('设置未支付订单超时时间不能低于10分钟');
                    return false;
                }
                if (this.ruleForm.return_address.return_address.value.length == 0) {
                    this.$message.error('请添加退货地址');
                    return false;
                }

                // 判断如果开启营销配置。商品类型必须选择
                if (this.ruleForm.marketing.enable_marketing.value && this.ruleForm.marketing.score_give_setting.value.score_giving_goods_type.length === 0) {
                    this.$message.error('营销设置-商品类型必须选择一项');
                    return false;
                }
                // 选择的业绩商品写入到goodsIds
                this.ruleForm.order.achievement_goods_ids.value = []
                console.log(this.achievementGoodsList)
                for (const achievementGoodsItem of this.achievementGoodsList) {
                    this.ruleForm.order.achievement_goods_ids.value.push(achievementGoodsItem.id)
                }

                this.btnLoading = true;
                this.$request({
                    params: {
                        r: 'mall/setting/edit',
                    },
                    method: 'post',
                    data: {
                        setting: this.ruleForm,
                    },
                }).then(e => {
                    this.ruleForm.order.achievement_goods_ids.value = []

                    this.btnLoading = false;
                    if (e.data.code === 0) {
                        this.$message.success(e.data.msg);
                    } else {
                        this.$message.error(e.data.msg);
                    }
                    this.loading = false;
                    this.settingPop = false;

                }).catch(e => {
                    this.btnLoading = false;
                    this.loading = false;
                    this.settingPop = false;
                });
            },
            selectLinkUrl(e) {
                let self = this;
                e.forEach(function (item, index) {
                    self.ruleForm.link_url = item.new_link_url;
                    self.ruleForm.link = item;
                })
            },
            picUrl(e) {
                if (e.length) {
                    this.ruleForm.pic_url = e[0].url;
                    this.$refs.ruleForm.validateField('pic_url');
                }
            },
            imgCase(img) {
                this.dialogVisible = true;
                this.imgCaseImg = img;
            },
            selectUrl(e) {
                let self = this;
                let link_data = {};
                console.log(e);
                e.forEach(function (item) {
                    self.pay_after_link_show = item.title;
                    link_data = {
                        route: item.route,
                        open_type: item.open_type,
                        params: item.params,
                    }
                });
                self.ruleForm.order.pay_after_link.value = JSON.stringify(link_data);
            },
            //添加地址
            addAddress() {
                console.log(this.ruleForm.return_address.return_address.value)
                this.loading = true;
                for (let i in this.addressForm) {
                    if (this.addressForm[i] == '') {
                        this.$message.error('内容不能为空');
                        return false;
                    }
                }
                if (this.isAdd) {
                    this.ruleForm.return_address.return_address.value.push(this.addressForm);
                }
                this.submit();
                this.reloadData = true;
            },
            //删除地址
            delAddress(index) {
                this.$confirm('删除该地址, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.loading = true;
                    if (this.ruleForm.return_address.return_address.value && this.ruleForm.return_address.return_address.value.length > index) {
                        this.ruleForm.return_address.return_address.value.splice(index, 1);
                    }
                    console.log();
                    this.submit(this.ruleForm.return_address.return_address.value);
                    this.loading = false;
                })
            },
            //显示添加弹窗
            showPop() {
                this.isAdd = true;
                this.settingPop = true;
                this.addressForm = {};
            },
            //修改地址
            editAddress(index,data) {
                this.settingPop = true;
                this.isAdd = false;
                this.addressForm = {};
                this.$set(this.addressForm, 'name', data.name);
                this.$set(this.addressForm, 'consignee', data.consignee);
                this.$set(this.addressForm, 'mobile', data.mobile);
                this.$set(this.addressForm, 'address', data.address);
                this.ruleForm.return_address.return_address.value[index] = this.addressForm;
                console.log(this.ruleForm.return_address.return_address.value);
            },
            // 操作处理
            handle(type, data = null) {
                switch (type) {
                    case 'freight_add':// 添加满邮
                        this.ruleForm.freight.full_reduce.value.push({
                            full:"0.00",
                            reduce:"0.00",
                        });
                        break;
                    case 'freight_del':// 删除满邮
                        this.ruleForm.freight.full_reduce.value.splice(data,1);
                        break;
                    case 'coupon_select':
                        this.couponLoading = true;
                        break;
                    case 'coupon_delete':
                        console.log(this.ruleForm.marketing.coupon_give_setting.value);
                        this.ruleForm.marketing.coupon_give_setting.value.multiple_selection.splice(data, 1);
                        this.$forceUpdate();
                        break;
                }
            },

            handleCoupon(data) {
                this.couponLoading = false;
                this.ruleForm.marketing.coupon_give_setting.value.multiple_selection = data
                console.log(this.ruleForm.marketing.coupon_give_setting.value);
            },

            handleGiveTypeChange(pindex) {
                if (this.ruleForm.marketing[pindex].value.give_type == 2) {
                    let giveNum = this.ruleForm.marketing[pindex].value.give_num
                    giveNum = giveNum ? giveNum : 0
                    this.ruleForm.marketing[pindex].value.give_num = parseInt(giveNum)
                }
            },

            formatGiveNumber(value, pindex) {
                if (this.ruleForm.marketing[pindex].value.give_type == 2) {
                    this.ruleForm.marketing[pindex].value.give_num = value.replace(/[^\d]/g, "")
                    if ( this.ruleForm.marketing[pindex].value.give_num > 100) {
                        this.ruleForm.marketing[pindex].value.give_num = 100;
                    }
                } else {
                    let temp = value.toString();
                    temp = temp.replace(/。/g, ".");
                    temp = temp.replace(/[^\d.]/g, ""); //清除"数字"和"."以外的字符
                    temp = temp.replace(/^\./g, ""); //验证第一个字符是数字
                    temp = temp.replace(/\.{2,}/g, ""); //只保留第一个, 清除多余的
                    temp = temp.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
                    temp = temp.replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3");
                    this.ruleForm.marketing[pindex].value.give_num = temp
                }
            },
            marketingOpen(val) {
                if (val == 1) {
                    this.ruleForm.marketing.enable_marketing.value = 0;
                    this.$confirm('开启此开关,商城所有订单满足消费条件都将会进行赠送，请谨慎开启', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        this.ruleForm.marketing.enable_marketing.value = 1;
                    }).catch(() => {
                        this.ruleForm.marketing.enable_marketing.value = 0;          
                    });
                }
            },
            // 业绩商品选择
            achievementGoodsSelect(goodsList) {
                for (const goodsItem of goodsList) {
                    let flag = true
                    for (const achievementGoodsItem of this.achievementGoodsList) {
                        if (goodsItem.id === achievementGoodsItem.id) {
                            flag = false
                            break
                        }
                    }
                    if (flag) {
                        this.achievementGoodsList.push(goodsItem)
                    }
                }
            },
            // 删除业绩商品
            deleteAchievementGoods(index) {
                this.achievementGoodsList.splice(index, 1)
            },
            // 切换模板、DIY
            changeSingleType(e){
                if (e == 0) {

                }
            },
            // 保存海报
            savePoster(){
                this.$request({
                    params: {
                        r: 'mall/setting/edit',
                    },
                    method: 'post',
                    data: {
                        setting: this.ruleForm,
                    },
                }).then(e => {
                    if (e.data.code == 0) {
                        this.$message({
                            message: '保存成功!',
                            type: 'success'
                        });
                    } else {
                        this.$message.error(e.data.msg);
                    }
                });
            }
        }
    });
</script>