jyy
2021-01-25 4d4805096b898a6e99f31794facb81794bd1fcf7
zq-erp/src/main/resources/templates/views/admin/hive/beautySalon/order-form.html
@@ -75,6 +75,47 @@
        .arrears {
            color: #E6A23C;
        }
        .paymethod ul {
            padding: 0;
            margin: 0;
            height: 50px;
        }
        .paymethod ul li {
            padding: 10px;
            margin: 5px;
            list-style:none;
            float: left;
            display: block;
            cursor: pointer;
            position: relative;
            border: white 1px solid;
        }
        .paymethod ul li:hover {
            border: #409EFF 1px solid;
        }
        .paymethod .active {
            border: #409EFF 1px solid;
        }
        .paymethod .active::after {
             content: '';
             display: block;
             height: 0px;
             width: 0px;
             position: absolute;
             bottom: 0;
             right: 0;
             color:#fff;
             /**对号大小*/
             font-size: 10px;
             line-height: 8px;
             border: 3px solid;
             border-color: transparent #4884ff #4884ff transparent;
         }
        .el-dialog__body {
            padding-top: 10px !important;
        }
    </style>
</head>
<body>
@@ -247,51 +288,51 @@
                        </template>
                    </el-table-column>
                    <el-table-column
                            label="应付">
                            label="小计">
                        <template slot-scope="scope">
                            {{scope.row.zkPrice * scope.row.count }}
                        </template>
                    </el-table-column>
                    <el-table-column
                            label="实付">
                        <template slot-scope="scope">
                            <el-input @change="calculationTotal(1)" v-model="scope.row.payMoney"></el-input>
                        </template>
                    </el-table-column>
<!--                    <el-table-column-->
<!--                            label="实付">-->
<!--                        <template slot-scope="scope">-->
<!--                            <el-input @change="calculationTotal(1)" v-model="scope.row.payMoney"></el-input>-->
<!--                        </template>-->
<!--                    </el-table-column>-->
                    <el-table-column
                            label="支付方式"
                            width="130">
                        <template slot-scope="scope">
                            <el-select @change="changePayMethod(scope.row)" v-model="scope.row.payMethod"
                                       placeholder="请选择支付方式">
                                <el-option
                                        v-for="item in payMethods"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value"
                                        :disabled="item.disabled">
                                </el-option>
                            </el-select>
                        </template>
                    </el-table-column>
<!--                    <el-table-column-->
<!--                            label="支付方式"-->
<!--                            width="130">-->
<!--                        <template slot-scope="scope">-->
<!--                            <el-select @change="changePayMethod(scope.row)" v-model="scope.row.payMethod"-->
<!--                                       placeholder="请选择支付方式">-->
<!--                                <el-option-->
<!--                                        v-for="item in payMethods"-->
<!--                                        :key="item.value"-->
<!--                                        :label="item.label"-->
<!--                                        :value="item.value"-->
<!--                                        :disabled="item.disabled">-->
<!--                                </el-option>-->
<!--                            </el-select>-->
<!--                        </template>-->
<!--                    </el-table-column>-->
                    <el-table-column
                            label="会员卡">
                        <template slot-scope="scope">
                            <el-select :disabled="scope.row.payMethod!='会员卡'" v-model="scope.row.payMethodDetail"
                                       placeholder="请选择支付卡">
                                <el-option
                                        v-for="item in moneyCards"
                                        :key="item.id"
                                        :label="item.showLable"
                                        :value="item.id">
                                </el-option>
                            </el-select>
                        </template>
                    </el-table-column>
<!--                    <el-table-column-->
<!--                            label="储值卡">-->
<!--                        <template slot-scope="scope">-->
<!--                            <el-select :disabled="scope.row.payMethod!='储值卡'" v-model="scope.row.payMethodDetail"-->
<!--                                       placeholder="请选择支付卡">-->
<!--                                <el-option-->
<!--                                        v-for="item in moneyCards"-->
<!--                                        :key="item.id"-->
<!--                                        :label="item.showLable"-->
<!--                                        :value="item.id">-->
<!--                                </el-option>-->
<!--                            </el-select>-->
<!--                        </template>-->
<!--                    </el-table-column>-->
                    <el-table-column
                            prop="address"
                            label="操作">
@@ -313,8 +354,9 @@
                            <li>订单总金额:{{order.total}}</li>
                            <li v-if="order.arrears>0">订单欠款:<span class="arrears">{{order.arrears}}</span></li>
                            <li v-if="order.arrears<0">找零:<span class="arrears">{{order.arrears}}</span></li>
                            <li>整单折扣:<span class="arrears" v-if="order.zkTotal != null">{{order.total - order.zkTotal}}</span></li>
