|
|
@@ -0,0 +1,812 @@
|
|
|
+<template>
|
|
|
+ <div v-loading="loading">
|
|
|
+ <div class="white-box" style="padding: 0 25px; margin-top: 25px;">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :xs="24" :sm="24" :lg="14">
|
|
|
+ <el-form ref="form" label-width="180px" :label-position="labelPosition" class="form-page">
|
|
|
+
|
|
|
+ <el-form-item :label="$t('user.welcomePackWay')">
|
|
|
+ <el-radio-group v-model="form.decType" @change="decTypeChange">
|
|
|
+ <el-radio size="small" label="normal">{{ $t('user.normal') }}</el-radio>
|
|
|
+ <el-radio size="small" label="ba">{{ $t('user.BAUpgrade') }}</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-divider content-position="left">{{ $t('user.accountInformation') }}</el-divider>
|
|
|
+ <el-form-item :label="$t('user.newMemberCode')">
|
|
|
+ <el-input v-model.trim="form.insertUserName" @blur="checkBaUser" :readonly="userReadOnly"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('user.entryLevel')">
|
|
|
+ <el-select v-model="form.decLv" :placeholder="$t('user.selectEntryLevel')" style="width: 100%;">
|
|
|
+ <el-option v-for="item in allDecLevel" :key="item.ID" :label="item.LEVEL_NAME" :value="item.ID"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('user.stockistCode')">
|
|
|
+ <el-input v-model.trim="form.decUserName" readonly></el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item>
|
|
|
+ <template slot="label">
|
|
|
+ {{ $t('user.selectWelcomePack') }}
|
|
|
+ </template>
|
|
|
+ <el-tabs type="border-card" v-model="decWay" style="position: relative; width: 100%;">
|
|
|
+ <el-tab-pane :label="$t('shop.product')" name="2">
|
|
|
+ <el-collapse accordion>
|
|
|
+ <el-collapse-item>
|
|
|
+ <template slot="title">
|
|
|
+ {{ $t('shop.product') }} <i class="header-icon el-icon-info"></i>
|
|
|
+ </template>
|
|
|
+ <el-table :data="tableData" :show-header="false" @selection-change="handleSelectionChange">
|
|
|
+ <el-table-column type="selection" width="30" align="center" style="top: -30px;"></el-table-column>
|
|
|
+ <el-table-column align="center">
|
|
|
+ <template slot-scope="{row, $index}">
|
|
|
+ <el-container>
|
|
|
+ <el-aside width="80px" style=" padding: 0; margin-bottom: 0; background-color: #ffffff;">
|
|
|
+ <el-image style="width: 80px; height: 80px" :src="tool.getArImage(row.COVER, '/files/')"></el-image>
|
|
|
+ </el-aside>
|
|
|
+ <el-main style="padding: 0;">
|
|
|
+ <div style="text-align: left; line-height: 25px;">
|
|
|
+ <span style="font-weight: bold; cursor: pointer;" @click="handleProduct(row)">{{ row.GOODS_NAME }}</span><br />
|
|
|
+ <span>{{ row.GOODS_NO }}</span><br />
|
|
|
+ <span style="color: tomato;">{{ $t('shop.productPrice') }}：{{ $t('currency.sign') }} {{ row.SELL_PRICE | amountFilter }}</span><br />
|
|
|
+ <span>{{ $t('shop.productBV') }}：{{ row.PRICE_PV | amountFilter }}</span><br />
|
|
|
+ <span style="display: inline-block; float: right; ">
|
|
|
+ <el-input-number size="mini" v-model="storeNums[$index]" :min="1" :max="Number(row.STORE_NUMS)" @change="handleInputNumber($event, row)"></el-input-number>
|
|
|
+ </span>
|
|
|
+ <br />
|
|
|
+ </div>
|
|
|
+ </el-main>
|
|
|
+ </el-container>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-collapse-item>
|
|
|
+ </el-collapse>
|
|
|
+
|
|
|
+ <div class="white-box-footer">
|
|
|
+ <div class="flex data" style="float: right; display: inline-block; line-height: 30px; font-size: 14px; margin-top: 15px; margin-bottom: 10px; border: 1px solid #dcdfe6; border-radius: 4px; padding: 0 5px;">
|
|
|
+ <div style="margin-right: 1rem; display: inline-block;">{{ $t('shop.productPrice') }}：{{ $t('currency.sign') }} {{ sellPriceSum | amountFilter }}</div>
|
|
|
+ <div style="margin-right: 1rem; display: inline-block;">{{ $t('shop.productBV') }}：{{ pricePvSum | amountFilter }}</div>
|
|
|
+ <div style="display: inline-block;">{{ $t('shop.taxAmount') }}：{{ $t('currency.sign') }} {{ taxSum }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-divider content-position="left">{{ $t('atlas.networkInformation') }}</el-divider>
|
|
|
+ <el-form-item :label="$t('shop.sponsorCode')">
|
|
|
+ <el-input v-model.trim="form.recUserName" @change="handleChkRecUser" :readonly="recReadOnly">
|
|
|
+ <template slot="append">【{{ recRealName }}】</template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('atlas.placementCode')">
|
|
|
+ <el-input v-model.trim="form.conUserName" @change="handleChkConUser"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-input placeholder="请输入内容" v-model="conRealName" :disabled="true"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('atlas.placementTree')">
|
|
|
+ <el-radio-group border v-model="form.location">
|
|
|
+ <el-radio :label="1">{{ $t('atlas.left') }}</el-radio>
|
|
|
+ <el-radio :label="2">{{ $t('atlas.right') }}</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item><!--自动安置区位-->
|
|
|
+ <el-row :gutter="5">
|
|
|
+ <el-col :xs="24" :sm="24" :lg="12">
|
|
|
+ <el-button size="small" type="primary" @click="setAutoPlace('left')">{{ $t('atlas.placementAutoLeft') }}</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="24" :lg="12">
|
|
|
+ <el-button size="small" type="primary" @click="setAutoPlace('right')">{{ $t('atlas.placementAutoRight') }}</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-divider content-position="left">{{ $t('profile.personalInformation') }}</el-divider>
|
|
|
+ <el-form-item :label="$t('shop.memberName')">
|
|
|
+ <el-input v-model.trim="form.realName"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.phoneNumber')">
|
|
|
+ <el-input v-model.trim="form.mobile"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('user.email')">
|
|
|
+ <el-input v-model.trim="form.email"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('profile.loginPassword')">
|
|
|
+ <el-input v-model.trim="form.password" maxlength="32" :placeholder="$t('profile.enterLoginPassword')"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('profile.paymentPassword')">
|
|
|
+ <el-input v-model.trim="form.payPassword" maxlength="32" :placeholder="$t('profile.enterPaymentPassword')"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.recipientName')">
|
|
|
+ <el-input v-model.trim="form.consignee"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.phoneNumber')">
|
|
|
+ <el-input v-model.trim="form.acceptMobile"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.shipping')">
|
|
|
+ <el-radio-group v-model="form.way" @change="wayChange">
|
|
|
+ <el-radio label="express">{{ $t('shop.delivery') }}</el-radio>
|
|
|
+ <el-radio label="pickup">{{ $t('shop.selfPickUp') }}</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="areaSelected" :label="$t('config.state')">
|
|
|
+ <el-select v-model="form.areaSelected" class="filter-item" style="width: 100%;">
|
|
|
+ <el-option v-for="item in regionData" :key="item.id" :label="item.address" :value="item.id" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('config.detailedAddress')">
|
|
|
+ <el-input :disabled="addressDisabled" v-model.trim="form.address"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('config.city')">
|
|
|
+ <el-input :disabled="addressDisabled" v-model.trim="form.cityName"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('config.localGovernmentArea')">
|
|
|
+ <el-input :disabled="addressDisabled" v-model.trim="form.lgaName"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-divider content-position="left">{{ $t('finance.bankInformation') }}</el-divider>
|
|
|
+ <el-form-item :label="$t('finance.bankName')">
|
|
|
+ <el-select v-model="form.openBank" :placeholder="$t('finance.selectBank')" style="width: 100%;">
|
|
|
+ <el-option v-for="(item,index) in allOpenBank" :key="index" :label="item.BANK_NAME" :value="item.BANK_CODE"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.accountName')">
|
|
|
+ <el-input v-model.trim="form.bankAddress"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.bankAccount')">
|
|
|
+ <el-input v-model.number="form.bankNo" maxlength="19"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-divider content-position="left">{{ $t('user.payInfo') }}</el-divider>
|
|
|
+ <el-form-item :label="$t('shop.paymentMethod')" required>
|
|
|
+ <el-radio-group v-model="form.payType" @change="chosePayType" style="margin: 5px 5px;">
|
|
|
+ <el-radio border v-for="(item, index) in payList" :key='index' :label="item.label">
|
|
|
+ {{ item.name }}<span v-if="item.label === 'cash'" style="color: tomato;">（{{ $t('currency.sign') }} {{ userBalance.cash }}）</span>
|
|
|
+ </el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item>
|
|
|
+ <el-button size="small" type="primary" @click="onSubmit" :loading="submitButtonStat">{{ $t('common.save') }}</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- payStack模态框 -->
|
|
|
+ <el-dialog :title="$t('shop.goPay')" :visible.sync="visible" :width="payStackScreenWidth" v-loading="payStackLoading" :before-close="handleClose">
|
|
|
+ <section>
|
|
|
+ <el-form :model="payForm">
|
|
|
+ <el-form-item :label="$t('user.email')" label-width="100px" required>
|
|
|
+ <el-input v-model="payForm.email" autocomplete="off"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.amount')" label-width="100px" required>
|
|
|
+ <el-input v-model="payForm.amount" autocomplete="off" readonly></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </section>
|
|
|
+ <paystack
|
|
|
+ :firstname="payForm.firstname"
|
|
|
+ :lastname="payForm.lastname"
|
|
|
+ :amount="payForm.amount * 100"
|
|
|
+ :email="payForm.email"
|
|
|
+ :metadata="payForm.metadata"
|
|
|
+ :currency="payForm.currency"
|
|
|
+ :paystackkey="payForm.publicKey"
|
|
|
+ :reference="reference"
|
|
|
+ :channels="channels"
|
|
|
+ :callback="processPayment"
|
|
|
+ :close="handleClose"
|
|
|
+ >
|
|
|
+ <el-button type="primary" size="small">{{ $t('shop.goPay') }}</el-button>
|
|
|
+ </paystack>
|
|
|
+ <el-button type="danger" size="small" class="cancelButton" @click="handleClose" style="margin-left: 10px;">{{ $t('common.cancel') }}</el-button>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 倒计时页面 -->
|
|
|
+ <el-dialog :title="$t('common.hint')" :visible.sync="payDialog" :width="payStackScreenWidth" :show-close="false" :close="handleOrderList">
|
|
|
+ <el-card shadow="always">
|
|
|
+ <el-result icon="success" :title="$t('common.successfully')" :subTitle="$t('shop.successOrderTips')">
|
|
|
+ <template slot="extra">
|
|
|
+ <el-button type="primary" size="medium" @click="handleOrderList">{{ $t('shop.goBack') }}({{ countdown }})</el-button>
|
|
|
+ </template>
|
|
|
+ </el-result>
|
|
|
+ </el-card>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 商品详情 -->
|
|
|
+ <el-dialog :title="product.GOODS_NO" :visible.sync="visibleProduct" :width="screenWidth" style="margin-top: -95px;">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :xs="24" :sm="12" :lg="12">
|
|
|
+ <el-image style="width: 100%; height: 100%" :style="imageStyle" :src="tool.getArImage(product.COVER, '/files/')"></el-image>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :lg="12">
|
|
|
+ <div style="text-align: left; line-height: 50px; font-size: 16px;">
|
|
|
+ <span style="font-weight: bold; font-size: 20px;">{{ product.GOODS_NAME }}</span><br />
|
|
|
+ <span style="font-weight: bold; font-size: 15px;">{{ $t('shop.productCode') }}：{{ product.GOODS_NO }}</span><br />
|
|
|
+ <span style="color: tomato;">{{ $t('shop.productPrice') }}：{{ $t('currency.sign') }} {{ product.SELL_PRICE }}</span><br />
|
|
|
+ <span>{{ $t('shop.productBV') }}：{{ product.PRICE_PV }}</span><br />
|
|
|
+ <span>{{ $t('shop.taxRate') }}：{{ product.TAX_RATE / 100 }}</span><br />
|
|
|
+ <span>{{ $t('shop.taxAmount') }}：{{ $t('currency.sign') }} {{ product.taxAmount }}</span><br />
|
|
|
+ <span>{{ $t('shop.inventory') }}：{{ product.STORE_NUMS }}</span>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {
|
|
|
+ fetchBrandAmbassador,
|
|
|
+ createBrandAmbassador,
|
|
|
+ fetchFullInfo,
|
|
|
+ fetchBrandAmbassadorInfo,
|
|
|
+ fetchAutoPlace, fetchWelcomePack, createWelcomePack
|
|
|
+} from '@/api/user'
|
|
|
+import waves from '@/directive/waves'
|
|
|
+import {formatAmount, getScreenWidth} from "@/utils"
|
|
|
+import Pagination from '@/components/Pagination'
|
|
|
+import paystack from 'vue-paystack'
|
|
|
+import tool from "@/utils/tool"
|
|
|
+import usersInfo from "@/utils/usersInfo"
|
|
|
+import {deleteApproachOrder} from "@/api/shop"
|
|
|
+import {mapGetters} from "vuex"
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'welcomePack',
|
|
|
+ components: { Pagination, paystack },
|
|
|
+ directives: { waves },
|
|
|
+ filters: {
|
|
|
+ bvFilter(row) {
|
|
|
+ return tool.calculateBV(row.REAL_PV, row.BUY_NUMS)
|
|
|
+ },
|
|
|
+ taxAmountFilter(row) {
|
|
|
+ return tool.calculateTax(row.REAL_PRICE, row.BUY_NUMS)
|
|
|
+ },
|
|
|
+ priceAmountFilter(row) {
|
|
|
+ return tool.formatPrice(row.REAL_PRICE, row.BUY_NUMS)
|
|
|
+ },
|
|
|
+ amountFilter(amount) {
|
|
|
+ return formatAmount(amount)
|
|
|
+ },
|
|
|
+ statusFilter(status) {
|
|
|
+ const statusMap = {
|
|
|
+ Unpaid: 'info',
|
|
|
+ Paid: 'success'
|
|
|
+ }
|
|
|
+ return statusMap[status]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters([
|
|
|
+ 'regionInfo',
|
|
|
+ ]),
|
|
|
+ // PayStack混淆串
|
|
|
+ reference() {
|
|
|
+ let text = ''
|
|
|
+ let possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"
|
|
|
+ for (let i = 0; i < 10; i++) {
|
|
|
+ text += possible.charAt(Math.floor(Math.random() * possible.length))
|
|
|
+ }
|
|
|
+ return text
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ loading: false,
|
|
|
+ tool: tool,
|
|
|
+
|
|
|
+ allGoods: [],
|
|
|
+ numList: [],
|
|
|
+ categoryType: '',
|
|
|
+ sellType: [],
|
|
|
+ payList: [],
|
|
|
+ screenWidth: getScreenWidth() > 600 ? '500px' : getScreenWidth() + 'px',
|
|
|
+ labelPosition: getScreenWidth() > 600 ? 'right' : 'top',
|
|
|
+ payStackScreenWidth: getScreenWidth() > 500 ? '450px' : getScreenWidth() + 'px',
|
|
|
+
|
|
|
+ dialog: false,
|
|
|
+ dialogLoading: false,
|
|
|
+
|
|
|
+ multipleSelection: [],
|
|
|
+ sellPriceSum: 0.00,
|
|
|
+ pricePvSum: 0.00,
|
|
|
+ taxSum: 0.00,
|
|
|
+ storeNums: [],
|
|
|
+ tableData: null,
|
|
|
+ payAmount: 0.00,
|
|
|
+
|
|
|
+ cashCurrency: '',
|
|
|
+ currency: {},
|
|
|
+ pointsSum: 0,
|
|
|
+ cashSum: 0,
|
|
|
+ pointFreight: 0,
|
|
|
+ freeShipping: '',
|
|
|
+ goodsId: '',
|
|
|
+ goodsNum: '',
|
|
|
+ payPassword: '',
|
|
|
+ submitButtonStat: false,
|
|
|
+ sn: '',
|
|
|
+ orderType: '',
|
|
|
+ payDialog: false,
|
|
|
+ countdown: 5,
|
|
|
+ visible: false,
|
|
|
+ totalAmount: 0.00,
|
|
|
+ freight: 0.00,
|
|
|
+ userBalance: {
|
|
|
+ cash: 0,
|
|
|
+ },
|
|
|
+
|
|
|
+ payType: 'cash',
|
|
|
+ payStackLoading: false,
|
|
|
+ channels: ["card", "bank", "ussd", "qr"],
|
|
|
+ payForm: {
|
|
|
+ publicKey: process.env.VUE_APP_BASE_PAY_STACK_PUBLIC_KEY,
|
|
|
+ currency: 'NGN',
|
|
|
+ firstname: usersInfo.userName(),
|
|
|
+ lastname: '',
|
|
|
+ email: usersInfo.userEmail(),
|
|
|
+ amount: 0,
|
|
|
+ orderSn: '',
|
|
|
+ metadata: {
|
|
|
+ cart_id: '',
|
|
|
+ custom_fields: [
|
|
|
+ {
|
|
|
+ display_name: 'orderSn',
|
|
|
+ variable_name: 'orderSn',
|
|
|
+ value: this.sn,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ display_name: 'orderType',
|
|
|
+ variable_name: 'orderType',
|
|
|
+ value: 'baDec'
|
|
|
+ },
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ addressId: '',
|
|
|
+ selfPickUpAddressId: '100000000000000000',
|
|
|
+ shippingAddressList: [],
|
|
|
+
|
|
|
+ visibleProduct: false,
|
|
|
+ product: {
|
|
|
+ GOODS_NAME: '',
|
|
|
+ GOODS_NO: '',
|
|
|
+ COVER: '',
|
|
|
+ SELL_PRICE: 0,
|
|
|
+ PRICE_PV: 0,
|
|
|
+ TAX_RATE: 0,
|
|
|
+ taxAmount: 0,
|
|
|
+ },
|
|
|
+ imageStyle: 'margin-top: -50px;',
|
|
|
+
|
|
|
+ decWay: '2',
|
|
|
+ // TODO: 地区需处理
|
|
|
+ regionData: [
|
|
|
+ {
|
|
|
+ id: '10600',
|
|
|
+ address: 'test1',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: '10601',
|
|
|
+ address: 'test2',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ form: {
|
|
|
+ decType: 'normal',
|
|
|
+ realName: '',
|
|
|
+ decLv: '',
|
|
|
+ insertUserName: '',
|
|
|
+ decUserName: usersInfo.userName(),
|
|
|
+ recUserName: '',
|
|
|
+ conUserName: '',
|
|
|
+ insertUserIdCard: '',
|
|
|
+ consignee: '',
|
|
|
+ acceptMobile: '',
|
|
|
+ areaSelected: [],
|
|
|
+ address: '',
|
|
|
+ openBank: '',
|
|
|
+ bankAddress: '',
|
|
|
+ bankProvince: '',
|
|
|
+ bankCity: '',
|
|
|
+ bankCounty: '',
|
|
|
+ bankNo: '',
|
|
|
+ bankAreaSelected: [],
|
|
|
+ password: '111111',
|
|
|
+ payPassword: '111111',
|
|
|
+ mobile: '',
|
|
|
+ email: '',
|
|
|
+ packageId: '',
|
|
|
+ goodsId: [],
|
|
|
+ goodsNum: [],
|
|
|
+ province: '',
|
|
|
+ cityName: '',
|
|
|
+ lgaName: '',
|
|
|
+ way: 'express',
|
|
|
+ payType: '',
|
|
|
+ autoPlace: '',
|
|
|
+ location: ''
|
|
|
+ },
|
|
|
+
|
|
|
+ conRealName: '-',
|
|
|
+ recRealName: '-',
|
|
|
+ areaDisabled: false,
|
|
|
+ addressDisabled: false,
|
|
|
+
|
|
|
+ userReadOnly: true,
|
|
|
+ recReadOnly: false,
|
|
|
+ allDecLevel: usersInfo.getBaseInfo().decLevels,
|
|
|
+ allOpenBank: [],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ let regionInfo = this.$store.getters.regionInfo
|
|
|
+ // console.log(this.$store.state.region)
|
|
|
+ this.fetchWelcomePack()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 会员报单/BA升级
|
|
|
+ fetchWelcomePack() {
|
|
|
+ this.loading = true
|
|
|
+ fetchWelcomePack().then(response => {
|
|
|
+ this.form.insertUserName = response.data.userName
|
|
|
+ this.allOpenBank = response.data.allOpenBank
|
|
|
+ this.allDecPackage = response.data.allDecPackage
|
|
|
+ this.allGoods = response.data.allGoods
|
|
|
+ this.userBalance = response.data.userBalance
|
|
|
+ this.categoryType = 1
|
|
|
+
|
|
|
+ let settingObj = this.allGoods
|
|
|
+ for (let i in this.allGoods) {
|
|
|
+ this.storeNums[i] = 1
|
|
|
+ settingObj[i].goodsNum = 0
|
|
|
+ }
|
|
|
+
|
|
|
+ this.tableData = Object.values(settingObj)
|
|
|
+ let pageList = this.multipleSelection
|
|
|
+ this.$nextTick(function () {
|
|
|
+ for (let i in this.tableData) {
|
|
|
+ for( let j in pageList) {
|
|
|
+ if( pageList[j].ID === this.tableData[i].ID ) {
|
|
|
+ this.$data.storeNums[i] = pageList[j].goodsNum
|
|
|
+ this.tableData[i].goodsNum = pageList[j].goodsNum
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ // 支付方式
|
|
|
+ this.payList = response.data.sellType[0]['sell_type']
|
|
|
+ // 支付方式的第一项默认选中
|
|
|
+ this.form.payType = Object.values(this.payList)[1]['label']
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ this.loading = false
|
|
|
+ }, 0.5 * 1000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 商品详情
|
|
|
+ handleProduct(row) {
|
|
|
+ this.product = row
|
|
|
+ this.product.taxAmount = tool.calculateTax(row.SELL_PRICE, row.TAX_RATE)
|
|
|
+ this.visibleProduct = true
|
|
|
+ },
|
|
|
+ // 选择商品计数
|
|
|
+ handleInputNumber(current, row){
|
|
|
+ let pageList = this.multipleSelection
|
|
|
+ let selectStatus = false
|
|
|
+ for (let i in pageList) {
|
|
|
+ if (pageList[i].ID === row.ID) {
|
|
|
+ pageList[i].goodsNum = current
|
|
|
+ selectStatus = true
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (selectStatus) {
|
|
|
+ this.multipleSelection = pageList
|
|
|
+ this.handleSureChange()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 统计商品
|
|
|
+ handleSureChange() {
|
|
|
+ if (this.multipleSelection.length > 0) {
|
|
|
+ let accumulatorSellPrice = 0, accumulatorPricePv = 0, accumulatorTax = 0
|
|
|
+ this.multipleSelection.forEach(accumulator => {
|
|
|
+ accumulatorSellPrice += accumulator.SELL_PRICE * accumulator.goodsNum;
|
|
|
+ accumulatorPricePv += Number(accumulator.PRICE_PV) * Number(accumulator.goodsNum);
|
|
|
+ accumulatorTax += tool.calculateTax(Number(accumulator.SELL_PRICE), Number(accumulator.TAX_RATE), Number(accumulator.goodsNum));
|
|
|
+ })
|
|
|
+
|
|
|
+ this.sellPriceSum = tool.formatPrice(accumulatorSellPrice)
|
|
|
+ this.pricePvSum = tool.formatPrice(accumulatorPricePv)
|
|
|
+ this.taxSum = tool.formatPrice(accumulatorTax)
|
|
|
+
|
|
|
+ this.display = true
|
|
|
+ } else {
|
|
|
+ this.sellPriceSum = this.pricePvSum = this.taxSum = 0.00
|
|
|
+ this.display = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 选择商品
|
|
|
+ handleSelectionChange(val) {
|
|
|
+ let idx = -1, num
|
|
|
+ for (let i in this.tableData) {
|
|
|
+ for (let v in val){
|
|
|
+ if (val[v].ID === this.tableData[i].ID) {
|
|
|
+ idx = i
|
|
|
+ num = this.storeNums[idx]
|
|
|
+ val[v]['goodsNum'] = num
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.multipleSelection = val
|
|
|
+ // 计算统计
|
|
|
+ this.handleSureChange()
|
|
|
+ },
|
|
|
+ // 选择收货地址
|
|
|
+ choseAddress (addressId) {
|
|
|
+ this.addressId = addressId
|
|
|
+ // 设置运费
|
|
|
+ this.setFreight()
|
|
|
+ // 计算价格
|
|
|
+ this.getSumMoney()
|
|
|
+ },
|
|
|
+ // 切换支付方式
|
|
|
+ chosePayType(type) {
|
|
|
+ this.payType = type
|
|
|
+ },
|
|
|
+ // 关闭支付回调
|
|
|
+ handleClose() {
|
|
|
+ this.$confirm(this.$t('shop.confirmClose')).then(_ => {
|
|
|
+ deleteApproachOrder({ orderSn: this.form.orderSn }).then(() => {
|
|
|
+ // 关闭支付模态框
|
|
|
+ this.visible = false
|
|
|
+ // 关闭购物车
|
|
|
+ this.visibleShoppingCart = false
|
|
|
+ this.submitButtonStat = false
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 支付成功回调
|
|
|
+ processPayment() {
|
|
|
+ // 关闭支付页面
|
|
|
+ this.visible = false
|
|
|
+ this.payStackLoading = false
|
|
|
+ // 显示支付成功模态框
|
|
|
+ this.payDialog = true;
|
|
|
+ // 启动支付成功倒计时
|
|
|
+ this.handleCountdown()
|
|
|
+ },
|
|
|
+ // 倒计时结束跳转
|
|
|
+ handleOrderList () {
|
|
|
+ this.$router.push({path: `/shop/dec-order-list`})
|
|
|
+ },
|
|
|
+ // 启动倒计时
|
|
|
+ handleCountdown () {
|
|
|
+ // 创建定时器
|
|
|
+ setInterval(() => {
|
|
|
+ // 每隔1秒把time的值减一，赋值给span标签
|
|
|
+ this.countdown--
|
|
|
+ if (this.countdown === 0) {
|
|
|
+ // 倒计时结束,跳转到订单列表
|
|
|
+ this.$router.push({path: `/shop/dec-order-list`});
|
|
|
+ }
|
|
|
+ }, 1000)
|
|
|
+ },
|
|
|
+ // 会员查询
|
|
|
+ handleChkRecUser() {
|
|
|
+ this.form.conUserName = ''
|
|
|
+ this.conRealName = '-'
|
|
|
+ this.form.autoPlace = ''
|
|
|
+ if (this.form.recUserName) {
|
|
|
+ this.loading = true
|
|
|
+ fetchFullInfo({ userName: this.form.recUserName }).then(response => {
|
|
|
+ this.recRealName = response.data.REAL_NAME
|
|
|
+ this.loading = false
|
|
|
+ }).catch(() => {
|
|
|
+ this.recRealName = '-'
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 返回方式
|
|
|
+ wayChange () {
|
|
|
+ if (this.form.way === 'pickup') {
|
|
|
+ this.areaDisabled = true
|
|
|
+ this.addressDisabled = true
|
|
|
+ } else {
|
|
|
+ this.areaDisabled = false
|
|
|
+ this.addressDisabled = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 会员报单/BA升级
|
|
|
+ onSubmit() {
|
|
|
+ if (!this.form.decLv) {
|
|
|
+ this.$message({
|
|
|
+ message: this.$t('profile.selectLevel'),
|
|
|
+ type: 'error'
|
|
|
+ })
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ // 已选择商品
|
|
|
+ this.selectProduct()
|
|
|
+ if (this.multipleSelection.length <= 0) {
|
|
|
+ this.$message.error(this.$t('shop.chooseTips'))
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ // 余额
|
|
|
+ let amountBalance = this.userBalance[this.form.payType] || 0
|
|
|
+ // 余额是否充足
|
|
|
+ if ((this.form.payType === 'cash') && ((amountBalance - this.payAmount) < 0)) {
|
|
|
+ // 账户类型提示信息
|
|
|
+ let accountType = this.currency[this.form.payType].name || ''
|
|
|
+ this.$message({
|
|
|
+ message: accountType + this.$t('shop.balanceNotAllow'),
|
|
|
+ type: 'error'
|
|
|
+ })
|
|
|
+ return false
|
|
|
+ }
|
|
|
+
|
|
|
+ this.submitButtonStat = true
|
|
|
+
|
|
|
+ let params = {
|
|
|
+ consignee: this.form.consignee,
|
|
|
+ acceptMobile: this.form.acceptMobile,
|
|
|
+ province: this.form.areaSelected[0] ? this.form.areaSelected[0] : '',
|
|
|
+ city: this.form.areaSelected[1] ? this.form.areaSelected[1] : '',
|
|
|
+ county: this.form.areaSelected[2] ? this.form.areaSelected[2] : '',
|
|
|
+ address: this.form.address,
|
|
|
+ decType: this.form.decType,
|
|
|
+ insertUserName: this.form.insertUserName,
|
|
|
+ decLv: this.form.decLv,
|
|
|
+ realName: this.form.realName,
|
|
|
+ decUserName: this.form.decUserName,
|
|
|
+ conUserName: this.form.conUserName,
|
|
|
+ recUserName: this.form.recUserName,
|
|
|
+ insertUserIdCard: this.form.insertUserIdCard,
|
|
|
+ openBank: this.form.openBank,
|
|
|
+ bankAddress: this.form.bankAddress,
|
|
|
+ mobile: this.form.mobile,
|
|
|
+ email: this.form.email,
|
|
|
+ cityName: this.form.cityName,
|
|
|
+ lgaName: this.form.lgaName,
|
|
|
+
|
|
|
+ bankProvince: this.form.bankAreaSelected[0] ? this.form.bankAreaSelected[0] : '',
|
|
|
+ bankCity: this.form.bankAreaSelected[1] ? this.form.bankAreaSelected[1] : '',
|
|
|
+ bankCounty: this.form.bankAreaSelected[2] ? this.form.bankAreaSelected[2] : '',
|
|
|
+
|
|
|
+ bankNo: this.form.bankNo,
|
|
|
+ password: this.form.password,
|
|
|
+ payPassword: this.form.payPassword,
|
|
|
+ packageId: this.form.packageId,
|
|
|
+ goodsId: this.form.goodsId,
|
|
|
+ goodsNum: this.form.goodsNum,
|
|
|
+ location: this.form.location,
|
|
|
+ decWay: this.decWay,
|
|
|
+ payType: this.form.payType
|
|
|
+ }
|
|
|
+ createWelcomePack(params).then(response => {
|
|
|
+ if (this.form.payType !== 'pay_stack') {
|
|
|
+ // 余额支付
|
|
|
+ this.$message({
|
|
|
+ message: this.$t('common.successfully'),
|
|
|
+ type: 'success'
|
|
|
+ })
|
|
|
+ this.submitButtonStat = false
|
|
|
+ this.$router.push({path: `/shop/order-list`})
|
|
|
+ } else {
|
|
|
+ this.submitButtonStat = false
|
|
|
+ this.payForm.orderSn = response.data.SN
|
|
|
+ this.payForm.amount = response.data.ORDER_AMOUNT
|
|
|
+ this.payForm.metadata.custom_fields[0].value = response.data.SN
|
|
|
+ if (this.form.decType === 'ba') {
|
|
|
+ this.payForm.metadata.custom_fields[1].value = 'baUpgrade';
|
|
|
+ } else {
|
|
|
+ this.payForm.metadata.custom_fields[1].value = 'userDec';
|
|
|
+ }
|
|
|
+ this.visible = true
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 已选择商品
|
|
|
+ selectProduct() {
|
|
|
+ this.payAmount = 0
|
|
|
+ this.form.goodsId = []
|
|
|
+ this.form.goodsNum = []
|
|
|
+ this.multipleSelection.map((item) => {
|
|
|
+ this.form.goodsId.push(item.ID)
|
|
|
+ this.form.goodsNum.push(item.goodsNum)
|
|
|
+ this.payAmount += item.goodsNum * item.SELL_PRICE
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 报单方式
|
|
|
+ decTypeChange() {
|
|
|
+ if (this.form.decType === 'ba') {
|
|
|
+ this.form.insertUserName = ''
|
|
|
+ this.userReadOnly = false
|
|
|
+ } else {
|
|
|
+ this.form.recUserName = ''
|
|
|
+ this.recRealName = '-'
|
|
|
+ this.recReadOnly = false
|
|
|
+ this.userReadOnly = true
|
|
|
+ this.fetchWelcomePack()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // BA会员查询
|
|
|
+ checkBaUser() {
|
|
|
+ if (this.form.decType === 'ba' && this.form.insertUserName !== '') {
|
|
|
+ this.loading = true
|
|
|
+ fetchBrandAmbassadorInfo({ userName: this.form.insertUserName }).then(response => {
|
|
|
+ this.form.recUserName = response.data.REC_USER_NAME
|
|
|
+ this.form.realName = response.data.REAL_NAME
|
|
|
+ this.handleChkRecUser()
|
|
|
+ this.recReadOnly = true
|
|
|
+ this.loading = false
|
|
|
+ }).catch(() => {
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 查询安置人
|
|
|
+ handleChkConUser() {
|
|
|
+ if (this.form.conUserName) {
|
|
|
+ this.loading = true
|
|
|
+ fetchFullInfo( { userName: this.form.conUserName }).then(response => {
|
|
|
+ this.conRealName = response.data.REAL_NAME + response.data.isLocation
|
|
|
+ this.loading = false
|
|
|
+ }).catch(() => {
|
|
|
+ this.conRealName = '-'
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 自动设置区位
|
|
|
+ setAutoPlace(side) {
|
|
|
+ if (this.recRealName !== '-') {
|
|
|
+ this.loading = true
|
|
|
+ fetchAutoPlace( { userName: this.form.recUserName, side: side }).then(response => {
|
|
|
+ this.form.conUserName = response.data.USER_NAME
|
|
|
+ this.handleChkConUser()
|
|
|
+ this.form.location = 1
|
|
|
+ this.form.autoPlace = side
|
|
|
+ this.loading = false
|
|
|
+ }).catch(() => {
|
|
|
+ this.conRealName = '-'
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.form.autoPlace = ''
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+.el-table th.el-table__cell > .cell {
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+
|
|
|
+.el-table td.el-table__cell > .cell {
|
|
|
+ word-break: keep-all;
|
|
|
+ white-space: pre-wrap;
|
|
|
+}
|
|
|
+.el-tabs--border-card > .el-tabs__content {
|
|
|
+ padding: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.el-radio.is-bordered + .el-radio.is-bordered {
|
|
|
+ margin: 5px 0;
|
|
|
+}
|
|
|
+.el-radio--medium.is-bordered {
|
|
|
+ margin: 5px 0;
|
|
|
+}
|
|
|
+</style>
|
kevin_zhangl