mirror of
https://gitee.com/lab1024/smart-admin.git
synced 2025-10-02 10:16:38 +08:00
Admin
Gitee
commit
c206c2d882
@ -693,5 +693,14 @@ img, picture {
|
||||
.el-dialog{
|
||||
width: 90%;
|
||||
}
|
||||
.diallog_width{
|
||||
.el-dialog{
|
||||
width: 100%;
|
||||
}
|
||||
.el-dialog__title{
|
||||
color: #e1001a;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -525,9 +525,8 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 59px;
|
||||
font-size: 16px;
|
||||
height: 39px;
|
||||
padding: 5px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -24,14 +24,15 @@
|
||||
"less-loader": "^6.0.0",
|
||||
"nuxt": "^2.15.7",
|
||||
"nuxt-tailvue": "^1.0.95",
|
||||
"qrcodejs2": "^0.0.2",
|
||||
"swiper": "^5.4.5",
|
||||
"vant": "^2.12.22",
|
||||
"vue-awesome-swiper": "^4.1.1",
|
||||
"vuex-persistedstate": "^4.1.0",
|
||||
"swiper":"^5.4.5"
|
||||
"vue-qr": "^3.2.4",
|
||||
"vuex-persistedstate": "^4.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vant/area-data": "^1.1.5",
|
||||
"qrcodejs2": "^0.0.2",
|
||||
"webpack": "^4.46.0"
|
||||
}
|
||||
}
|
||||
|
||||
@ -121,7 +121,5 @@ export default {
|
||||
.van-overlay {
|
||||
background-color: transparent;
|
||||
}
|
||||
.v-modal {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -534,10 +534,11 @@ export default {
|
||||
.list-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 50%;
|
||||
}
|
||||
ul {
|
||||
display: flex;
|
||||
width: 70%;
|
||||
width: 50%;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
}
|
||||
@ -551,6 +552,14 @@ export default {
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.del{
|
||||
em{
|
||||
color: #e1001a;
|
||||
border-bottom: 1px solid #e1001a;
|
||||
cursor:pointer ;
|
||||
}
|
||||
}
|
||||
.product {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@ -560,9 +569,8 @@ export default {
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.product-img {
|
||||
margin-right: 10px;
|
||||
margin-right: 15px;
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
img {
|
||||
@ -755,14 +763,23 @@ export default {
|
||||
.product {
|
||||
margin-left: 16px;
|
||||
}
|
||||
.list-left{
|
||||
width: 100%;
|
||||
}
|
||||
ul {
|
||||
margin-top: -32px;
|
||||
margin-left: 128px;
|
||||
width: 60%;
|
||||
margin-left: 140px;
|
||||
width: 50%;
|
||||
.del {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.product-title{
|
||||
width: 225px;
|
||||
text-overflow: ellipsis;
|
||||
white-space:nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -10,7 +10,7 @@ ul li ol li em strong i {
|
||||
|
||||
|
||||
.settlement {
|
||||
padding-top: 100px;
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
|
||||
@ -123,6 +123,15 @@ ul li ol li em strong i {
|
||||
|
||||
&.active {
|
||||
border: 1px solid #E2001A;
|
||||
|
||||
.arrow_ph {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
right: -25px;
|
||||
font-size: 40px;
|
||||
display: none;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.edit {
|
||||
@ -363,21 +372,45 @@ ul li ol li em strong i {
|
||||
}
|
||||
}
|
||||
}
|
||||
.diallog_width{
|
||||
|
||||
.diallog_width {
|
||||
width: 100%;
|
||||
max-width: 440px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.el-dialog{
|
||||
width: 100%;
|
||||
|
||||
.el-dialog__header{
|
||||
color: #e1001a;
|
||||
}
|
||||
//手机端
|
||||
@media screen and (max-width: 768px) {
|
||||
|
||||
.diallog_width{
|
||||
.settlement {
|
||||
padding-top: 0;
|
||||
}
|
||||
.diallog_width {
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
||||
.inline {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.tl {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.pop_list {
|
||||
p{ padding: 0; margin: 0; line-height: 180%;}
|
||||
.mypersonal {
|
||||
border-bottom: 1px solid #d8d8d8;
|
||||
padding: 15px 0;
|
||||
}
|
||||
input,.el-icon-edit{
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.rc-main {
|
||||
.address-list {
|
||||
display: contents;
|
||||
@ -385,29 +418,55 @@ ul li ol li em strong i {
|
||||
.mypersonal {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
|
||||
&.active {
|
||||
display: block;
|
||||
border: none;
|
||||
|
||||
.arrow_ph {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.edit {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.add {
|
||||
// display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rc-usermain {
|
||||
.rc-right { display: table}
|
||||
.rc-right {
|
||||
display: table
|
||||
}
|
||||
}
|
||||
.rc-merchandise{
|
||||
|
||||
.rc-merchandise {
|
||||
padding: 15px 0 120px;
|
||||
ul{
|
||||
|
||||
ul {
|
||||
float: none;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.rc-foot{
|
||||
.rc-foo{
|
||||
|
||||
.rc-foot {
|
||||
.rc-foo {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
flex-direction: row;
|
||||
align-items: self-end;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
justify-content: space-around;
|
||||
flex-direction: row;
|
||||
align-items: self-end;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -2,9 +2,9 @@
|
||||
<div class="settlement">
|
||||
<Myheader></Myheader>
|
||||
|
||||
<tabs></tabs>
|
||||
<div class="rc_contline"></div>
|
||||
<div class="rc-main">
|
||||
<tabs></tabs>
|
||||
|
||||
<div class="address-list">
|
||||
<div
|
||||
class="mypersonal"
|
||||
@ -13,6 +13,9 @@
|
||||
:class="item.isDefault ? 'active' : ''"
|
||||
@click="selectAddress(item)"
|
||||
>
|
||||
<div class="arrow_ph" v-if="item.isDefault" @click="popGetList()">
|
||||
<i class="el-icon-arrow-right"></i>
|
||||
</div>
|
||||
<div class="edit" @click="editAddress(item)">
|
||||
<i class="el-icon-edit"></i>编辑
|
||||
</div>
|
||||
@ -24,7 +27,7 @@
|
||||
<span>{{ item.address }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mypersonal">
|
||||
<div class="mypersonal add">
|
||||
<div
|
||||
class="my-delivery"
|
||||
@click="addAddress"
|
||||
@ -36,7 +39,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-contline"></div>
|
||||
<div class="rc_contline"></div>
|
||||
<div class="rc-main" v-for="(item, index) in goldmedal" :key="index">
|
||||
<div class="rc-usermain">
|
||||
<div class="rc-image">
|
||||
@ -101,6 +104,38 @@
|
||||
></myAddress>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
:visible.sync="dialogPopList"
|
||||
class="diallog_width"
|
||||
width="'100%"
|
||||
title="选择收货地址"
|
||||
>
|
||||
<div class="tc dl_cont">
|
||||
<div class="pop_list">
|
||||
<el-row
|
||||
class="mypersonal"
|
||||
v-for="(item, index) in useraddress"
|
||||
:key="index"
|
||||
:class="item.isDefault ? 'active' : ''"
|
||||
@click="selectAddress(item)"
|
||||
>
|
||||
<el-col :span="4"
|
||||
><input type="checkbox" v-model="item.checked"
|
||||
/></el-col>
|
||||
<el-col :span="16" class="tl">
|
||||
<div >
|
||||
<p class="inline">{{ item.recipient }}</p>
|
||||
<p class="inline">{{ item.recipientPhone }}</p>
|
||||
</div>
|
||||
<p> {{ item.address }}</p>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<i class="el-icon-edit"></i>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -125,6 +160,7 @@ export default {
|
||||
leftico: require("../../assets/image/rc-left.png"),
|
||||
orderNumber: "",
|
||||
dialogAdd: false,
|
||||
dialogPopList: false,
|
||||
editAddressData: {},
|
||||
curAddress: {},
|
||||
saveType: "",
|
||||
@ -198,6 +234,9 @@ export default {
|
||||
}
|
||||
});
|
||||
},
|
||||
popGetList() {
|
||||
this.dialogPopList = true;
|
||||
},
|
||||
dialogCtrl(parm) {
|
||||
this.dialogAdd = parm;
|
||||
this.getAddressList();
|
||||
@ -277,7 +316,7 @@ export default {
|
||||
if (res.success) {
|
||||
let userPayData = {
|
||||
orderId: res.data,
|
||||
userprice: postData[0].payAmount,
|
||||
userprice: this.sumPrice,
|
||||
userinformation:
|
||||
postData[0].orderAddress.addressUserName +
|
||||
" " +
|
||||
@ -287,7 +326,7 @@ export default {
|
||||
this.$router.push({
|
||||
path: "/personal/userpay",
|
||||
query: {
|
||||
userPayData:JSON.stringify(userPayData),
|
||||
userPayData: JSON.stringify(userPayData),
|
||||
},
|
||||
});
|
||||
}
|
||||
@ -318,7 +357,9 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "./settlement.less";
|
||||
|
||||
@import url("../../assets/css/global.less");
|
||||
@import "./settlement.less";
|
||||
// @import url("../../assets/css/settlement.less");
|
||||
|
||||
</style>
|
||||
@ -51,7 +51,7 @@
|
||||
</div>
|
||||
|
||||
<div class="paycord">
|
||||
<div id="qrcode" ref="qrcode" class="qrcode"></div>
|
||||
<div class="qrcode"><vue-qr :text="qrtext" :size="260"></vue-qr></div>
|
||||
<span>{{ paytype }}扫一扫立即支付</span>
|
||||
</div>
|
||||
|
||||
@ -64,12 +64,7 @@
|
||||
<p>您的商品我们正在抓紧打包，请耐心等候！</p>
|
||||
<div class="line_dashed"></div>
|
||||
<div class="userer">
|
||||
<img
|
||||
width="210"
|
||||
height="210"
|
||||
src="../../assets/image/rc-discount.png"
|
||||
alt=""
|
||||
/>
|
||||
<div class="qrcode"><vue-qr :text="qrtext" :size="260"></vue-qr></div>
|
||||
<p>微信扫一扫，识别二维码</p>
|
||||
<p class="tips">加入社群0元试用商品随单发放</p>
|
||||
</div>
|
||||
@ -90,7 +85,7 @@
|
||||
<script>
|
||||
import Myheader from "~/components/header.vue";
|
||||
import tabs from "@/components/tabs.vue";
|
||||
// import QRCode from "qrcodejs2";
|
||||
import vueQr from 'vue-qr'
|
||||
|
||||
import { generateOrderAlipay, updateOrderWX } from "../../ajax/getData";
|
||||
export default {
|
||||
@ -112,33 +107,28 @@ export default {
|
||||
dialogSuccess: true,
|
||||
dialogFail: false,
|
||||
userPayData: {},
|
||||
qrtext:'',
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
mounted() {
|
||||
this.userPayData = JSON.parse(this.$route.query.userPayData);
|
||||
// this.qrcode(this.userPayData.wxPay);
|
||||
this.qrtext=this.userPayData.wxPay
|
||||
},
|
||||
methods: {
|
||||
closeDialogSuccess() {
|
||||
this.qrcode = null;
|
||||
this.qrtext = '';
|
||||
// this.$router.push({
|
||||
// path: "/index",
|
||||
// });
|
||||
},
|
||||
closeDialogFail() {
|
||||
this.qrcode = null;
|
||||
this.qrtext = '';
|
||||
// this.$router.push({
|
||||
// path: "/personal/useraddress",
|
||||
// });
|
||||
},
|
||||
qrcode(e) {
|
||||
let qrcode = new QRCode("qrcode", {
|
||||
width: 260, // 设置宽度，单位像素
|
||||
height: 260, // 设置高度，单位像素
|
||||
text: e, // 设置二维码内容或跳转地址
|
||||
});
|
||||
},
|
||||
|
||||
async selectGoods(item, index) {
|
||||
this.activeIndex = index;
|
||||
this.paytype = item.paytype;
|
||||
@ -146,7 +136,7 @@ export default {
|
||||
//支付宝
|
||||
let res = await generateOrderAlipay(this.userPayData.orderId);
|
||||
if (res.success) {
|
||||
this.qrcode(res.data);
|
||||
this.qrtext=res.data
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -154,6 +144,7 @@ export default {
|
||||
async updateOrderWX() {
|
||||
let res = await updateOrderWX();
|
||||
if (res.success) {
|
||||
this.qrtext = '成功加入群的二维码';
|
||||
this.dialogSuccess = true;
|
||||
clearInterval(this.time);
|
||||
} else {
|
||||
@ -165,6 +156,7 @@ export default {
|
||||
components: {
|
||||
Myheader,
|
||||
tabs,
|
||||
vueQr,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user