<!--                            <li v-if="order.arrears>0">订单欠款:<span class="arrears">{{order.arrears}}</span></li>-->
<!--                            <li v-if="order.arrears<0">找零:<span class="arrears">{{order.arrears}}</span></li>-->
                        </ul>
                    </div>
                    <div class="money">
@@ -327,7 +369,8 @@
                    <el-button type="primary" @click="submitOrder(2)">挂单</el-button>
                    <el-button type="primary" @click="print()">打印</el-button>
                    <el-button type="primary" @click="drawer = true">业绩设置</el-button>
                    <el-button type="success" @click="confirmSubmit()" class="bigbtn"> 结算</el-button>
                    <!--                    <el-button type="success" @click="confirmSubmit()" class="bigbtn"> 结算</el-button>-->
                    <el-button type="success" @click="openPayMoney" class="bigbtn">收款 ¥{{order.payMoney}}</el-button>
                </el-col>
            </el-row>
@@ -371,14 +414,34 @@
                                prop="orderItem.payMoney"
                                label="收款">
                        </el-table-column>
                        <el-table-column
                                label="业绩">
                                label="业绩类型" width="150">
                            <template slot-scope="scope">
                                <el-select v-model="scope.row.t3" placeholder="请选择业绩类型">
                                    <el-option
                                            v-for="item in achieveTypeList"
                                            :key="item.key"
                                            :label="item.value"
                                            :value="item.key">
                                    </el-option>
                                </el-select>
                            </template>
                        </el-table-column>
                        <el-table-column
                                label="业绩" width="100">
                            <template slot-scope="scope">
                                <el-input v-model="scope.row.achieveMoney"></el-input>
                            </template>
                        </el-table-column>
                        <el-table-column
                                label="员工">
                                label="提成">
                            <template slot-scope="scope">
                                <el-input v-model="scope.row.commission"></el-input>
                            </template>
                        </el-table-column>
                        <el-table-column
                                label="员工" width="130">
                            <template slot-scope="scope">
                                <el-select v-model="scope.row.saleId" placeholder="请选择员工">
                                    <el-option
@@ -391,7 +454,7 @@
                            </template>
                        </el-table-column>
                        <el-table-column
                                width="200"
                                width="150"
                                label="操作">
                            <template slot-scope="scope">
                                <el-button type="primary" v-if="scope.row.isShare"
@@ -411,6 +474,61 @@
        </el-row>
    </el-drawer>
    <el-dialog title="收款" :visible.sync="dialogSettleVisible">
        <el-row type="flex" align="middle" style="padding: 0 0 10px 0;">
            <el-col :span="5" style="text-align: center;">应收</el-col>
            <el-col :span="10" style="text-align: center; line-height: 50px;"><span style="color: red; font-size: 20px;">¥ {{order.payMoney}}</span></el-col>
        </el-row>
        <el-row type="flex" align="middle" style="padding: 10px 0;">
            <el-col :span="5" style="text-align: center;">收款方式</el-col>
            <el-col class="paymethod" :span="18">
                <el-row>
                    <ul>
                        <span v-for="(item, index) in payMethods">
                            <el-popover
                                    :disabled="item.type != '储值卡'"
                                    placement="bottom"
                                    trigger="hover"
                                    @hide="popoverHide(item)">
                                <el-row style="text-align: center;"><span style="padding: 0 0 10px 0; display: block; font-size: 12px;">选择储值卡支付方式</span></el-row>
                                <el-tree :data="moneyCards"
                                        show-checkbox
                                        default-expand-all
                                        node-key="id"
                                        ref="tree"
                                         check-strictly
                                         highlight-current
                                         @check="(click, checked,$item)=>{handleCheckChange(click, checked,$item)}"
                                         :props="defaultProps">
                                </el-tree>
                                <li :class="{active : item.isActive}" slot="reference" @click="payMethodSelect(item, index)"><div style=" height:30px; line-height: 30px; display: flex; align-items: center"><img style="width: 25px; height: 25px; align-items: center;" :src="item.img"><span style="margin-left: 5px;">{{item.value}}</span></div></li>
                            </el-popover>
                        </span>
                    </ul>
                </el-row>
            </el-col>
        </el-row>
        <el-row type="flex" align="middle" style="padding: 10px 0 50px 0;">
            <el-col :span="5" style="text-align: center;">支付金额</el-col>
            <el-col :span="15">
                <el-row style="line-height: 50px;" v-for="(item, index) in payMoneys">
                    <el-col :span="6" style="text-align: right; padding-right: 10px; font-size: 12px;">{{item.value}}</el-col>
                    <el-col :span="8"><el-input v-model="item.money"></el-input></el-col>
                    <el-col :span="6" style="margin-left: 10px;" v-if="item.type == '储值卡'">{{item.isGift == 1 ? '赠送余额' : '余额' }}:<span class="arrears">¥ {{item.balance}}</span></el-col>
                </el-row>
            </el-col>
        </el-row>
        <el-row style="text-align: center; margin: 20px 0 10px 0">
            <el-checkbox v-model="printPaper">打印小票</el-checkbox>
        </el-row>
        <el-row style="text-align: center; margin: 10px 0 0 0">
            <el-button type="primary" @click="confirmSubmit">确认收款</el-button>
        </el-row>
    </el-dialog>
