|
|
@@ -0,0 +1,1361 @@
|
|
|
+<template>
|
|
|
+ <div v-loading="loading" style="width: 100%">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :xs="24" :sm="24" :lg="14">
|
|
|
+ <div class="dec-header flexJcsbAc" style="">
|
|
|
+ <div class="classification">
|
|
|
+ <div class="decTabs flexJcfsAc">
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in classifiedProductList"
|
|
|
+ :key="item.CATEGORY_TYPE"
|
|
|
+ :label="item.CATEGORY_TYPE"
|
|
|
+ :name="item.CATEGORY_TYPE"
|
|
|
+ class="tabItem"
|
|
|
+ :class="{ active: activeIndex == index }"
|
|
|
+ @click="chooseNav(item, index)"
|
|
|
+ >
|
|
|
+ <span>type{{ item.CATEGORY_TYPE }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="openAllClassification flexfc" @click="drawer = true">
|
|
|
+ <span class="">全部</span>
|
|
|
+ <i class="el-icon-more-outline"></i>
|
|
|
+ </div>
|
|
|
+ <!-- 全部分类 -->
|
|
|
+ <el-drawer
|
|
|
+ title="全部分类"
|
|
|
+ :visible.sync="drawer"
|
|
|
+ :direction="direction"
|
|
|
+ :modal-append-to-body="false"
|
|
|
+ >
|
|
|
+ <div class="allClassification flexFwW">
|
|
|
+ <div
|
|
|
+ class="title"
|
|
|
+ v-for="(item, index) in classifiedProductList"
|
|
|
+ :key="index"
|
|
|
+ :class="{ active: activeIndex == index }"
|
|
|
+ @click="drawerClassification(item, index)"
|
|
|
+ >
|
|
|
+ <span>{{ item.CATEGORY_TYPE }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-drawer>
|
|
|
+ </div>
|
|
|
+ </el-col></el-row
|
|
|
+ >
|
|
|
+ <div class="white-box" style="padding: 0 20px; margin-top: 20px">
|
|
|
+ <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="form.insertUserName"
|
|
|
+ :readonly="userReadOnly"
|
|
|
+ @blur="checkBaUser"
|
|
|
+ />
|
|
|
+ </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-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('user.stockistCode')">
|
|
|
+ <el-input v-model="form.decUserName" :disabled="isDec == '1'" />
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <!-- <el-form-item>
|
|
|
+ <template slot="label">
|
|
|
+ {{ $t("user.selectWelcomePack") }}
|
|
|
+ </template>
|
|
|
+ <el-tabs
|
|
|
+ v-model="decWay"
|
|
|
+ type="border-card"
|
|
|
+ style="position: relative; width: 100%"
|
|
|
+ >
|
|
|
+ <el-tab-pane :label="$t('shop.product')" name="2">
|
|
|
+ <el-collapse v-model="activeName" accordion>
|
|
|
+ <el-collapse-item name="product">
|
|
|
+ <el-table
|
|
|
+ v-if="classifiedProductList.length > 0"
|
|
|
+ :data="classifiedProductList[activeIndex].list"
|
|
|
+ :show-header="false"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ type="selection"
|
|
|
+ width="30"
|
|
|
+ align="center"
|
|
|
+ style="top: -30px"
|
|
|
+ />
|
|
|
+ <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-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 | toThousandFilter
|
|
|
+ }}</span
|
|
|
+ ><br />
|
|
|
+ <span
|
|
|
+ >{{ $t("shop.productBV") }}：{{
|
|
|
+ row.PRICE_PV | toThousandFilter
|
|
|
+ }}</span
|
|
|
+ ><br />
|
|
|
+ <span
|
|
|
+ style="display: inline-block; float: right"
|
|
|
+ >
|
|
|
+ <el-input-number
|
|
|
+ v-model="storeNums[$index]"
|
|
|
+ size="mini"
|
|
|
+ :min="1"
|
|
|
+ :max="Number(row.STORE_NUMS)"
|
|
|
+ @change="handleInputNumber($event, row)"
|
|
|
+ />
|
|
|
+ </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 | toThousandFilter }}
|
|
|
+ </div>
|
|
|
+ <div style="margin-right: 1rem; display: inline-block">
|
|
|
+ {{ $t("shop.productBV") }}：{{
|
|
|
+ pricePvSum | toThousandFilter
|
|
|
+ }}
|
|
|
+ </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="form.recUserName"
|
|
|
+ :readonly="recReadOnly"
|
|
|
+ @change="handleChkRecUser"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-input v-model="recRealName" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('atlas.placementCode')">
|
|
|
+ <el-input v-model="form.conUserName" @change="handleChkConUser" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-input
|
|
|
+ v-model="conRealName"
|
|
|
+ type="textarea"
|
|
|
+ :rows="2"
|
|
|
+ :disabled="true"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('atlas.placementTree')">
|
|
|
+ <el-radio-group v-model="form.location" border>
|
|
|
+ <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="12" :lg="12">
|
|
|
+ <el-button
|
|
|
+ size="small"
|
|
|
+ type="primary"
|
|
|
+ @click="setAutoPlace('left')"
|
|
|
+ >{{ $t("atlas.placementAutoLeft") }}</el-button
|
|
|
+ >
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :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="form.realName" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.phoneNumber')">
|
|
|
+ <el-input v-model="form.mobile" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('user.email')">
|
|
|
+ <el-input v-model="form.email" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('profile.loginPassword')">
|
|
|
+ <el-input
|
|
|
+ v-model="form.password"
|
|
|
+ maxlength="32"
|
|
|
+ :placeholder="$t('profile.enterLoginPassword')"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('profile.paymentPassword')">
|
|
|
+ <el-input
|
|
|
+ v-model="form.payPassword"
|
|
|
+ maxlength="32"
|
|
|
+ :placeholder="$t('profile.enterPaymentPassword')"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.recipientName')">
|
|
|
+ <el-input v-model="form.consignee" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.phoneNumber')">
|
|
|
+ <el-input v-model="form.acceptMobile" />
|
|
|
+ </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-cascader
|
|
|
+ v-model="form.areaSelected"
|
|
|
+ :disabled="areaDisabled"
|
|
|
+ size="large"
|
|
|
+ :placeholder="$t('shop.delivery')"
|
|
|
+ :options="regionData"
|
|
|
+ style="width: 100%"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('config.detailedAddress')">
|
|
|
+ <el-input v-model="form.address" :disabled="addressDisabled" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('config.city')">
|
|
|
+ <el-input v-model="form.cityName" :disabled="addressDisabled" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('config.localGovernmentArea')">
|
|
|
+ <el-input v-model="form.lgaName" :disabled="addressDisabled" />
|
|
|
+ </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-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.accountName')">
|
|
|
+ <el-input v-model="form.bankAddress" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.bankAccount')">
|
|
|
+ <el-input v-model="form.bankNo" maxlength="50" />
|
|
|
+ </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">
|
|
|
+ <el-radio
|
|
|
+ v-for="(item, index) in payList"
|
|
|
+ :key="index"
|
|
|
+ border
|
|
|
+ :label="item.label"
|
|
|
+ style="margin: 5px"
|
|
|
+ >
|
|
|
+ {{ 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"
|
|
|
+ :loading="submitButtonStat"
|
|
|
+ @click="onSubmit"
|
|
|
+ >{{ $t("common.save") }}</el-button
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- payStack模态框 -->
|
|
|
+ <el-dialog
|
|
|
+ v-loading="payStackLoading"
|
|
|
+ :title="$t('shop.goPay')"
|
|
|
+ :visible.sync="visible"
|
|
|
+ :width="payStackScreenWidth"
|
|
|
+ :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-form-item>
|
|
|
+ <el-form-item :label="$t('shop.amount')" label-width="100px" required>
|
|
|
+ <el-input v-model="payForm.amount" autocomplete="off" readonly />
|
|
|
+ </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"
|
|
|
+ style="margin-left: 10px"
|
|
|
+ @click="handleClose"
|
|
|
+ >{{ $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')"
|
|
|
+ :sub-title="$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-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 { deleteApproachOrder } from "@/api/shop";
|
|
|
+import {
|
|
|
+createWelcomePack,
|
|
|
+fetchAutoPlace,
|
|
|
+fetchBrandAmbassadorInfo,
|
|
|
+fetchFullInfo,
|
|
|
+fetchWelcomePack,
|
|
|
+} from "@/api/user";
|
|
|
+import Pagination from "@/components/Pagination";
|
|
|
+import waves from "@/directive/waves";
|
|
|
+import region from "@/store/modules/region";
|
|
|
+import { getScreenWidth } from "@/utils";
|
|
|
+import tool from "@/utils/tool";
|
|
|
+import usersInfo from "@/utils/usersInfo";
|
|
|
+import paystack from "vue-paystack";
|
|
|
+
|
|
|
+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);
|
|
|
+ },
|
|
|
+ statusFilter(status) {
|
|
|
+ const statusMap = {
|
|
|
+ Unpaid: "info",
|
|
|
+ Paid: "success",
|
|
|
+ };
|
|
|
+ return statusMap[status];
|
|
|
+ },
|
|
|
+ },
|
|
|
+ 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.0,
|
|
|
+ pricePvSum: 0.0,
|
|
|
+ taxSum: 0.0,
|
|
|
+ storeNums: [],
|
|
|
+ tableData: null,
|
|
|
+ payAmount: 0.0,
|
|
|
+
|
|
|
+ cashCurrency: "",
|
|
|
+ currency: {},
|
|
|
+ pointsSum: 0,
|
|
|
+ cashSum: 0,
|
|
|
+ pointFreight: 0,
|
|
|
+ freeShipping: "",
|
|
|
+ goodsId: "",
|
|
|
+ goodsNum: "",
|
|
|
+ payPassword: "",
|
|
|
+ submitButtonStat: false,
|
|
|
+ sn: "",
|
|
|
+ orderType: "",
|
|
|
+ payDialog: false,
|
|
|
+ countdown: 5,
|
|
|
+ visible: false,
|
|
|
+ totalAmount: 0.0,
|
|
|
+ freight: 0.0,
|
|
|
+ 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",
|
|
|
+ regionData: region.regionInfo.regionData,
|
|
|
+ form: {
|
|
|
+ decType: "normal",
|
|
|
+ realName: "",
|
|
|
+ decLv: "",
|
|
|
+ insertUserName: "",
|
|
|
+ decUserName: "",
|
|
|
+ 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: [],
|
|
|
+
|
|
|
+ activeName: "product",
|
|
|
+ isDec: null,
|
|
|
+ // header start
|
|
|
+ headerActiveName: "1",
|
|
|
+ activeIndex: 0,
|
|
|
+ titleInfo: null,
|
|
|
+ tabList: [
|
|
|
+ {
|
|
|
+ title: "Tab1",
|
|
|
+ name: "1",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "Tab2",
|
|
|
+ name: "2",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "Tab3",
|
|
|
+ name: "3",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "Tab4",
|
|
|
+ name: "4",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "Tab5",
|
|
|
+ name: "5",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "Tab6",
|
|
|
+ name: "6",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "Tab7",
|
|
|
+ name: "7",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "Tab8",
|
|
|
+ name: "8",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "Tab9",
|
|
|
+ name: "9",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ drawer: false,
|
|
|
+ direction: "ttb",
|
|
|
+ drawerWidth: "50%",
|
|
|
+ classifiedProductList:[]
|
|
|
+ // header end
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ // PayStack混淆串
|
|
|
+ reference() {
|
|
|
+ let text = "";
|
|
|
+ const possible =
|
|
|
+ "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
|
|
|
+ for (let i = 0; i < 10; i++) {
|
|
|
+ text += possible.charAt(Math.floor(Math.random() * possible.length));
|
|
|
+ }
|
|
|
+ return text;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ isDec: {
|
|
|
+ handler(newValue, old) {
|
|
|
+ if (newValue == "1") {
|
|
|
+ this.form.decUserName = usersInfo.userName();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ const regionInfo = this.$store.getters.regionInfo;
|
|
|
+ // console.log(this.$store.state.region)
|
|
|
+ this.fetchWelcomePack();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //header start
|
|
|
+ chooseNav(item, index) {
|
|
|
+ this.titleInfo = item;
|
|
|
+ this.headerActiveName = item.name;
|
|
|
+ this.activeIndex = index;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ const item = this.$el.querySelectorAll(".tabItem")[index];
|
|
|
+ const container = document.querySelector(".decTabs");
|
|
|
+ const scrollLeft =
|
|
|
+ item.offsetLeft - (container.offsetWidth - item.offsetWidth) / 2;
|
|
|
+ container.scrollTo({
|
|
|
+ left: scrollLeft,
|
|
|
+ behavior: "smooth",
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ drawerClassification(item, index) {
|
|
|
+ this.chooseNav(item, index);
|
|
|
+ this.drawer = false;
|
|
|
+ },
|
|
|
+ //end
|
|
|
+ // 会员报单/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;
|
|
|
+ //是否是报单中心
|
|
|
+ this.isDec = response.data.isDec;
|
|
|
+ const settingObj = this.allGoods;
|
|
|
+ for (const i in this.allGoods) {
|
|
|
+ this.storeNums[i] = 1;
|
|
|
+ settingObj[i].goodsNum = 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.tableData = Object.values(settingObj);
|
|
|
+ const pageList = this.multipleSelection;
|
|
|
+ this.$nextTick(function () {
|
|
|
+ for (const i in this.tableData) {
|
|
|
+ for (const 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.classifiedProductList = this.handleSameTypeList(this.tableData);
|
|
|
+ // console.log(handleSameTypeList);
|
|
|
+ // 支付方式
|
|
|
+ this.payList = response.data.sellType[0]["sell_type"];
|
|
|
+ // 支付方式的第一项默认选中
|
|
|
+ this.form.payType = Object.values(this.payList)[1]["label"];
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ this.loading = false;
|
|
|
+ }, 0.5 * 1000);
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ handleSameTypeList(goodsList) {
|
|
|
+ let list = goodsList;
|
|
|
+ let list2 = [
|
|
|
+ {
|
|
|
+ ID: "481221711786807210",
|
|
|
+ GOODS_NAME: "ULTRA EPP 1",
|
|
|
+ CATE_ID: "1",
|
|
|
+ TYPE: "0",
|
|
|
+ GOODS_NO: "ENBPUL2N-1",
|
|
|
+ UNIT: "box",
|
|
|
+ COVER: "b159e6ca213a30659e2df0e24c0663ad.jpg",
|
|
|
+ IMAGES: null,
|
|
|
+ CONTENT: "ELKAN BIO PURE ULTRA EPP 1ST PAYMENT",
|
|
|
+ SELL_PRICE: "68000.00",
|
|
|
+ SELL_PRICE_STANDARD: "113.33",
|
|
|
+ MARKET_PRICE: "81600.00",
|
|
|
+ PRICE_PV: "30.00",
|
|
|
+ TAX_RATE: "7.50",
|
|
|
+ STORE_NUMS: "9995",
|
|
|
+ STATUS: "1",
|
|
|
+ CREATED_AT: "1679980284",
|
|
|
+ UPDATED_AT: "1680600159",
|
|
|
+ SORT: "1",
|
|
|
+ IS_DEL: "0",
|
|
|
+ DELETED_AT: "0",
|
|
|
+ POINT: "0",
|
|
|
+ SELL_TYPE: "1,7",
|
|
|
+ GIFT_TYPE: "1,2",
|
|
|
+ SELL_DISCOUNT: "1",
|
|
|
+ CATEGORY_TYPE: "2",
|
|
|
+ STATUS_DATE: "0",
|
|
|
+ GOODS_DATE: null,
|
|
|
+ GOODS_STATUS_DATE: "0",
|
|
|
+ PV_SPLIT: "0",
|
|
|
+ INSTALMENT: "1",
|
|
|
+ DISCOUNT: 100,
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ list = list.concat(list2);
|
|
|
+
|
|
|
+ let dataArr = [];
|
|
|
+ let category_type_list = [];
|
|
|
+
|
|
|
+ list.map((mapItem) => {
|
|
|
+ if (dataArr.length == 0) {
|
|
|
+ dataArr.push({
|
|
|
+ CATEGORY_TYPE: mapItem.CATEGORY_TYPE,
|
|
|
+ list: [mapItem],
|
|
|
+ });
|
|
|
+ category_type_list.push(mapItem.CATEGORY_TYPE);
|
|
|
+ } else {
|
|
|
+ let res = dataArr.some((item) => {
|
|
|
+ //判断相同类型，有就添加到当前项
|
|
|
+ if (item.CATEGORY_TYPE == mapItem.CATEGORY_TYPE) {
|
|
|
+ item.list.push(mapItem);
|
|
|
+ // category_type_list.push(item.CATEGORY_TYPE)
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (!res) {
|
|
|
+ //如果没找相同类型添加一个新对象
|
|
|
+ dataArr.push({
|
|
|
+ CATEGORY_TYPE: mapItem.CATEGORY_TYPE,
|
|
|
+ list: [mapItem],
|
|
|
+ });
|
|
|
+ category_type_list.push(mapItem.CATEGORY_TYPE);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ return dataArr;
|
|
|
+ },
|
|
|
+ // 商品详情
|
|
|
+ handleProduct(row) {
|
|
|
+ this.product = row;
|
|
|
+ this.product.taxAmount = tool.calculateTax(row.SELL_PRICE, row.TAX_RATE);
|
|
|
+ this.visibleProduct = true;
|
|
|
+ },
|
|
|
+ // 选择商品计数
|
|
|
+ handleInputNumber(current, row) {
|
|
|
+ const pageList = this.multipleSelection;
|
|
|
+ let selectStatus = false;
|
|
|
+ for (const 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;
|
|
|
+ let accumulatorPricePv = 0;
|
|
|
+ let 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.0;
|
|
|
+ this.display = true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 选择商品
|
|
|
+ handleSelectionChange(val) {
|
|
|
+ let idx = -1;
|
|
|
+ let num;
|
|
|
+ for (const i in this.tableData) {
|
|
|
+ for (const 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/member-order` });
|
|
|
+ },
|
|
|
+ // 启动倒计时
|
|
|
+ handleCountdown() {
|
|
|
+ // 创建定时器
|
|
|
+ setInterval(() => {
|
|
|
+ // 每隔1秒把time的值减一，赋值给span标签
|
|
|
+ this.countdown--;
|
|
|
+ if (this.countdown === 0) {
|
|
|
+ // 倒计时结束,跳转到订单列表
|
|
|
+ this.$router.push({ path: `/shop/member-order` });
|
|
|
+ }
|
|
|
+ }, 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;
|
|
|
+ }
|
|
|
+ // 余额
|
|
|
+ const amountBalance = this.userBalance[this.form.payType] || 0;
|
|
|
+ // 余额是否充足
|
|
|
+ if (this.form.payType === "cash" && amountBalance - this.payAmount < 0) {
|
|
|
+ // 账户类型提示信息
|
|
|
+ const account = this.payList.filter((item) => {
|
|
|
+ return this.form.payType === item.label;
|
|
|
+ });
|
|
|
+ const accountType = (account[0] && account[0].name) || "";
|
|
|
+ this.$message({
|
|
|
+ message: accountType + this.$t("shop.balanceNotAllow"),
|
|
|
+ type: "error",
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.submitButtonStat = true;
|
|
|
+
|
|
|
+ const 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/member-order` });
|
|
|
+ } 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;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ this.$message({
|
|
|
+ message: err,
|
|
|
+ type: "error",
|
|
|
+ });
|
|
|
+ this.submitButtonStat = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 已选择商品
|
|
|
+ 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 lang="scss" scoped>
|
|
|
+.flex {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+.flexjcac {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flexfc {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flexJcsbAc {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flexJcfsAc {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flexFwW {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+}
|
|
|
+.active {
|
|
|
+ color: #1890ff !important;
|
|
|
+ // border-bottom: 2px solid #1890ff;
|
|
|
+}
|
|
|
+::-webkit-scrollbar {
|
|
|
+ /*隐藏滚轮*/
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+.dec {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.dec-header {
|
|
|
+ // width: 100%;
|
|
|
+ height: 60px;
|
|
|
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
|
|
+ .classification {
|
|
|
+ width: 90%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ // position: relative;
|
|
|
+ .decTabs {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ overflow-x: auto;
|
|
|
+ -webkit-overflow-scrolling: touch; /* ios5+ */
|
|
|
+ scroll-behavior: smooth; /* 可以使窗口平稳滚动 */
|
|
|
+
|
|
|
+ .tabItem {
|
|
|
+ padding: 0 20px 0 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ // line-height: 40px;
|
|
|
+ display: inline-block;
|
|
|
+ list-style: none;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #303133;
|
|
|
+ }
|
|
|
+ .tabItem:hover {
|
|
|
+ color: #1890ff;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .openAllClassification {
|
|
|
+ width: 10%;
|
|
|
+ height: 60px;
|
|
|
+ // box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.1);
|
|
|
+ box-shadow: -10px 0px 30px rgba(0, 0, 0, 0.1);
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 16px;
|
|
|
+ justify-content: center;
|
|
|
+ span {
|
|
|
+ writing-mode: vertical-lr;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ::v-deep {
|
|
|
+ ::-webkit-scrollbar {
|
|
|
+ /*隐藏滚轮*/
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-drawer__wrapper {
|
|
|
+ position: absolute;
|
|
|
+ // position: fixed;
|
|
|
+ top: 0px;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-drawer__wrapper {
|
|
|
+ // min-height: 60%;
|
|
|
+ .el-drawer__body {
|
|
|
+ // height: 400px;
|
|
|
+ }
|
|
|
+ .el-drawer__container ::-webkit-scrollbar {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .allClassification {
|
|
|
+ // justify-content: center;
|
|
|
+ text-align: center;
|
|
|
+ // height: auto;
|
|
|
+ .title {
|
|
|
+ width: 33%;
|
|
|
+ height: 50px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
+<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;
|
|
|
+}
|
|
|
+.el-form-item {
|
|
|
+ margin-bottom: 12px;
|
|
|
+}
|
|
|
+</style>
|
tyler