|
|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div class="right-wrap">
|
|
|
- <el-breadcrumb separator="/" style="margin-bottom: 13px;">
|
|
|
+ <el-breadcrumb separator="/" style="margin-bottom: 13px">
|
|
|
<el-breadcrumb-item :to="{ path: '/home/pointsMall' }">积分商城</el-breadcrumb-item>
|
|
|
<el-breadcrumb-item>兑换详情</el-breadcrumb-item>
|
|
|
</el-breadcrumb>
|
|
|
@@ -10,7 +10,7 @@
|
|
|
<!-- <el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button> -->
|
|
|
</div>
|
|
|
<div class="footer">
|
|
|
- <div class="left-info" style="width: 100%;">
|
|
|
+ <div class="left-info" style="width: 100%">
|
|
|
<span class="info-title">
|
|
|
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"
|
|
|
class="info-icon">
|
|
|
@@ -42,22 +42,24 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div v-else @click="handleClickAddress">
|
|
|
- <div class="address-container new"><i class="add-icon byte-icon byte-icon--plus"><svg
|
|
|
- xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
|
|
|
+ <div class="address-container new">
|
|
|
+ <i class="add-icon byte-icon byte-icon--plus"><svg xmlns="http://www.w3.org/2000/svg"
|
|
|
+ viewBox="0 0 48 48">
|
|
|
<path fill="none" d="M0 0h48v48H0z"></path>
|
|
|
<path
|
|
|
d="M24.7 4c.4 0 .6 0 .8.1.2.1.3.2.4.4.1.2.1.3.1.8V22h16.7c.4 0 .6 0 .8.1.2.1.3.2.4.4.1.2.1.3.1.8v1.4c0 .4 0 .6-.1.8-.1.2-.2.3-.4.4-.2.1-.3.1-.8.1H26v16.7c0 .4 0 .6-.1.8-.1.2-.2.3-.4.4-.2.1-.3.1-.8.1h-1.4c-.4 0-.6 0-.8-.1-.2-.1-.3-.2-.4-.4-.1-.2-.1-.3-.1-.8V26H5.3c-.4 0-.6 0-.8-.1-.2-.1-.3-.2-.4-.4-.1-.2-.1-.3-.1-.8v-1.4c0-.4 0-.6.1-.8.1-.2.2-.3.4-.4.2-.1.3-.1.8-.1H22V5.3c0-.4 0-.6.1-.8.1-.2.2-.3.4-.4.2-.1.3-.1.8-.1h1.4z">
|
|
|
</path>
|
|
|
- </svg></i> <span class="add-label">添加收货地址</span></div>
|
|
|
+ </svg></i>
|
|
|
+ <span class="add-label">添加收货地址</span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
-
|
|
|
</div>
|
|
|
</div>
|
|
|
<div v-show="deliveryType == 4">
|
|
|
<p class="label">手机直充</p>
|
|
|
<div class="address">
|
|
|
<div v-if="phoneNumber">
|
|
|
- <div class="address-container" style="min-height: 45px;">
|
|
|
+ <div class="address-container" style="min-height: 45px">
|
|
|
<div class="header">
|
|
|
<div class="left">
|
|
|
<span>{{ phoneNumber }}</span>
|
|
|
@@ -67,15 +69,17 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div v-else @click="handleClickPhoneNumber">
|
|
|
- <div class="address-container new"><i class="add-icon byte-icon byte-icon--plus"><svg
|
|
|
- xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
|
|
|
+ <div class="address-container new">
|
|
|
+ <i class="add-icon byte-icon byte-icon--plus"><svg xmlns="http://www.w3.org/2000/svg"
|
|
|
+ viewBox="0 0 48 48">
|
|
|
<path fill="none" d="M0 0h48v48H0z"></path>
|
|
|
<path
|
|
|
d="M24.7 4c.4 0 .6 0 .8.1.2.1.3.2.4.4.1.2.1.3.1.8V22h16.7c.4 0 .6 0 .8.1.2.1.3.2.4.4.1.2.1.3.1.8v1.4c0 .4 0 .6-.1.8-.1.2-.2.3-.4.4-.2.1-.3.1-.8.1H26v16.7c0 .4 0 .6-.1.8-.1.2-.2.3-.4.4-.2.1-.3.1-.8.1h-1.4c-.4 0-.6 0-.8-.1-.2-.1-.3-.2-.4-.4-.1-.2-.1-.3-.1-.8V26H5.3c-.4 0-.6 0-.8-.1-.2-.1-.3-.2-.4-.4-.1-.2-.1-.3-.1-.8v-1.4c0-.4 0-.6.1-.8.1-.2.2-.3.4-.4.2-.1.3-.1.8-.1H22V5.3c0-.4 0-.6.1-.8.1-.2.2-.3.4-.4.2-.1.3-.1.8-.1h1.4z">
|
|
|
</path>
|
|
|
- </svg></i> <span class="add-label">填写充值手机号</span></div>
|
|
|
+ </svg></i>
|
|
|
+ <span class="add-label">填写充值手机号</span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
-
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
@@ -85,13 +89,15 @@
|
|
|
<thead>
|
|
|
<tr>
|
|
|
<th width="25%">兑换物品</th>
|
|
|
- <th style="text-align: center;">数量</th>
|
|
|
- <th style="text-align: center;">单价</th>
|
|
|
- <th style="text-align: center;" width="15%"><span style="color: red;">*</span>兑换方式</th>
|
|
|
- <th v-if="deliveryType=='0'" style="text-align: center;" width="15%">
|
|
|
- <span style="color: red;">*</span>领取地点
|
|
|
+ <th style="text-align: center">数量</th>
|
|
|
+ <th style="text-align: center">单价</th>
|
|
|
+ <th style="text-align: center" width="15%">
|
|
|
+ <span style="color: red">*</span>兑换方式
|
|
|
</th>
|
|
|
- <th style="text-align: center;">总计</th>
|
|
|
+ <th v-if="deliveryType == '0'" style="text-align: center" width="15%">
|
|
|
+ <span style="color: red">*</span>领取地点
|
|
|
+ </th>
|
|
|
+ <th style="text-align: center">总计</th>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
<tbody>
|
|
|
@@ -110,24 +116,28 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</td>
|
|
|
- <td style="text-align: center;">
|
|
|
+ <td style="text-align: center">
|
|
|
<el-input-number @change="changeCount" size="mini" v-model="skuCount" :step="1" :min="1"
|
|
|
step-strictly></el-input-number>
|
|
|
</td>
|
|
|
- <td style="text-align: center;">{{ data.price }} 积分</td>
|
|
|
- <td style="text-align: center;">
|
|
|
- <el-select size="small" clearable v-model="deliveryType" placeholder="请选择" value-key="value" @change="changeDeliveryType">
|
|
|
- <el-option :key="item.dictValue" v-for="item in deliveryTypeList" :label="item.dictLabel" :value="item.dictValue">
|
|
|
+ <td style="text-align: center">{{ data.price }} 积分</td>
|
|
|
+ <td style="text-align: center">
|
|
|
+ <el-select size="small" clearable v-model="deliveryType" placeholder="请选择" value-key="value"
|
|
|
+ @change="changeDeliveryType">
|
|
|
+ <el-option :key="item.dictValue" v-for="item in deliveryTypeList"
|
|
|
+ :label="item.dictLabel" :value="item.dictValue">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</td>
|
|
|
- <td v-if="deliveryType=='0'" style="text-align: center;">
|
|
|
- <el-select size="small" clearable v-model="reclaimAddr" placeholder="请选择" value-key="value" @change="changeReclaimAddr">
|
|
|
- <el-option :key="item.dictValue" v-for="item in reclaimAddrList" :label="item.dictLabel" :value="item.dictValue">
|
|
|
+ <td v-if="deliveryType == '0'" style="text-align: center">
|
|
|
+ <el-select size="small" clearable v-model="reclaimAddr" placeholder="请选择" value-key="value"
|
|
|
+ @change="changeReclaimAddr">
|
|
|
+ <el-option :key="item.dictValue" v-for="item in reclaimAddrList" :label="item.dictLabel"
|
|
|
+ :value="item.dictValue">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</td>
|
|
|
- <td style="text-align: center;" class="finlly-price">
|
|
|
+ <td style="text-align: center" class="finlly-price">
|
|
|
{{ total }} 积分
|
|
|
</td>
|
|
|
</tr>
|
|
|
@@ -139,9 +149,11 @@
|
|
|
<thead>
|
|
|
<tr>
|
|
|
<th width="35%">兑换物品</th>
|
|
|
- <th style="text-align: center;">消耗福利券</th>
|
|
|
- <th style="text-align: center;">物品属性</th>
|
|
|
- <th style="text-align: center;" width="20%"><span style="color: red;">*</span>兑换方式</th>
|
|
|
+ <th style="text-align: center">消耗福利券</th>
|
|
|
+ <th style="text-align: center">物品属性</th>
|
|
|
+ <th style="text-align: center" width="20%">
|
|
|
+ <span style="color: red">*</span>兑换方式
|
|
|
+ </th>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
<tbody>
|
|
|
@@ -160,11 +172,15 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</td>
|
|
|
- <td style="text-align: center;">{{ data.title }}</td>
|
|
|
- <td style="text-align: center;">{{ data.productAttributeName }}</td>
|
|
|
- <td style="text-align: center;" class="finlly-price">
|
|
|
- <el-select size="small" clearable v-model="deliveryType" placeholder="请选择" value-key="value" @change="changeDeliveryType">
|
|
|
- <el-option :key="item.dictValue" v-for="item in deliveryTypeList" :label="item.dictLabel" :value="item.dictValue">
|
|
|
+ <td style="text-align: center">{{ data.title }}</td>
|
|
|
+ <td style="text-align: center">
|
|
|
+ {{ data.productAttributeName }}
|
|
|
+ </td>
|
|
|
+ <td style="text-align: center" class="finlly-price">
|
|
|
+ <el-select size="small" clearable v-model="deliveryType" placeholder="请选择" value-key="value"
|
|
|
+ @change="changeDeliveryType">
|
|
|
+ <el-option :key="item.dictValue" v-for="item in deliveryTypeList"
|
|
|
+ :label="item.dictLabel" :value="item.dictValue">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</td>
|
|
|
@@ -176,42 +192,33 @@
|
|
|
<div class="footer">
|
|
|
<div class="right" v-if="data.stock != 0">
|
|
|
<div class="btn-line">
|
|
|
- <el-button :disabled="disabled" @click="handleClickExchange" type="primary" round>确认兑换</el-button>
|
|
|
+ <el-button :disabled="disabled" @click="dialogVisible = true" type="primary" round>确认兑换</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-card>
|
|
|
<el-dialog title="兑换物品收货地址" :visible.sync="dialogFormVisible" width="500px">
|
|
|
- <el-form label-position="left" :model="dataForm" ref="dataForm" style="padding: 0 75px;" :rules="rules">
|
|
|
+ <el-form label-position="left" :model="dataForm" ref="dataForm" style="padding: 0 75px" :rules="rules">
|
|
|
<el-form-item label="联系姓名" :label-width="formLabelWidth" prop="name">
|
|
|
<el-input size="medium" v-model="dataForm.name" placeholder="请输入联系姓名"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="联系方式" :label-width="formLabelWidth" prop="phone">
|
|
|
<el-input size="medium" v-model="dataForm.phone" placeholder="请输入11位手机号码"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="省市区"
|
|
|
- :label-width="formLabelWidth" prop="addressArr">
|
|
|
- <el-cascader
|
|
|
- style="width: 100%;"
|
|
|
- clearable
|
|
|
- placeholder="请选择省市区"
|
|
|
- size="medium"
|
|
|
- :options="options"
|
|
|
- v-model="dataForm.addressArr"
|
|
|
- @change="handleChange">
|
|
|
+ <el-form-item label="省市区" :label-width="formLabelWidth" prop="addressArr">
|
|
|
+ <el-cascader style="width: 100%" clearable placeholder="请选择省市区" size="medium" :options="options"
|
|
|
+ v-model="dataForm.addressArr" @change="handleChange">
|
|
|
</el-cascader>
|
|
|
</el-form-item>
|
|
|
-
|
|
|
- <el-form-item label="街道"
|
|
|
- :label-width="formLabelWidth" prop="street">
|
|
|
+
|
|
|
+ <el-form-item label="街道" :label-width="formLabelWidth" prop="street">
|
|
|
<el-input size="medium" v-model="dataForm.street" placeholder="请输入街道"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="详细地址"
|
|
|
- :label-width="formLabelWidth" prop="address">
|
|
|
+ <el-form-item label="详细地址" :label-width="formLabelWidth" prop="address">
|
|
|
<el-input size="medium" v-model="dataForm.address" placeholder="请输入小区楼栋/乡村名称"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
- <div slot="footer" class="dialog-footer" style="text-align: center;">
|
|
|
+ <div slot="footer" class="dialog-footer" style="text-align: center">
|
|
|
<el-button class="addButton-address" type="primary" @click="submitForm('dataForm')">提交</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
@@ -221,8 +228,9 @@
|
|
|
<el-input size="medium" v-model="dataFormPhoneNumber.phoneNumber" placeholder="请输入11位手机号码"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
- <div slot="footer" class="dialog-footer" style="text-align: center;">
|
|
|
- <el-button class="addButton-address" type="primary" @click="submitFormPhoneNumber('dataFormPhoneNumber')">提交</el-button>
|
|
|
+ <div slot="footer" class="dialog-footer" style="text-align: center">
|
|
|
+ <el-button class="addButton-address" type="primary"
|
|
|
+ @click="submitFormPhoneNumber('dataFormPhoneNumber')">提交</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
<el-dialog title="结算明细" :visible.sync="dialogFormOrderInfo" width="300px">
|
|
|
@@ -244,8 +252,13 @@
|
|
|
<div class="itemValue">{{ total }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div slot="footer" class="dialog-footer" style="text-align: center;">
|
|
|
- <el-button class="addButton-address" type="primary" style="background-image: linear-gradient(to right, #f5b543,#faa029);width: 100px;height: 35px;line-height: 34px;" @click="handleClickOrderInfo">确定</el-button>
|
|
|
+ <div slot="footer" class="dialog-footer" style="text-align: center">
|
|
|
+ <el-button class="addButton-address" type="primary" style="
|
|
|
+ background-image: linear-gradient(to right, #f5b543, #faa029);
|
|
|
+ width: 100px;
|
|
|
+ height: 35px;
|
|
|
+ line-height: 34px;
|
|
|
+ " @click="handleClickOrderInfo">确定</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
<el-dialog :visible.sync="dialogMsgVisible" width="400px" @close="handleClose">
|
|
|
@@ -285,110 +298,127 @@
|
|
|
</defs>
|
|
|
</svg>
|
|
|
<h2 class="header">恭喜你，兑换成功！</h2>
|
|
|
- <img :src="data.imgUrl" class="icon">
|
|
|
+ <img :src="data.imgUrl" class="icon" />
|
|
|
<div class="desc">
|
|
|
<span>已下单，经过审批后，2周内发货，如有问题联系物品介绍中备注的相关联系人</span>
|
|
|
<!-- <span>恭喜你成功兑换{{ data.name }}，随后你可在</span>
|
|
|
<a href="/home/myCenter" class="link">个人中心</a>中查看兑换的物品 -->
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div slot="footer" class="dialog-footer" style="text-align: center;">
|
|
|
+ <div slot="footer" class="dialog-footer" style="text-align: center">
|
|
|
<router-link to="/home/myCenter">
|
|
|
<el-button @click="setTab" class="addButton-address" type="primary">
|
|
|
查看物品
|
|
|
</el-button>
|
|
|
</router-link>
|
|
|
-
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
+ <el-dialog title="兑换确认" :visible.sync="dialogVisible" width="30%">
|
|
|
+ <span>这是一段信息</span>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="handleClickExchange">确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { integralInfo, festivalInfo, start, kill } from "@/api/allApi";
|
|
|
-import {
|
|
|
- provinceAndCityData,
|
|
|
- pcTextArr,
|
|
|
- regionData,
|
|
|
- pcaTextArr,
|
|
|
- codeToText,
|
|
|
-} from "element-china-area-data";
|
|
|
-import { setTab } from '@/utils/auth'
|
|
|
-import { debounce } from '@/utils/index'
|
|
|
+import {regionData,codeToText,} from "element-china-area-data";
|
|
|
+import { setTab } from "@/utils/auth";
|
|
|
+import { debounce } from "@/utils/index";
|
|
|
export default {
|
|
|
data() {
|
|
|
var validPhone = (rule, value, callback) => {
|
|
|
- if (value === '') {
|
|
|
- callback(new Error('请输入手机号'));
|
|
|
- }
|
|
|
- else {
|
|
|
- const reg_tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
|
|
|
+ if (value === "") {
|
|
|
+ callback(new Error("请输入手机号"));
|
|
|
+ } else {
|
|
|
+ const reg_tel =
|
|
|
+ /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
|
|
|
const isCheckPhone = reg_tel.test(value);
|
|
|
if (!isCheckPhone) {
|
|
|
- callback(new Error('请输入正确手机号'));
|
|
|
+ callback(new Error("请输入正确手机号"));
|
|
|
}
|
|
|
callback();
|
|
|
}
|
|
|
};
|
|
|
return {
|
|
|
- options: regionData ,
|
|
|
- reclaimAddr:'',
|
|
|
- reclaimAddrList:[],
|
|
|
- phoneNumber:'',
|
|
|
- deliveryTypeList:[],
|
|
|
- deliveryType:'',
|
|
|
- contactInfo:{},
|
|
|
+ dialogVisible:false,
|
|
|
+ options: regionData,
|
|
|
+ reclaimAddr: "",
|
|
|
+ reclaimAddrList: [],
|
|
|
+ phoneNumber: "",
|
|
|
+ deliveryTypeList: [],
|
|
|
+ deliveryType: "",
|
|
|
+ contactInfo: {},
|
|
|
activeName: this.$route.query.activeName,
|
|
|
- name: '',
|
|
|
- phone: '',
|
|
|
- addressArr:[],
|
|
|
- addressStr:'',
|
|
|
- street:'',
|
|
|
- address: '',
|
|
|
+ name: "",
|
|
|
+ phone: "",
|
|
|
+ addressArr: [],
|
|
|
+ addressStr: "",
|
|
|
+ street: "",
|
|
|
+ address: "",
|
|
|
disabled: true,
|
|
|
skuCount: 1,
|
|
|
total: undefined,
|
|
|
data: {},
|
|
|
- dialogFormOrderInfo:false,
|
|
|
- dialogFormPhoneNumber:false,
|
|
|
+ dialogFormOrderInfo: false,
|
|
|
+ dialogFormPhoneNumber: false,
|
|
|
addressDetail: false,
|
|
|
dialogFormVisible: false,
|
|
|
dialogMsgVisible: false,
|
|
|
- dataFormPhoneNumber:{
|
|
|
- phoneNumber:'',
|
|
|
+ dataFormPhoneNumber: {
|
|
|
+ phoneNumber: "",
|
|
|
},
|
|
|
dataForm: {
|
|
|
- name: '',
|
|
|
- phone: '',
|
|
|
- addressArr:[],
|
|
|
- addressStr:'',
|
|
|
- street:'',
|
|
|
- address: '',
|
|
|
+ name: "",
|
|
|
+ phone: "",
|
|
|
+ addressArr: [],
|
|
|
+ addressStr: "",
|
|
|
+ street: "",
|
|
|
+ address: "",
|
|
|
},
|
|
|
rules: {
|
|
|
name: [
|
|
|
- { required: true, message: '请输入联系姓名', trigger: 'blur' },
|
|
|
- { min: 1, max: 25, message: '长度在 1 到 25 个字符', trigger: 'blur' }
|
|
|
- ],
|
|
|
- phone: [
|
|
|
- { required: true, validator: validPhone, trigger: 'blur' }
|
|
|
+ { required: true, message: "请输入联系姓名", trigger: "blur" },
|
|
|
+ {
|
|
|
+ min: 1,
|
|
|
+ max: 25,
|
|
|
+ message: "长度在 1 到 25 个字符",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
],
|
|
|
+ phone: [{ required: true, validator: validPhone, trigger: "blur" }],
|
|
|
addressArr: [
|
|
|
- { required: true, message: '请选择省市区', trigger: 'blur' },
|
|
|
+ { required: true, message: "请选择省市区", trigger: "blur" },
|
|
|
],
|
|
|
street: [
|
|
|
- { required: true, message: '请输入街道', trigger: 'blur' },
|
|
|
- { min: 1, max: 120, message: '长度在 1 到 120 个字符', trigger: 'blur' }
|
|
|
+ { required: true, message: "请输入街道", trigger: "blur" },
|
|
|
+ {
|
|
|
+ min: 1,
|
|
|
+ max: 120,
|
|
|
+ message: "长度在 1 到 120 个字符",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
],
|
|
|
address: [
|
|
|
- { required: true, message: '请输入小区楼栋/乡村名称', trigger: 'blur' },
|
|
|
- { min: 1, max: 120, message: '长度在 1 到 120 个字符', trigger: 'blur' }
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入小区楼栋/乡村名称",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ min: 1,
|
|
|
+ max: 120,
|
|
|
+ message: "长度在 1 到 120 个字符",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
],
|
|
|
phoneNumber: [
|
|
|
- { required: true, validator: validPhone, trigger: 'blur' }
|
|
|
+ { required: true, validator: validPhone, trigger: "blur" },
|
|
|
],
|
|
|
-
|
|
|
},
|
|
|
- formLabelWidth: '80px',
|
|
|
+ formLabelWidth: "80px",
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
@@ -398,107 +428,113 @@ export default {
|
|
|
this.getInfo(skuId, activeName);
|
|
|
},
|
|
|
methods: {
|
|
|
- handleChange (value) {
|
|
|
- console.log(value)
|
|
|
+ handleClick(){
|
|
|
+ this.dialogVisible = true;
|
|
|
+ },
|
|
|
+ handleChange(value) {
|
|
|
+ console.log(value);
|
|
|
var loc = "";
|
|
|
for (let i = 0; i < value.length; i++) {
|
|
|
loc += codeToText[value[i]];
|
|
|
}
|
|
|
- console.log(loc)//打印区域码所对应的属性值即中文地址
|
|
|
+ console.log(loc); //打印区域码所对应的属性值即中文地址
|
|
|
this.dataForm.addressStr = loc;
|
|
|
},
|
|
|
- handleClickOrderInfo(){
|
|
|
+ handleClickOrderInfo() {
|
|
|
this.dialogFormOrderInfo = false;
|
|
|
},
|
|
|
- changeReclaimAddr(val){
|
|
|
+ changeReclaimAddr(val) {
|
|
|
this.disabled = true;
|
|
|
- if(val){
|
|
|
+ if (val) {
|
|
|
this.disabled = false;
|
|
|
}
|
|
|
},
|
|
|
- changeDeliveryType(val){
|
|
|
+ changeDeliveryType(val) {
|
|
|
this.disabled = true;
|
|
|
- if(val=='0' || val==''){
|
|
|
+ if (val == "0" || val == "") {
|
|
|
this.total = this.data.price;
|
|
|
this.skuCount = 1;
|
|
|
}
|
|
|
- if(val=='1'){
|
|
|
- debugger
|
|
|
- if(this.data.productAttribute=='exchange_logo'){
|
|
|
+ if (val == "1") {
|
|
|
+ debugger;
|
|
|
+ if (this.data.productAttribute == "exchange_logo") {
|
|
|
this.total = this.data.price * this.skuCount + 180;
|
|
|
this.dialogFormOrderInfo = true;
|
|
|
}
|
|
|
- if(this.address){
|
|
|
+ if (this.address) {
|
|
|
this.addressDetail = true;
|
|
|
this.disabled = false;
|
|
|
}
|
|
|
}
|
|
|
- if(val=='2' || val=='3'){
|
|
|
+ if (val == "2" || val == "3") {
|
|
|
this.total = this.data.price;
|
|
|
this.skuCount = 1;
|
|
|
this.disabled = false;
|
|
|
}
|
|
|
- if(val=='4'){
|
|
|
+ if (val == "4") {
|
|
|
this.total = this.data.price;
|
|
|
this.skuCount = 1;
|
|
|
- if(this.phoneNumber){
|
|
|
+ if (this.phoneNumber) {
|
|
|
this.disabled = false;
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
setTab() {
|
|
|
- setTab('exchange');
|
|
|
+ setTab("exchange");
|
|
|
},
|
|
|
changeCount(val) {
|
|
|
this.total = this.data.price * val;
|
|
|
- if(this.deliveryType=='1' && this.data.productAttribute=='exchange_logo'){
|
|
|
+ if (
|
|
|
+ this.deliveryType == "1" &&
|
|
|
+ this.data.productAttribute == "exchange_logo"
|
|
|
+ ) {
|
|
|
this.total = this.data.price * val + 180;
|
|
|
}
|
|
|
},
|
|
|
handleClose() {
|
|
|
this.dialogMsgVisible = false;
|
|
|
this.$router.push({
|
|
|
- path: '/home/pointsMall',
|
|
|
+ path: "/home/pointsMall",
|
|
|
});
|
|
|
},
|
|
|
getInfo(skuId, activeName) {
|
|
|
- if (activeName == 'goodsNotice') {
|
|
|
- integralInfo({ skuId: skuId }).then(response => {
|
|
|
- this.data = response.data.data;
|
|
|
- this.deliveryTypeList = response.data.data.dictDataList;
|
|
|
- this.reclaimAddrList = response.data.data.reclaimAddrList;
|
|
|
- this.contactInfo = response.data.data.contactInfo;
|
|
|
- if(this.contactInfo){
|
|
|
- this.name = this.contactInfo.contact;
|
|
|
- this.phone = this.contactInfo.contactPhone;
|
|
|
- this.addressArr = this.contactInfo.addressArr;
|
|
|
- this.addressStr = this.contactInfo.addressStr;
|
|
|
- this.street = this.contactInfo.street;
|
|
|
- this.address = this.contactInfo.contactAddr;
|
|
|
- }
|
|
|
- this.total = response.data.data.price;
|
|
|
- }).catch(() => {
|
|
|
-
|
|
|
- })
|
|
|
+ if (activeName == "goodsNotice") {
|
|
|
+ integralInfo({ skuId: skuId })
|
|
|
+ .then((response) => {
|
|
|
+ this.data = response.data.data;
|
|
|
+ this.deliveryTypeList = response.data.data.dictDataList;
|
|
|
+ this.reclaimAddrList = response.data.data.reclaimAddrList;
|
|
|
+ this.contactInfo = response.data.data.contactInfo;
|
|
|
+ if (this.contactInfo) {
|
|
|
+ this.name = this.contactInfo.contact;
|
|
|
+ this.phone = this.contactInfo.contactPhone;
|
|
|
+ this.addressArr = this.contactInfo.addressArr;
|
|
|
+ this.addressStr = this.contactInfo.addressStr;
|
|
|
+ this.street = this.contactInfo.street;
|
|
|
+ this.address = this.contactInfo.contactAddr;
|
|
|
+ }
|
|
|
+ this.total = response.data.data.price;
|
|
|
+ })
|
|
|
+ .catch(() => { });
|
|
|
} else {
|
|
|
- festivalInfo({ skuId: skuId }).then(response => {
|
|
|
- this.data = response.data.data;
|
|
|
- this.contactInfo = response.data.data.contactInfo;
|
|
|
- this.deliveryTypeList = response.data.data.dictDataList;
|
|
|
- if(this.contactInfo){
|
|
|
- this.name = this.contactInfo.contact;
|
|
|
- this.phone = this.contactInfo.contactPhone;
|
|
|
- this.addressArr = this.contactInfo.addressArr;
|
|
|
- this.addressStr = this.contactInfo.addressStr;
|
|
|
- this.street = this.contactInfo.street;
|
|
|
- this.address = this.contactInfo.contactAddr;
|
|
|
- }
|
|
|
- }).catch(() => {
|
|
|
-
|
|
|
- })
|
|
|
+ festivalInfo({ skuId: skuId })
|
|
|
+ .then((response) => {
|
|
|
+ this.data = response.data.data;
|
|
|
+ this.contactInfo = response.data.data.contactInfo;
|
|
|
+ this.deliveryTypeList = response.data.data.dictDataList;
|
|
|
+ if (this.contactInfo) {
|
|
|
+ this.name = this.contactInfo.contact;
|
|
|
+ this.phone = this.contactInfo.contactPhone;
|
|
|
+ this.addressArr = this.contactInfo.addressArr;
|
|
|
+ this.addressStr = this.contactInfo.addressStr;
|
|
|
+ this.street = this.contactInfo.street;
|
|
|
+ this.address = this.contactInfo.contactAddr;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(() => { });
|
|
|
}
|
|
|
},
|
|
|
- handleClickPhoneNumber(){
|
|
|
+ handleClickPhoneNumber() {
|
|
|
this.dialogFormPhoneNumber = true;
|
|
|
this.dataFormPhoneNumber.phoneNumber = this.phoneNumber;
|
|
|
},
|
|
|
@@ -510,16 +546,15 @@ export default {
|
|
|
this.dataForm.addressStr = this.addressStr;
|
|
|
this.dataForm.street = this.street;
|
|
|
this.dataForm.address = this.address;
|
|
|
-
|
|
|
},
|
|
|
- submitFormPhoneNumber(formName){
|
|
|
+ submitFormPhoneNumber(formName) {
|
|
|
this.$refs[formName].validate((valid) => {
|
|
|
if (valid) {
|
|
|
- this.phoneNumber = this.dataFormPhoneNumber.phoneNumber,
|
|
|
- this.dialogFormPhoneNumber = false;
|
|
|
+ (this.phoneNumber = this.dataFormPhoneNumber.phoneNumber),
|
|
|
+ (this.dialogFormPhoneNumber = false);
|
|
|
this.disabled = false;
|
|
|
} else {
|
|
|
- console.log('error submit!!');
|
|
|
+ console.log("error submit!!");
|
|
|
return false;
|
|
|
}
|
|
|
});
|
|
|
@@ -528,95 +563,107 @@ export default {
|
|
|
this.$refs[formName].validate((valid) => {
|
|
|
if (valid) {
|
|
|
// alert('submit!');
|
|
|
- this.name = this.dataForm.name,
|
|
|
- this.phone = this.dataForm.phone,
|
|
|
- this.addressArr = this.dataForm.addressArr,
|
|
|
- this.addressStr = this.dataForm.addressStr,
|
|
|
- this.street = this.dataForm.street,
|
|
|
- this.address = this.dataForm.address,
|
|
|
- this.addressDetail = true;
|
|
|
+ (this.name = this.dataForm.name),
|
|
|
+ (this.phone = this.dataForm.phone),
|
|
|
+ (this.addressArr = this.dataForm.addressArr),
|
|
|
+ (this.addressStr = this.dataForm.addressStr),
|
|
|
+ (this.street = this.dataForm.street),
|
|
|
+ (this.address = this.dataForm.address),
|
|
|
+ (this.addressDetail = true);
|
|
|
this.dialogFormVisible = false;
|
|
|
this.disabled = false;
|
|
|
} else {
|
|
|
- console.log('error submit!!');
|
|
|
+ console.log("error submit!!");
|
|
|
return false;
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
- submit(){
|
|
|
- if(this.deliveryType=='1'){
|
|
|
+ submit() {
|
|
|
+ if (this.deliveryType == "1") {
|
|
|
var params = {
|
|
|
skuId: this.data.skuId,
|
|
|
skuCount: this.skuCount,
|
|
|
- price:this.data.price,
|
|
|
- deliveryType:this.deliveryType,
|
|
|
+ price: this.data.price,
|
|
|
+ deliveryType: this.deliveryType,
|
|
|
contact: this.name,
|
|
|
contactPhone: this.phone,
|
|
|
- addressArr:this.addressArr,
|
|
|
- addressStr:this.addressStr,
|
|
|
- street:this.street,
|
|
|
+ addressArr: this.addressArr,
|
|
|
+ addressStr: this.addressStr,
|
|
|
+ street: this.street,
|
|
|
contactAddr: this.address,
|
|
|
-
|
|
|
+
|
|
|
skuType: this.data.skuType,
|
|
|
welfareId: this.data.welfareId,
|
|
|
- }
|
|
|
- }else if(this.deliveryType=='4'){
|
|
|
+ };
|
|
|
+ } else if (this.deliveryType == "4") {
|
|
|
var params = {
|
|
|
skuId: this.data.skuId,
|
|
|
skuCount: this.skuCount,
|
|
|
- price:this.data.price,
|
|
|
- deliveryType:this.deliveryType,
|
|
|
+ price: this.data.price,
|
|
|
+ deliveryType: this.deliveryType,
|
|
|
contactPhone: this.phoneNumber,
|
|
|
|
|
|
skuType: this.data.skuType,
|
|
|
welfareId: this.data.welfareId,
|
|
|
- }
|
|
|
- }else{
|
|
|
+ };
|
|
|
+ } else {
|
|
|
var params = {
|
|
|
skuId: this.data.skuId,
|
|
|
skuCount: this.skuCount,
|
|
|
- price:this.data.price,
|
|
|
- deliveryType:this.deliveryType,
|
|
|
- reclaimAddr:this.reclaimAddr,
|
|
|
+ price: this.data.price,
|
|
|
+ deliveryType: this.deliveryType,
|
|
|
+ reclaimAddr: this.reclaimAddr,
|
|
|
|
|
|
skuType: this.data.skuType,
|
|
|
welfareId: this.data.welfareId,
|
|
|
- }
|
|
|
+ };
|
|
|
}
|
|
|
-
|
|
|
- if (this.activeName == 'goodsNotice') {
|
|
|
- start(params).then(response => {
|
|
|
- console.log(response.data.data);
|
|
|
- this.$store.dispatch('GetUserInfo');
|
|
|
- this.dialogMsgVisible = true;
|
|
|
- }).catch(() => { })
|
|
|
+
|
|
|
+ if (this.activeName == "goodsNotice") {
|
|
|
+ start(params)
|
|
|
+ .then((response) => {
|
|
|
+ console.log(response.data.data);
|
|
|
+ this.$store.dispatch("GetUserInfo");
|
|
|
+ this.dialogVisible = false;
|
|
|
+ this.dialogMsgVisible = true;
|
|
|
+ })
|
|
|
+ .catch(() => { });
|
|
|
} else {
|
|
|
- kill(params).then(response => {
|
|
|
- console.log(response.data.data);
|
|
|
- this.$store.dispatch('GetUserInfo');
|
|
|
- this.dialogMsgVisible = true;
|
|
|
- }).catch(() => { })
|
|
|
+ kill(params)
|
|
|
+ .then((response) => {
|
|
|
+ console.log(response.data.data);
|
|
|
+ this.$store.dispatch("GetUserInfo");
|
|
|
+ this.dialogVisible = false;
|
|
|
+ this.dialogMsgVisible = true;
|
|
|
+ })
|
|
|
+ .catch(() => { });
|
|
|
}
|
|
|
},
|
|
|
- handleClickExchange:debounce(function(){
|
|
|
+ handleClickExchange: debounce(
|
|
|
+ function () {
|
|
|
this.submit();
|
|
|
- },2000,true),
|
|
|
- }
|
|
|
+ },
|
|
|
+ 2000,
|
|
|
+ true
|
|
|
+ ),
|
|
|
+ },
|
|
|
};
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
-.red{
|
|
|
+.red {
|
|
|
color: red;
|
|
|
}
|
|
|
+
|
|
|
/* .checklist{
|
|
|
|
|
|
} */
|
|
|
-.listItem{
|
|
|
+.listItem {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-content: center;
|
|
|
padding: 5px 0;
|
|
|
}
|
|
|
+
|
|
|
/* .itemName{
|
|
|
|
|
|
} */
|
|
|
@@ -630,7 +677,7 @@ export default {
|
|
|
}
|
|
|
|
|
|
.clearfix:after {
|
|
|
- clear: both
|
|
|
+ clear: both;
|
|
|
}
|
|
|
|
|
|
.box-card {
|
|
|
@@ -924,7 +971,6 @@ img {
|
|
|
.el-dialog__body {
|
|
|
padding-bottom: 0px;
|
|
|
padding-top: 10px;
|
|
|
-
|
|
|
}
|
|
|
</style>
|
|
|
|