</div>
</body>
@@ -456,26 +574,51 @@
            currentVipInfo: {},
            vipLoading: false,
            payMethods: [{
                value: '现金',
                label: '现金'
                value: '现金支付',
                img: '/images/pay/cash.png',
                isActive: false,
                type: '现金支付'
            }, {
                value: '微信',
                label: '微信'
                img: '/images/pay/wechat.png',
                isActive: false,
                type: '微信'
            }, {
                value: '支付宝',
                label: '支付宝'
                img: '/images/pay/zhifubao.png',
                isActive: false,
                type: '支付宝'
            }, {
                value: '银行卡',
                label: '银行卡'
                img: '/images/pay/yinlian.png',
                isActive: false,
                type: '银行卡'
            }, {
                value: '美团',
                label: '美团'
                value: '团购',
                img: '/images/pay/tuan.png',
                isActive: false,
                type: '团购'
            }, {
                value: '会员卡',
                label: '会员卡',
                disabled: true,
                value: '储值卡',
                img: '/images/pay/card.png',
                isActive: false,
                type: '储值卡'
            },{
                value: '欠款',
                img: '/images/pay/qian.png',
                isActive: false,
                type: '欠款'
            },],
            achieveList: [],
            achieveTypeList : [
                {
                    "key" : "现金业绩",
                    "value" : "现金业绩"
                },{
                    "key" : "划扣业绩",
                    "value" : "划扣业绩"
                },
            ],
            //会员可用的充值卡
            moneyCards: [],
            //门店信息
@@ -495,6 +638,14 @@
            loading: false,
            /******搜索表格数据END********/
            dialogSettleVisible : false,
            defaultProps: {
                children: 'children',
                label: 'showLable'
            },
            treeSelect : [],
            payMoneys : [],
            printPaper : true,
        },
@@ -530,13 +681,15 @@
                                        item.payMoney = item.zkPrice;
                                    }
                                    orderPayMoney += item.payMoney;
                                    item.uuid = MTools.uuid();
                                    //业绩设置
                                    _this.achieveList.push({
                                        orderItem: item,
                                        staff: _this.loginUser,
                                        saleId: _this.loginUser.suId,
                                        achieveMoney: item.payMoney,
                                        commission : 0,
                                        t3 : '现金业绩',
                                        isShare: false,
                                    });
                                });
@@ -572,7 +725,6 @@
                }
            });
        },
        methods: {
@@ -584,7 +736,7 @@
            changePayMethod(item) {
                console.log("changePayMethod", item);
                if (item.payMethod != '会员卡') {
                if (item.payMethod != '储值卡') {
                    item.payMethodDetail = '';
                }
            },
@@ -598,17 +750,25 @@
                        contentType: 'application/x-www-form-urlencoded',
                        url: basePath + '/admin/moneyCardUse/getUseMoneyCard',
                        callback: function (data) {
                            console.log(_this.moneyCards)
                            if (data.rows.length > 0) {
                                data.rows.forEach(function (item, index, input) {
                                    item.showLable = item.cardName + "-余额:" + (item.realMoney + item.giftMoney)
                                    item.showLable = item.cardName + "-余额:" + (item.realMoney)
                                    item.uuid = MTools.uuid();
                                    if (item.giftMoney != 0) {
                                        var children = [];
                                        var gift = {};
                                        gift.id = item.id;
                                        gift.giftMoney = item.giftMoney;
                                        gift.showLable = item.cardName + '-赠送金额' + item.giftMoney;
                                        gift.cardName = item.cardName;
                                        gift.isGift = 1;
                                        gift.uuid = MTools.uuid();
                                        children.push(gift);
                                        item.children = children;
                                    }
                                });
                                console.log(data.rows)
                                _this.moneyCards = data.rows;
                                //启用会员卡支付方式
                                _this.payMethods[5].disabled = false;
                            } else {
                                //禁用会员卡支付方式
                                _this.payMethods[5].disabled = true;
                            }
                        }
@@ -668,6 +828,8 @@
                        staff: this.loginUser,
                        saleId: this.loginUser.suId,
                        achieveMoney: item.payMoney,
                        t3 : '现金业绩',
                        commission : 0,
                        isShare: false,
                    });
                    this.order.items.push(item);
@@ -713,10 +875,10 @@
                                _this.order.payMoney += parseFloat(item.payMoney);
                            });
                            //计算欠款
                            _this.order.arrears = _this.order.zkTotal - _this.order.payMoney;
                            if (_this.order.arrears < 0) {
                                _this.$message.error("支付金额不能大于应收金额");
                            }
                            // _this.order.arrears = _this.order.zkTotal - _this.order.payMoney;
                            // if (_this.order.arrears < 0) {
                            //     _this.$message.error("支付金额不能大于应收金额");
                            // }
                        }
                    })
                }
@@ -747,47 +909,72 @@
             */
            submitOrder(submitType) {
                if (this.checkSubmitOrder()) {
                    let _this = this;
                    //检查支付方式
                    let hasPayMethod=true;
                    _this.order.items.forEach(item=>{
                        if(!item.payMethod){
                            hasPayMethod=false;
                            return;
                    if(submitType == 1) {
                        if (_this.payMoneys.length > 0) {
                            let flows = []
                            var total = 0;
                            _this.payMoneys.forEach(item => {
                                let flow = {};
                                flow.payMethod = item.type;
                                if (!item.money) {
                                    this.$message.warning("请输入" + item.type + "的付款金额");
                                    return false;
                                }
                                flow.amount = parseFloat(item.money);
                                if (item.type == '储值卡'){
                                    flow.isGift = item.isGift;
                                    flow.cardId = item.id;
                                }
                                total += parseFloat(item.money);
                                flows.push(flow)
                            })
                            if (total != _this.order.payMoney) {
                                this.$message.warning("输入付款总金额与应付金额不符");
                                return false;
                            }
                            _this.order.flows = flows;
                        } else {
                            this.$message.warning("请选择支付方式");
                            return false;
                        }
                    });
                    if(!hasPayMethod){
                        this.$message.warning("请选择支付方式");
                        return false;
                    }
                    //匹配业绩
                    _this.achieveList.forEach(achieve => {
                        for (let i = 0; i < _this.order.items.length; i++) {
                            let item = _this.order.items[i];
                            item.achieveList = [];
                            if (!item.achaeveList){
                                item.achaeveList = [];
                            }
                            if (item.uuid == achieve.orderItem.uuid) {
                                let achieveNew = {
                                    uuid:item.uuid,
                                    beaultId: achieve.saleId,
                                    t1: achieve.achieveMoney
                                    t1: achieve.achieveMoney,
                                    t3: achieve.t3,
                                    projPercentage: achieve.commission,
                                };
                                item.achieveList.push(achieveNew);
                                var flag = true;
                                for(var j = 0; j < item.achaeveList.length; j++) {
                                    if(item.achaeveList[j].uuid == achieveNew.uuid && item.achaeveList[j].beaultId == achieveNew.beaultId) {
                                        flag = false;
                                        break;
                                    }
                                }
                                if (flag) {
                                    item.achaeveList.push(achieveNew);
                                }
                                break;
                            }
                        }
                    })
                    console.log(_this.order);
                    //校验业绩金额
                    if (_this.checkAchieve()) {
                        let url = basePath + "/admin/order/payOrder";
@@ -805,20 +992,30 @@
                                _this.order.orderNo = order.orderNo;
                                //结算打印提示
                                if (submitType == 1) {
                                    _this.$confirm('结算成功,是否立刻打印小票?', '提示', {
                                        confirmButtonText: '打印',
                                        cancelButtonText: '取消',
                                        type: 'warning'
                                    }).then(() => {
                                    if (_this.printPaper) {
                                        _this.print();
                                    }).catch(() => {
                                        _this.closeFram();
                                    });
                                    }
                                    // _this.closeFram();
                                    // _this.$confirm('结算成功,是否立刻打印小票?', '提示', {
                                    //     confirmButtonText: '打印',
                                    //     cancelButtonText: '取消',
                                    //     type: 'warning'
                                    // }).then(() => {
                                    //     _this.print();
                                    //
                                    // }).catch(() => {
                                    //     _this.closeFram();
                                    // });
                                } else {
                                    _this.$message.success(data.info);
                                }
                                parent.myGrid.serchData();
                                if(parent.myGrid) {
                                    parent.myGrid.serchData();
                                }
                                if (parent.app) {
                                    parent.app.orderQuery();
                                }
                            }
                        });
                    }
@@ -831,7 +1028,7 @@
             */
            checkAchieve() {
               /*
               //TODO 前端展示不检测,因为考虑到会员卡支付问题
               //TODO 前端展示不检测,因为考虑到储值卡支付问题
               let _this = this;
                for (let i = 0; i < _this.order.items.length; i++) {
                    if (_this.achieveList.length > 0) {
@@ -870,10 +1067,10 @@
                            this.$message.warning("折扣单价填写不正确");
                            return false;
                        }
                        if (!(MTools.isRealNum(item.payMoney) && item.payMoney >= 0)) {
                            this.$message.warning("实付金额填写不正确");
                            return false;
                        }
                        // if (!(MTools.isRealNum(item.payMoney) && item.payMoney >= 0)) {
                        //     this.$message.warning("实付金额填写不正确");
                        //     return false;
                        // }
                    })
                } else {
                    this.$message.warning("请选择要购买的产品");
@@ -888,9 +1085,9 @@
             */
            chouseGoods() {
                let _this = this;
                this.multipleSelection.forEach(item => {
                    _this.pushToSelectGoods(item, BUY_TYPE_NOT_FREE);
                });
                // this.multipleSelection.forEach(item => {
                //     _this.pushToSelectGoods(item, BUY_TYPE_NOT_FREE);
                // });
                this.closeXm();
                this.calculationTotal();
            },
@@ -913,6 +1110,9 @@
                    }
                });
                this.achieveList = achieveListNew;
                this.order.zkTotal = 0;
                this.order.total = 0;
                this.order.payMoney = 0;
                this.calculationTotal();
            },
@@ -1014,6 +1214,94 @@
            },
            payMethodSelect(item, index) {
                let _this = this;
                let payMoneys = _this.payMoneys;
                if (item.type != '储值卡') {
                    this.$nextTick(function () {
                        if (item.isActive) {
                            Vue.set(item,'isActive',false);
                            var index = -1;
                            for (var i = 0; i < payMoneys.length; i++) {
                                let payMoney = payMoneys[i];
                                if (payMoney.value == item.value) {
                                    index = i;
                                    break;
                                }
                            }
                            if (index > -1) {
                                _this.payMoneys.splice(index, 1)
                            }
                        } else {
                            Vue.set(item,'isActive',true);
                            var hasAmount = 0;
                            for(var i = 0; i < payMoneys.length; i++) {
                                hasAmount += parseFloat(payMoneys[i].money);
                            }
                            if (_this.order.payMoney - hasAmount > 0) {
                                Vue.set(item, 'money', _this.order.payMoney - hasAmount);
                            }
                            _this.payMoneys.push(item);
                        }
                    });
                }
            },
            popoverHide(item) {
                if(this.treeSelect.length <= 0) {
                    Vue.set(item, 'isActive', false)
                } else {
                    Vue.set(item, 'isActive', true)
                }
            },
            handleCheckChange(clickNode, checked) {
                let _this = this;
                let nodes = checked.checkedNodes;
                _this.treeSelect = nodes;
                var index = -1;
                // 判断点击节点是否在已展示支付方式中
                for(var i = 0; i < _this.payMoneys.length; i++) {
                    let node = _this.payMoneys[i];
                    if (node.uuid === clickNode.uuid) {
                        index = i;
                        break;
                    }
                }
                // 若点击节点在选中节点中,且已展示支付方式不存在,则添加
                if (nodes.indexOf(clickNode) > -1 && index === -1) {
                    var node = clickNode;
                    var item = {};
                    if (node.isGift) {
                        item.value = node.cardName;
                        item.balance = node.giftMoney;
                        item.isGift = 'Y';
                    } else {
                        item.value = node.cardName;
                        item.balance = node.realMoney;
                        item.isGift = 'N';
                    }
                    item.type = '储值卡';
                    item.id = node.id;
                    item.uuid = clickNode.uuid;
                    _this.payMoneys.push(item);
                }
                // 若点击节点不存在选中节点中,且已展示支付方式中存在,则移除
                if (nodes.indexOf(clickNode) === -1 && index > -1) {
                    _this.payMoneys.splice(index, 1);
                }
            },
            openPayMoney() {
                let _this = this;
                if (!_this.order.items.length > 0) {
                    this.$message.warning("请选择要购买的产品");
                    return false;
                }
                _this.dialogSettleVisible = true;
            }
        }
    })