完成3.0功能升级
This commit is contained in:
Gao xiaosong
@ -3,13 +3,20 @@ import request from "@/utils/request";
|
||||
/**
|
||||
* 省市区
|
||||
*/
|
||||
export function district(data) {
|
||||
export function getCity(data) {
|
||||
return request.get("/city_list", data, {
|
||||
// return request.get("/citys", data, {
|
||||
login: false
|
||||
});
|
||||
}
|
||||
|
||||
export function district(data) {
|
||||
// return request.get("/city_list", data, {
|
||||
return request.get("/citys", data, {
|
||||
login: false
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 用户登录
|
||||
* @param data object 用户账号密码
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1381,8 +1381,9 @@ page {
|
||||
border-top: 1px solid #eee;
|
||||
padding-top: 0.34*100rpx;
|
||||
margin: 0 0.3*100rpx;
|
||||
&.no-border{
|
||||
border:0;
|
||||
|
||||
&.no-border {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -2405,8 +2406,8 @@ page {
|
||||
}
|
||||
|
||||
.user .wrapper .myService .serviceList .item .pictrue {
|
||||
width: 0.52*100rpx;
|
||||
height: 0.52*100rpx;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
margin-right: 0.16*100rpx;
|
||||
}
|
||||
|
||||
@ -3583,22 +3584,17 @@ page {
|
||||
}
|
||||
|
||||
.personal-data .wrapper .wrapList .item {
|
||||
width: 6.9*100rpx;
|
||||
height: 1.6*100rpx;
|
||||
width: 100%;
|
||||
/*height: 1.6rem;*/
|
||||
background-color: #f8f8f8;
|
||||
border-radius: 0.2*100rpx;
|
||||
margin-bottom: 0.22*100rpx;
|
||||
padding: 0 0.3*100rpx;
|
||||
border-radius: 20rpx;
|
||||
position: relative;
|
||||
border: 0.02*100rpx solid #f8f8f8;
|
||||
// border: 0.02rem solid #f8f8f8;
|
||||
}
|
||||
|
||||
.personal-data .wrapper .wrapList .item.on {
|
||||
border-color: #e93323;
|
||||
border-radius: 0.2*100rpx;
|
||||
background: url("https://h5.yixiang.co/static/images/figure.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background-color: #fff9f9;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.personal-data .wrapper .wrapList .item .picTxt {
|
||||
@ -4415,7 +4411,7 @@ page {
|
||||
width: 1.8*100rpx;
|
||||
height: 1.8*100rpx;
|
||||
position: relative;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.bargain .wrapper .pictxt .pictrue image {
|
||||
|
||||
285
components/CitySelect.vue
Normal file
285
components/CitySelect.vue
Normal file
@ -0,0 +1,285 @@
|
||||
<template>
|
||||
<view>
|
||||
<text class="uni-input" @tap="open">{{value}}</text>
|
||||
<uni-popup ref="popup" type="bottom">
|
||||
<view class="cityselect">
|
||||
<view class="cityselect-header">
|
||||
<view class="cityselect-title">
|
||||
<text>请选择地址</text>
|
||||
</view>
|
||||
<view class="cityselect-nav">
|
||||
<view class="item" v-if="provinceActive" @tap="changeNav(0)">
|
||||
<text>{{provinceActive.n}}</text>
|
||||
</view>
|
||||
<view class="item" v-if="cityActive" @tap="changeNav(1)">
|
||||
<text>{{cityActive.n}}</text>
|
||||
</view>
|
||||
<view class="item" v-if="districtActive" @tap="changeNav(2)">
|
||||
<text>{{districtActive.n}}</text>
|
||||
</view>
|
||||
<view class="item active" v-else>
|
||||
<text>请选择</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cityselect-content">
|
||||
<swiper class="swiper" disable-touch="true" touchable="false" :current="current">
|
||||
<swiper-item>
|
||||
<scroll-view scroll-y class="cityScroll">
|
||||
<view>
|
||||
<view
|
||||
class="cityselect-item"
|
||||
v-for="(item,index) in province"
|
||||
:key="index"
|
||||
@tap="selectProvince(index)"
|
||||
>
|
||||
<view class="cityselect-item-box">
|
||||
<text>{{item.n}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<swiper-item>
|
||||
<scroll-view scroll-y class="cityScroll">
|
||||
<view>
|
||||
<view
|
||||
class="cityselect-item"
|
||||
v-for="(item,index) in city"
|
||||
:key="index"
|
||||
@tap="selectCity(index)"
|
||||
>
|
||||
<view class="cityselect-item-box">
|
||||
<text>{{item.n}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<swiper-item>
|
||||
<scroll-view scroll-y class="cityScroll">
|
||||
<view>
|
||||
<view
|
||||
class="cityselect-item"
|
||||
v-for="(item,index) in district"
|
||||
:key="index"
|
||||
@tap="selectDistrict(index)"
|
||||
>
|
||||
<view class="cityselect-item-box">
|
||||
<text>{{item.n}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script type="text/babel">
|
||||
import uniPopup from "./uni-popup/uni-popup.vue";
|
||||
import uniPopupMessage from "./uni-popup/uni-popup-message.vue";
|
||||
import uniPopupDialog from "./uni-popup/uni-popup-dialog.vue";
|
||||
|
||||
export default {
|
||||
name: "CitySelect",
|
||||
components: {
|
||||
uniPopup,
|
||||
uniPopupMessage,
|
||||
uniPopupDialog
|
||||
},
|
||||
props: ["callback", "items", "defaultValue"],
|
||||
data() {
|
||||
return {
|
||||
value: "请选择",
|
||||
show: this.value,
|
||||
province: [],
|
||||
provinceActive: null,
|
||||
city: [],
|
||||
cityActive: null,
|
||||
district: [],
|
||||
districtActive: null,
|
||||
current: 0
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
items(nextItem) {
|
||||
console.log(nextItem);
|
||||
this.province = nextItem;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
console.log(this);
|
||||
if (this.defaultValue) {
|
||||
this.value = this.defaultValue;
|
||||
}
|
||||
this.province = this.items;
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.province = this.items;
|
||||
this.provinceActive = null;
|
||||
this.cityActive = null;
|
||||
this.districtActive = null;
|
||||
this.city = [];
|
||||
this.district = [];
|
||||
this.current = 0;
|
||||
this.$refs.popup.open();
|
||||
},
|
||||
changeNav(index) {
|
||||
if (index == 0) {
|
||||
this.provinceActive = null;
|
||||
}
|
||||
if (index == 1) {
|
||||
this.cityActive = null;
|
||||
}
|
||||
if (index == 2) {
|
||||
this.districtActive = null;
|
||||
}
|
||||
this.current = index;
|
||||
},
|
||||
selectProvince(index) {
|
||||
this.provinceActive = this.province[index];
|
||||
this.city = this.province[index].c;
|
||||
this.current = 1;
|
||||
},
|
||||
selectCity(index) {
|
||||
this.cityActive = this.city[index];
|
||||
this.district = this.city[index].c;
|
||||
this.current = 2;
|
||||
},
|
||||
selectDistrict(index) {
|
||||
this.districtActive = this.district[index];
|
||||
this.value = `${this.provinceActive.n} ${this.cityActive.n} ${this.districtActive.n}`;
|
||||
// this.callback({
|
||||
// province: {
|
||||
// id: this.provinceActive.v,
|
||||
// name: this.provinceActive.n
|
||||
// },
|
||||
// city: {
|
||||
// id: this.cityActive.v,
|
||||
// name: this.cityActive.n
|
||||
// },
|
||||
// district: {
|
||||
// id: this.districtActive.v,
|
||||
// name: this.districtActive.n
|
||||
// }
|
||||
// });
|
||||
this.$emit("callback", {
|
||||
province: {
|
||||
id: this.provinceActive.v,
|
||||
name: this.provinceActive.n
|
||||
},
|
||||
city: {
|
||||
id: this.cityActive.v,
|
||||
name: this.cityActive.n
|
||||
},
|
||||
district: {
|
||||
id: this.districtActive.v,
|
||||
name: this.districtActive.n
|
||||
}
|
||||
});
|
||||
this.$refs.popup.close();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.cityselect {
|
||||
width: 100%;
|
||||
height: 75%;
|
||||
background-color: #fff;
|
||||
z-index: 1502;
|
||||
position: relative;
|
||||
height: 800rpx;
|
||||
.cityScroll {
|
||||
height: 100%;
|
||||
}
|
||||
.swiper {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.cityselect-header {
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
.cityselect-title {
|
||||
width: 100%;
|
||||
font-size: 30rpx;
|
||||
text-align: center;
|
||||
height: 95rpx;
|
||||
line-height: 95rpx;
|
||||
position: relative;
|
||||
&:cityselect-title:after {
|
||||
height: 1px;
|
||||
position: absolute;
|
||||
z-index: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
content: "";
|
||||
width: 100%;
|
||||
background-image: linear-gradient(0deg, #ececec 50%, transparent 0);
|
||||
}
|
||||
}
|
||||
.cityselect-nav {
|
||||
width: 100%;
|
||||
padding-left: 20rpx;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
.item {
|
||||
font-size: 26rpx;
|
||||
color: #222;
|
||||
display: block;
|
||||
height: 80rpx;
|
||||
line-height: 92rpx;
|
||||
padding: 0 16rpx;
|
||||
position: relative;
|
||||
margin-right: 30rpx;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 40%;
|
||||
&.active {
|
||||
color: #f23030 !important;
|
||||
border-bottom: 1rpx solid #f23030;
|
||||
}
|
||||
}
|
||||
}
|
||||
.cityselect-content {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.cityselect-item {
|
||||
.cityselect-item-box {
|
||||
display: block;
|
||||
padding: 0 40rpx;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
word-break: break-all;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 64rpx;
|
||||
max-height: 65rpx;
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
&:after {
|
||||
content: "";
|
||||
height: 1rpx;
|
||||
position: absolute;
|
||||
z-index: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background-image: linear-gradient(0deg, #ececec 50%, transparent 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
74
components/Mask.vue
Normal file
74
components/Mask.vue
Normal file
@ -0,0 +1,74 @@
|
||||
<template>
|
||||
<div
|
||||
:class="show?'yd-mask g-fix-ios-overflow-scrolling-bug':'yd-mask' "
|
||||
ref="scrollView"
|
||||
:style="styles"
|
||||
>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script type="text/babel">
|
||||
export default {
|
||||
name: "yd-mask",
|
||||
data() {
|
||||
return {
|
||||
show: this.value
|
||||
};
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
bgcolor: {
|
||||
type: String,
|
||||
default: "#000"
|
||||
},
|
||||
zindex: {
|
||||
default: 1500
|
||||
},
|
||||
opacity: {
|
||||
default: 0.5
|
||||
},
|
||||
animated: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
styles() {
|
||||
const style = {
|
||||
"z-index": this.zindex,
|
||||
"background-color": this.bgcolor
|
||||
};
|
||||
if (this.show) {
|
||||
style["opacity"] = this.opacity;
|
||||
style["pointer-events"] = "auto";
|
||||
}
|
||||
return style;
|
||||
}
|
||||
},
|
||||
mounted() {}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
@css-prefix: yd;
|
||||
|
||||
.@{css-prefix} {
|
||||
&-mask {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
pointer-events: none;
|
||||
transition: opacity 0.2s ease-in;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,10 +1,8 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="switchWindow" :class="switchActive === true ? 'on' : ''">
|
||||
<!-- @/static/images/public.png -->
|
||||
<view class="pictrue">
|
||||
<image v-if="login_type === 'h5'" src="@/static/images/h5.png" />
|
||||
<image src="@/static/images/h5.png" alt v-else />
|
||||
|
||||
</view>
|
||||
<!-- 是否选择切换到小程序账户？ -->
|
||||
<view class="info">
|
||||
|
||||
@ -1,6 +1,10 @@
|
||||
<template>
|
||||
<view class="evaluateWtapper">
|
||||
<view class="evaluateItem" v-for="(item, evaluateWtapperIndex) in reply" :key="evaluateWtapperIndex">
|
||||
<view
|
||||
class="evaluateItem"
|
||||
v-for="(item, evaluateWtapperIndex) in reply"
|
||||
:key="evaluateWtapperIndex"
|
||||
>
|
||||
<view class="pic-text acea-row row-middle">
|
||||
<view class="pictrue">
|
||||
<image :src="item.avatar" class="image" />
|
||||
@ -10,23 +14,22 @@
|
||||
<view class="start" :class="'star' + item.star"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="time">{{ dataFormat(item.addTime) }} {{ item.suk||'' }}</view>
|
||||
<view class="time">{{ item.createTime }} {{ item.sku||'' }}</view>
|
||||
<view class="evaluate-infor">{{ item.comment }}</view>
|
||||
<view class="imgList acea-row">
|
||||
<view class="pictrue" v-for="(itemn, eq) in item.picturesArr" :key="eq">
|
||||
<image :src="itemn" class="image" />
|
||||
</view>
|
||||
</view>
|
||||
<!--<view class="reply" v-if="item.merchant_reply_content">-->
|
||||
<!--<text class="font-color-red">店小二</text>：{{-->
|
||||
<!--item.merchant_reply_content-->
|
||||
<!--}}-->
|
||||
<!--</view>-->
|
||||
<view class="reply" v-if="item.merchantReplyContent">
|
||||
<span class="font-color-red">yshop店员</span>
|
||||
：{{item.merchantReplyContent}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import { dataFormat } from "@/utils";
|
||||
import { dataFormat } from "@/utils";
|
||||
|
||||
export default {
|
||||
name: "UserEvaluation",
|
||||
@ -41,7 +44,7 @@ export default {
|
||||
},
|
||||
mounted: function() {},
|
||||
methods: {
|
||||
dataFormat,
|
||||
dataFormat
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,143 +0,0 @@
|
||||
/* eslint-disable */
|
||||
var provinceData = [{
|
||||
"label": "北京市",
|
||||
"value": "11"
|
||||
},
|
||||
{
|
||||
"label": "天津市",
|
||||
"value": "12"
|
||||
},
|
||||
{
|
||||
"label": "河北省",
|
||||
"value": "13"
|
||||
},
|
||||
{
|
||||
"label": "山西省",
|
||||
"value": "14"
|
||||
},
|
||||
{
|
||||
"label": "内蒙古自治区",
|
||||
"value": "15"
|
||||
},
|
||||
{
|
||||
"label": "辽宁省",
|
||||
"value": "21"
|
||||
},
|
||||
{
|
||||
"label": "吉林省",
|
||||
"value": "22"
|
||||
},
|
||||
{
|
||||
"label": "黑龙江省",
|
||||
"value": "23"
|
||||
},
|
||||
{
|
||||
"label": "上海市",
|
||||
"value": "31"
|
||||
},
|
||||
{
|
||||
"label": "江苏省",
|
||||
"value": "32"
|
||||
},
|
||||
{
|
||||
"label": "浙江省",
|
||||
"value": "33"
|
||||
},
|
||||
{
|
||||
"label": "安徽省",
|
||||
"value": "34"
|
||||
},
|
||||
{
|
||||
"label": "福建省",
|
||||
"value": "35"
|
||||
},
|
||||
{
|
||||
"label": "江西省",
|
||||
"value": "36"
|
||||
},
|
||||
{
|
||||
"label": "山东省",
|
||||
"value": "37"
|
||||
},
|
||||
{
|
||||
"label": "河南省",
|
||||
"value": "41"
|
||||
},
|
||||
{
|
||||
"label": "湖北省",
|
||||
"value": "42"
|
||||
},
|
||||
{
|
||||
"label": "湖南省",
|
||||
"value": "43"
|
||||
},
|
||||
{
|
||||
"label": "广东省",
|
||||
"value": "44"
|
||||
},
|
||||
{
|
||||
"label": "广西壮族自治区",
|
||||
"value": "45"
|
||||
},
|
||||
{
|
||||
"label": "海南省",
|
||||
"value": "46"
|
||||
},
|
||||
{
|
||||
"label": "重庆市",
|
||||
"value": "50"
|
||||
},
|
||||
{
|
||||
"label": "四川省",
|
||||
"value": "51"
|
||||
},
|
||||
{
|
||||
"label": "贵州省",
|
||||
"value": "52"
|
||||
},
|
||||
{
|
||||
"label": "云南省",
|
||||
"value": "53"
|
||||
},
|
||||
{
|
||||
"label": "西藏自治区",
|
||||
"value": "54"
|
||||
},
|
||||
{
|
||||
"label": "陕西省",
|
||||
"value": "61"
|
||||
},
|
||||
{
|
||||
"label": "甘肃省",
|
||||
"value": "62"
|
||||
},
|
||||
{
|
||||
"label": "青海省",
|
||||
"value": "63"
|
||||
},
|
||||
{
|
||||
"label": "宁夏回族自治区",
|
||||
"value": "64"
|
||||
},
|
||||
{
|
||||
"label": "新疆维吾尔自治区",
|
||||
"value": "65"
|
||||
},
|
||||
{
|
||||
"label": "台湾",
|
||||
"value": "66"
|
||||
},
|
||||
{
|
||||
"label": "香港",
|
||||
"value": "67"
|
||||
},
|
||||
{
|
||||
"label": "澳门",
|
||||
"value": "68"
|
||||
},
|
||||
{
|
||||
"label": "钓鱼岛",
|
||||
"value": "69"
|
||||
}
|
||||
]
|
||||
export default provinceData;
|
||||
@ -1,381 +0,0 @@
|
||||
<template>
|
||||
<view class="simple-address" v-if="showPopup" @touchmove.stop.prevent="clear">
|
||||
<!-- 遮罩层 -->
|
||||
<view
|
||||
class="simple-address-mask"
|
||||
@touchmove.stop.prevent="clear"
|
||||
v-if="maskClick"
|
||||
:class="[ani + '-mask', animation ? 'mask-ani' : '']"
|
||||
:style="{
|
||||
'background-color': maskBgColor
|
||||
}"
|
||||
@tap="hideMask(true)"
|
||||
></view>
|
||||
|
||||
<view class="simple-address-content simple-address--fixed" :class="[type, ani + '-content', animation ? 'content-ani' : '']">
|
||||
<view class="simple-address__header">
|
||||
<view class="simple-address__header-btn-box" @click="pickerCancel"><text class="simple-address__header-text">取消</text></view>
|
||||
<view class="simple-address__header-btn-box" @click="pickerConfirm"><text class="simple-address__header-text" :style="{ color: themeColor }">确定</text></view>
|
||||
</view>
|
||||
<view class="simple-address__box">
|
||||
<picker-view indicator-style="height: 70rpx;" class="simple-address-view" :value="pickerValue" @change="pickerChange">
|
||||
<picker-view-column>
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<view class="picker-item" v-for="(item, index) in provinceDataList" :key="index">{{ item.label }}</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<text class="picker-item" v-for="(item, index) in provinceDataList" :key="index">{{ item.label }}</text>
|
||||
<!-- #endif -->
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<view class="picker-item" v-for="(item, index) in cityDataList" :key="index">{{ item.label }}</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<text class="picker-item" v-for="(item, index) in cityDataList" :key="index">{{ item.label }}</text>
|
||||
<!-- #endif -->
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<view class="picker-item" v-for="(item, index) in areaDataList" :key="index">{{ item.label }}</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<text class="picker-item" v-for="(item, index) in areaDataList" :key="index">{{ item.label }}</text>
|
||||
<!-- #endif -->
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import provinceData from './city-data/province.js';
|
||||
import cityData from './city-data/city.js';
|
||||
import areaData from './city-data/area.js';
|
||||
export default {
|
||||
name: 'simpleAddress',
|
||||
props: {
|
||||
mode: {
|
||||
// 地址类型
|
||||
// default 则代表老版本根据index索引获取数据
|
||||
//
|
||||
type: String,
|
||||
default: 'default'
|
||||
},
|
||||
// 开启动画
|
||||
animation: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
/* 弹出层类型，可选值；
|
||||
bottom：底部弹出层
|
||||
*/
|
||||
type: {
|
||||
type: String,
|
||||
default: 'bottom'
|
||||
},
|
||||
// maskClick
|
||||
maskClick: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
maskBgColor: {
|
||||
type: String,
|
||||
default: 'rgba(0, 0, 0, 0.4)' //背景颜色 rgba(0, 0, 0, 0.4) 为空则调用 uni.scss
|
||||
},
|
||||
themeColor: {
|
||||
type: String,
|
||||
default: '' // 主题色
|
||||
},
|
||||
/* 默认值 */
|
||||
pickerValueDefault: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [0, 0, 0];
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
ani: '',
|
||||
showPopup: false,
|
||||
pickerValue: [0, 0, 0],
|
||||
provinceDataList: [],
|
||||
cityDataList: [],
|
||||
areaDataList: []
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
show(newValue) {
|
||||
if (newValue) {
|
||||
this.open();
|
||||
} else {
|
||||
this.close();
|
||||
}
|
||||
},
|
||||
pickerValueDefault() {
|
||||
this.init();
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.handPickValueDefault(); // 对 pickerValueDefault 做兼容处理
|
||||
this.provinceDataList = provinceData;
|
||||
this.cityDataList = cityData[this.pickerValueDefault[0]];
|
||||
this.areaDataList = areaData[this.pickerValueDefault[0]][this.pickerValueDefault[1]];
|
||||
this.pickerValue = this.pickerValueDefault;
|
||||
},
|
||||
handPickValueDefault() {
|
||||
if (this.pickerValueDefault !== [0, 0, 0]) {
|
||||
if (this.pickerValueDefault[0] > provinceData.length - 1) {
|
||||
this.pickerValueDefault[0] = provinceData.length - 1;
|
||||
}
|
||||
if (this.pickerValueDefault[1] > cityData[this.pickerValueDefault[0]].length - 1) {
|
||||
this.pickerValueDefault[1] = cityData[this.pickerValueDefault[0]].length - 1;
|
||||
}
|
||||
if (this.pickerValueDefault[2] > areaData[this.pickerValueDefault[0]][this.pickerValueDefault[1]].length - 1) {
|
||||
this.pickerValueDefault[2] = areaData[this.pickerValueDefault[0]][this.pickerValueDefault[1]].length - 1;
|
||||
}
|
||||
}
|
||||
},
|
||||
pickerChange(e) {
|
||||
let changePickerValue = e.detail.value;
|
||||
if (this.pickerValue[0] !== changePickerValue[0]) {
|
||||
// 第一级发生滚动
|
||||
this.cityDataList = cityData[changePickerValue[0]];
|
||||
this.areaDataList = areaData[changePickerValue[0]][0];
|
||||
changePickerValue[1] = 0;
|
||||
changePickerValue[2] = 0;
|
||||
} else if (this.pickerValue[1] !== changePickerValue[1]) {
|
||||
// 第二级滚动
|
||||
this.areaDataList = areaData[changePickerValue[0]][changePickerValue[1]];
|
||||
changePickerValue[2] = 0;
|
||||
}
|
||||
this.pickerValue = changePickerValue;
|
||||
this._$emit('onChange');
|
||||
},
|
||||
_$emit(emitName) {
|
||||
let pickObj = {
|
||||
label: this._getLabel(),
|
||||
value: this.pickerValue,
|
||||
cityCode: this._getCityCode(),
|
||||
areaCode: this._getAreaCode(),
|
||||
provinceCode: this._getProvinceCode(),
|
||||
labelArr:this._getLabel().split('-')
|
||||
};
|
||||
console.log(this._getLabel().split('-'));
|
||||
this.$emit(emitName, pickObj);
|
||||
},
|
||||
_getLabel() {
|
||||
let pcikerLabel =
|
||||
this.provinceDataList[this.pickerValue[0]].label + '-' + this.cityDataList[this.pickerValue[1]].label + '-' + this.areaDataList[this.pickerValue[2]].label;
|
||||
return pcikerLabel;
|
||||
},
|
||||
_getCityCode() {
|
||||
return this.cityDataList[this.pickerValue[1]].value;
|
||||
},
|
||||
_getProvinceCode() {
|
||||
return this.provinceDataList[this.pickerValue[0]].value;
|
||||
},
|
||||
_getAreaCode() {
|
||||
return this.areaDataList[this.pickerValue[2]].value;
|
||||
},
|
||||
queryIndex(params = [], type = 'value') {
|
||||
// params = [ 11 ,1101,110101 ];
|
||||
// 1.获取省份的index
|
||||
let provinceIndex = provinceData.findIndex(res => res[type] == params[0]);
|
||||
let cityIndex = cityData[provinceIndex].findIndex(res => res[type] == params[1]);
|
||||
let areaIndex = areaData[provinceIndex][cityIndex].findIndex(res => res[type] == params[2]);
|
||||
return {
|
||||
index: [provinceIndex, cityIndex, areaIndex],
|
||||
data: {
|
||||
province: provinceData[provinceIndex],
|
||||
city: cityData[provinceIndex][cityIndex],
|
||||
area: areaData[cityIndex][0][areaIndex]
|
||||
}
|
||||
};
|
||||
},
|
||||
clear() {},
|
||||
hideMask() {
|
||||
this._$emit('onCancel');
|
||||
this.close();
|
||||
},
|
||||
pickerCancel() {
|
||||
this._$emit('onCancel');
|
||||
this.close();
|
||||
},
|
||||
pickerConfirm() {
|
||||
this._$emit('onConfirm');
|
||||
this.close();
|
||||
},
|
||||
open() {
|
||||
this.showPopup = true;
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
this.ani = 'simple-' + this.type;
|
||||
}, 100);
|
||||
});
|
||||
},
|
||||
close(type) {
|
||||
if (!this.maskClick && type) return;
|
||||
this.ani = '';
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
this.showPopup = false;
|
||||
}, 300);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.simple-address {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.simple-address-mask {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
|
||||
transition-property: opacity;
|
||||
transition-duration: 0.3s;
|
||||
opacity: 0;
|
||||
/* #ifndef APP-NVUE */
|
||||
z-index: 99;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.mask-ani {
|
||||
transition-property: opacity;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
.simple-bottom-mask {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.simple-center-mask {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.simple-address--fixed {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
transition-property: transform;
|
||||
transition-duration: 0.3s;
|
||||
transform: translateY(460rpx);
|
||||
/* #ifndef APP-NVUE */
|
||||
z-index: 99;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.simple-address-content {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.simple-content-bottom {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
transform: translateY(500rpx);
|
||||
}
|
||||
|
||||
.content-ani {
|
||||
transition-property: transform, opacity;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
.simple-bottom-content {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.simple-center-content {
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.simple-address__header {
|
||||
position: relative;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: space-between;
|
||||
border-bottom-color: #f2f2f2;
|
||||
border-bottom-style: solid;
|
||||
border-bottom-width: 1rpx;
|
||||
}
|
||||
|
||||
.simple-address--fixed-top {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
border-top-color: $uni-border-color;
|
||||
border-top-style: solid;
|
||||
border-top-width: 1rpx;
|
||||
}
|
||||
|
||||
.simple-address__header-btn-box {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 70rpx;
|
||||
}
|
||||
|
||||
.simple-address__header-text {
|
||||
text-align: center;
|
||||
font-size: $uni-font-size-base;
|
||||
color: #1aad19;
|
||||
line-height: 70rpx;
|
||||
padding-left: 40rpx;
|
||||
padding-right: 40rpx;
|
||||
}
|
||||
|
||||
.simple-address__box {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.simple-address-view {
|
||||
position: relative;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
/* #ifndef APP-NVUE */
|
||||
width: 100%;
|
||||
/* #endif */
|
||||
/* #ifdef APP-NVUE */
|
||||
width: 750rpx;
|
||||
/* #endif */
|
||||
height: 408rpx;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.picker-item {
|
||||
text-align: center;
|
||||
line-height: 70rpx;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
</style>
|
||||
22
components/uni-popup/message.js
Normal file
22
components/uni-popup/message.js
Normal file
@ -0,0 +1,22 @@
|
||||
export default {
|
||||
created() {
|
||||
if (this.type === 'message') {
|
||||
// 不显示遮罩
|
||||
this.maskShow = false
|
||||
// 获取子组件对象
|
||||
this.childrenMsg = null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
customOpen() {
|
||||
if (this.childrenMsg) {
|
||||
this.childrenMsg.open()
|
||||
}
|
||||
},
|
||||
customClose() {
|
||||
if (this.childrenMsg) {
|
||||
this.childrenMsg.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
25
components/uni-popup/popup.js
Normal file
25
components/uni-popup/popup.js
Normal file
@ -0,0 +1,25 @@
|
||||
import message from './message.js';
|
||||
// 定义 type 类型:弹出类型：top/bottom/center
|
||||
const config = {
|
||||
// 顶部弹出
|
||||
top:'top',
|
||||
// 底部弹出
|
||||
bottom:'bottom',
|
||||
// 居中弹出
|
||||
center:'center',
|
||||
// 消息提示
|
||||
message:'top',
|
||||
// 对话框
|
||||
dialog:'center',
|
||||
// 分享
|
||||
share:'bottom',
|
||||
}
|
||||
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
config:config
|
||||
}
|
||||
},
|
||||
mixins: [message],
|
||||
}
|
||||
243
components/uni-popup/uni-popup-dialog.vue
Normal file
243
components/uni-popup/uni-popup-dialog.vue
Normal file
@ -0,0 +1,243 @@
|
||||
<template>
|
||||
<view class="uni-popup-dialog">
|
||||
<view class="uni-dialog-title">
|
||||
<text class="uni-dialog-title-text" :class="['uni-popup__'+dialogType]">{{title}}</text>
|
||||
</view>
|
||||
<view class="uni-dialog-content">
|
||||
<text class="uni-dialog-content-text" v-if="mode === 'base'">{{content}}</text>
|
||||
<input v-else class="uni-dialog-input" v-model="val" type="text" :placeholder="placeholder" :focus="focus" >
|
||||
</view>
|
||||
<view class="uni-dialog-button-group">
|
||||
<view class="uni-dialog-button" @click="close">
|
||||
<text class="uni-dialog-button-text">取消</text>
|
||||
</view>
|
||||
<view class="uni-dialog-button uni-border-left" @click="onOk">
|
||||
<text class="uni-dialog-button-text uni-button-color">确定</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* PopUp 弹出层-对话框样式
|
||||
* @description 弹出层-对话框样式
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
|
||||
* @property {String} value input 模式下的默认值
|
||||
* @property {String} placeholder input 模式下输入提示
|
||||
* @property {String} type = [success|warning|info|error] 主题样式
|
||||
* @value success 成功
|
||||
* @value warning 提示
|
||||
* @value info 消息
|
||||
* @value error 错误
|
||||
* @property {String} mode = [base|input] 模式、
|
||||
* @value base 基础对话框
|
||||
* @value input 可输入对话框
|
||||
* @property {String} content 对话框内容
|
||||
* @property {Boolean} beforeClose 是否拦截取消事件
|
||||
* @event {Function} confirm 点击确认按钮触发
|
||||
* @event {Function} close 点击取消按钮触发
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: "uniPopupDialog",
|
||||
props: {
|
||||
value: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
placeholder: {
|
||||
type: [String, Number],
|
||||
default: '请输入内容'
|
||||
},
|
||||
/**
|
||||
* 对话框主题 success/warning/info/error 默认 success
|
||||
*/
|
||||
type: {
|
||||
type: String,
|
||||
default: 'error'
|
||||
},
|
||||
/**
|
||||
* 对话框模式 base/input
|
||||
*/
|
||||
mode: {
|
||||
type: String,
|
||||
default: 'base'
|
||||
},
|
||||
/**
|
||||
* 对话框标题
|
||||
*/
|
||||
title: {
|
||||
type: String,
|
||||
default: '提示'
|
||||
},
|
||||
/**
|
||||
* 对话框内容
|
||||
*/
|
||||
content: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
/**
|
||||
* 拦截取消事件 ，如果拦截取消事件，必须监听close事件，执行 done()
|
||||
*/
|
||||
beforeClose: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogType: 'error',
|
||||
focus: false,
|
||||
val: ""
|
||||
}
|
||||
},
|
||||
inject: ['popup'],
|
||||
watch: {
|
||||
type(val) {
|
||||
this.dialogType = val
|
||||
},
|
||||
mode(val) {
|
||||
if (val === 'input') {
|
||||
this.dialogType = 'info'
|
||||
}
|
||||
},
|
||||
value(val) {
|
||||
this.val = val
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 对话框遮罩不可点击
|
||||
this.popup.mkclick = false
|
||||
if (this.mode === 'input') {
|
||||
this.dialogType = 'info'
|
||||
this.val = this.value
|
||||
} else {
|
||||
this.dialogType = this.type
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.focus = true
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 点击确认按钮
|
||||
*/
|
||||
onOk() {
|
||||
this.$emit('confirm', () => {
|
||||
this.popup.close()
|
||||
if (this.mode === 'input') this.val = this.value
|
||||
}, this.mode === 'input' ? this.val : '')
|
||||
},
|
||||
/**
|
||||
* 点击取消按钮
|
||||
*/
|
||||
close() {
|
||||
if (this.beforeClose) {
|
||||
this.$emit('close', () => {
|
||||
this.popup.close()
|
||||
})
|
||||
return
|
||||
}
|
||||
this.popup.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.uni-popup-dialog {
|
||||
width: 300px;
|
||||
border-radius: 15px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.uni-dialog-title {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding-top: 15px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.uni-dialog-title-text {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.uni-dialog-content {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 5px 15px 15px 15px;
|
||||
}
|
||||
|
||||
.uni-dialog-content-text {
|
||||
font-size: 14px;
|
||||
color: #6e6e6e;
|
||||
}
|
||||
|
||||
.uni-dialog-button-group {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
border-top-color: #f5f5f5;
|
||||
border-top-style: solid;
|
||||
border-top-width: 1px;
|
||||
}
|
||||
|
||||
.uni-dialog-button {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
|
||||
flex: 1;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.uni-border-left {
|
||||
border-left-color: #f0f0f0;
|
||||
border-left-style: solid;
|
||||
border-left-width: 1px;
|
||||
}
|
||||
|
||||
.uni-dialog-button-text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.uni-button-color {
|
||||
color: $uni-color-primary;
|
||||
}
|
||||
|
||||
.uni-dialog-input {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.uni-popup__success {
|
||||
color: $uni-color-success;
|
||||
}
|
||||
|
||||
.uni-popup__warn {
|
||||
color: $uni-color-warning;
|
||||
}
|
||||
|
||||
.uni-popup__error {
|
||||
color: $uni-color-error;
|
||||
}
|
||||
|
||||
.uni-popup__info {
|
||||
color: #909399;
|
||||
}
|
||||
</style>
|
||||
116
components/uni-popup/uni-popup-message.vue
Normal file
116
components/uni-popup/uni-popup-message.vue
Normal file
@ -0,0 +1,116 @@
|
||||
<template>
|
||||
<view class="uni-popup-message" :class="'uni-popup__'+[type]">
|
||||
<text class="uni-popup-message-text" :class="'uni-popup__'+[type]+'-text'">{{message}}</text>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
/**
|
||||
* PopUp 弹出层-消息提示
|
||||
* @description 弹出层-消息提示
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
|
||||
* @property {String} type = [success|warning|info|error] 主题样式
|
||||
* @value success 成功
|
||||
* @value warning 提示
|
||||
* @value info 消息
|
||||
* @value error 错误
|
||||
* @property {String} message 消息提示文字
|
||||
* @property {String} duration 显示时间，设置为 0 则不会自动关闭
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: 'UniPopupMessage',
|
||||
props: {
|
||||
/**
|
||||
* 主题 success/warning/info/error 默认 success
|
||||
*/
|
||||
type: {
|
||||
type: String,
|
||||
default: 'success'
|
||||
},
|
||||
/**
|
||||
* 消息文字
|
||||
*/
|
||||
message: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
/**
|
||||
* 显示时间，设置为 0 则不会自动关闭
|
||||
*/
|
||||
duration: {
|
||||
type: Number,
|
||||
default: 3000
|
||||
}
|
||||
},
|
||||
inject: ['popup'],
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
created() {
|
||||
this.popup.childrenMsg = this
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
if (this.duration === 0) return
|
||||
clearTimeout(this.popuptimer)
|
||||
this.popuptimer = setTimeout(() => {
|
||||
this.popup.close()
|
||||
}, this.duration)
|
||||
},
|
||||
close() {
|
||||
clearTimeout(this.popuptimer)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.uni-popup-message {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
background-color: #e1f3d8;
|
||||
padding: 10px 15px;
|
||||
border-color: #eee;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
}
|
||||
.uni-popup-message-text {
|
||||
font-size: 14px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.uni-popup__success {
|
||||
background-color: #e1f3d8;
|
||||
}
|
||||
|
||||
.uni-popup__success-text {
|
||||
color: #67C23A;
|
||||
}
|
||||
|
||||
.uni-popup__warn {
|
||||
background-color: #faecd8;
|
||||
}
|
||||
|
||||
.uni-popup__warn-text {
|
||||
color: #E6A23C;
|
||||
}
|
||||
|
||||
.uni-popup__error {
|
||||
background-color: #fde2e2;
|
||||
}
|
||||
|
||||
.uni-popup__error-text {
|
||||
color: #F56C6C;
|
||||
}
|
||||
|
||||
.uni-popup__info {
|
||||
background-color: #F2F6FC;
|
||||
}
|
||||
|
||||
.uni-popup__info-text {
|
||||
color: #909399;
|
||||
}
|
||||
</style>
|
||||
165
components/uni-popup/uni-popup-share.vue
Normal file
165
components/uni-popup/uni-popup-share.vue
Normal file
@ -0,0 +1,165 @@
|
||||
<template>
|
||||
<view class="uni-popup-share">
|
||||
<view class="uni-share-title"><text class="uni-share-title-text">{{title}}</text></view>
|
||||
<view class="uni-share-content">
|
||||
<view class="uni-share-content-box">
|
||||
<view class="uni-share-content-item" v-for="(item,index) in bottomData" :key="index" @click.stop="select(item,index)">
|
||||
<image class="uni-share-image" :src="item.icon" mode="aspectFill"></image>
|
||||
<text class="uni-share-text">{{item.text}}</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="uni-share-button-box">
|
||||
<button class="uni-share-button" @click="close">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'UniPopupShare',
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
default: '分享到'
|
||||
}
|
||||
},
|
||||
inject: ['popup'],
|
||||
data() {
|
||||
return {
|
||||
bottomData: [{
|
||||
text: '微信',
|
||||
icon: 'https://img-cdn-qiniu.dcloud.net.cn/uni-ui/grid-2.png',
|
||||
name: 'wx'
|
||||
},
|
||||
{
|
||||
text: '支付宝',
|
||||
icon: 'https://img-cdn-qiniu.dcloud.net.cn/uni-ui/grid-8.png',
|
||||
name: 'wx'
|
||||
},
|
||||
{
|
||||
text: 'QQ',
|
||||
icon: 'https://img-cdn-qiniu.dcloud.net.cn/uni-ui/gird-3.png',
|
||||
name: 'qq'
|
||||
},
|
||||
{
|
||||
text: '新浪',
|
||||
icon: 'https://img-cdn-qiniu.dcloud.net.cn/uni-ui/grid-1.png',
|
||||
name: 'sina'
|
||||
},
|
||||
{
|
||||
text: '百度',
|
||||
icon: 'https://img-cdn-qiniu.dcloud.net.cn/uni-ui/grid-7.png',
|
||||
name: 'copy'
|
||||
},
|
||||
{
|
||||
text: '其他',
|
||||
icon: 'https://img-cdn-qiniu.dcloud.net.cn/uni-ui/grid-5.png',
|
||||
name: 'more'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
/**
|
||||
* 选择内容
|
||||
*/
|
||||
select(item, index) {
|
||||
this.$emit('select', {
|
||||
item,
|
||||
index
|
||||
}, () => {
|
||||
this.popup.close()
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 关闭窗口
|
||||
*/
|
||||
close() {
|
||||
this.popup.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.uni-popup-share {
|
||||
background-color: #fff;
|
||||
}
|
||||
.uni-share-title {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 40px;
|
||||
}
|
||||
.uni-share-title-text {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
.uni-share-content {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.uni-share-content-box {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
width: 360px;
|
||||
}
|
||||
|
||||
.uni-share-content-item {
|
||||
width: 90px;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 10px 0;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.uni-share-content-item:active {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.uni-share-image {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.uni-share-text {
|
||||
margin-top: 10px;
|
||||
font-size: 14px;
|
||||
color: #3B4144;
|
||||
}
|
||||
|
||||
.uni-share-button-box {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
||||
.uni-share-button {
|
||||
flex: 1;
|
||||
border-radius: 50px;
|
||||
color: #666;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.uni-share-button::after {
|
||||
border-radius: 50px;
|
||||
}
|
||||
</style>
|
||||
294
components/uni-popup/uni-popup.vue
Normal file
294
components/uni-popup/uni-popup.vue
Normal file
@ -0,0 +1,294 @@
|
||||
<template>
|
||||
<view v-if="showPopup" class="uni-popup" :class="[popupstyle]" @touchmove.stop.prevent="clear">
|
||||
<uni-transition v-if="maskShow" :mode-class="['fade']" :styles="maskClass" :duration="duration" :show="showTrans"
|
||||
@click="onTap" />
|
||||
<uni-transition :mode-class="ani" :styles="transClass" :duration="duration" :show="showTrans" @click="onTap">
|
||||
<view class="uni-popup__wrapper-box" @click.stop="clear">
|
||||
<slot />
|
||||
</view>
|
||||
</uni-transition>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uniTransition from '../uni-transition/uni-transition.vue'
|
||||
import popup from './popup.js'
|
||||
/**
|
||||
* PopUp 弹出层
|
||||
* @description 弹出层组件，为了解决遮罩弹层的问题
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
|
||||
* @property {String} type = [top|center|bottom] 弹出方式
|
||||
* @value top 顶部弹出
|
||||
* @value center 中间弹出
|
||||
* @value bottom 底部弹出
|
||||
* @value message 消息提示
|
||||
* @value dialog 对话框
|
||||
* @value share 底部分享示例
|
||||
* @property {Boolean} animation = [ture|false] 是否开启动画
|
||||
* @property {Boolean} maskClick = [ture|false] 蒙版点击是否关闭弹窗
|
||||
* @event {Function} change 打开关闭弹窗触发，e={show: false}
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: 'UniPopup',
|
||||
components: {
|
||||
uniTransition
|
||||
},
|
||||
props: {
|
||||
// 开启动画
|
||||
animation: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
|
||||
// message: 消息提示 ; dialog : 对话框
|
||||
type: {
|
||||
type: String,
|
||||
default: 'center'
|
||||
},
|
||||
// maskClick
|
||||
maskClick: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
provide() {
|
||||
return {
|
||||
popup: this
|
||||
}
|
||||
},
|
||||
mixins: [popup],
|
||||
watch: {
|
||||
/**
|
||||
* 监听type类型
|
||||
*/
|
||||
type: {
|
||||
handler: function(newVal) {
|
||||
this[this.config[newVal]]()
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
/**
|
||||
* 监听遮罩是否可点击
|
||||
* @param {Object} val
|
||||
*/
|
||||
maskClick(val) {
|
||||
this.mkclick = val
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
duration: 300,
|
||||
ani: [],
|
||||
showPopup: false,
|
||||
showTrans: false,
|
||||
maskClass: {
|
||||
'position': 'fixed',
|
||||
'bottom': 0,
|
||||
'top': 0,
|
||||
'left': 0,
|
||||
'right': 0,
|
||||
'backgroundColor': 'rgba(0, 0, 0, 0.4)'
|
||||
},
|
||||
transClass: {
|
||||
'position': 'fixed',
|
||||
'left': 0,
|
||||
'right': 0,
|
||||
},
|
||||
maskShow: true,
|
||||
mkclick: true,
|
||||
popupstyle: 'top'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.mkclick = this.maskClick
|
||||
if (this.animation) {
|
||||
this.duration = 300
|
||||
} else {
|
||||
this.duration = 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clear(e) {
|
||||
// TODO nvue 取消冒泡
|
||||
e.stopPropagation()
|
||||
},
|
||||
open() {
|
||||
this.showPopup = true
|
||||
this.$nextTick(() => {
|
||||
new Promise(resolve => {
|
||||
clearTimeout(this.timer)
|
||||
this.timer = setTimeout(() => {
|
||||
this.showTrans = true
|
||||
// fixed by mehaotian 兼容 app 端
|
||||
this.$nextTick(() => {
|
||||
resolve();
|
||||
})
|
||||
}, 50);
|
||||
}).then(res => {
|
||||
// 自定义打开事件
|
||||
clearTimeout(this.msgtimer)
|
||||
this.msgtimer = setTimeout(() => {
|
||||
this.customOpen && this.customOpen()
|
||||
}, 100)
|
||||
this.$emit('change', {
|
||||
show: true,
|
||||
type: this.type
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
close(type) {
|
||||
this.showTrans = false
|
||||
this.$nextTick(() => {
|
||||
this.$emit('change', {
|
||||
show: false,
|
||||
type: this.type
|
||||
})
|
||||
clearTimeout(this.timer)
|
||||
// 自定义关闭事件
|
||||
this.customOpen && this.customClose()
|
||||
this.timer = setTimeout(() => {
|
||||
this.showPopup = false
|
||||
}, 300)
|
||||
})
|
||||
},
|
||||
onTap() {
|
||||
if (!this.mkclick) return
|
||||
this.close()
|
||||
},
|
||||
/**
|
||||
* 顶部弹出样式处理
|
||||
*/
|
||||
top() {
|
||||
this.popupstyle = 'top'
|
||||
this.ani = ['slide-top']
|
||||
this.transClass = {
|
||||
'position': 'fixed',
|
||||
'left': 0,
|
||||
'right': 0,
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 底部弹出样式处理
|
||||
*/
|
||||
bottom() {
|
||||
this.popupstyle = 'bottom'
|
||||
this.ani = ['slide-bottom']
|
||||
this.transClass = {
|
||||
'position': 'fixed',
|
||||
'left': 0,
|
||||
'right': 0,
|
||||
'bottom': 0
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 中间弹出样式处理
|
||||
*/
|
||||
center() {
|
||||
this.popupstyle = 'center'
|
||||
this.ani = ['zoom-out', 'fade']
|
||||
this.transClass = {
|
||||
'position': 'fixed',
|
||||
/* #ifndef APP-NVUE */
|
||||
'display': 'flex',
|
||||
'flexDirection': 'column',
|
||||
/* #endif */
|
||||
'bottom': 0,
|
||||
'left': 0,
|
||||
'right': 0,
|
||||
'top': 0,
|
||||
'justifyContent': 'center',
|
||||
'alignItems': 'center'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.uni-popup {
|
||||
position: fixed;
|
||||
/* #ifndef APP-NVUE */
|
||||
z-index: 99;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-popup__mask {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: $uni-bg-color-mask;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.mask-ani {
|
||||
transition-property: opacity;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
.uni-top-mask {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.uni-bottom-mask {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.uni-center-mask {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.uni-popup__wrapper {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: block;
|
||||
/* #endif */
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.top {
|
||||
/* #ifdef H5 */
|
||||
top: var(--window-top);
|
||||
/* #endif */
|
||||
/* #ifndef H5 */
|
||||
top: 0;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.bottom {
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.uni-popup__wrapper-box {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: block;
|
||||
/* #endif */
|
||||
position: relative;
|
||||
/* iphonex 等安全区设置，底部安全区适配 */
|
||||
/* #ifndef APP-NVUE */
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.content-ani {
|
||||
// transition: transform 0.3s;
|
||||
transition-property: transform, opacity;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
|
||||
.uni-top-content {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.uni-bottom-content {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.uni-center-content {
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
279
components/uni-transition/uni-transition.vue
Normal file
279
components/uni-transition/uni-transition.vue
Normal file
@ -0,0 +1,279 @@
|
||||
<template>
|
||||
<view v-if="isShow" ref="ani" class="uni-transition" :class="[ani.in]" :style="'transform:' +transform+';'+stylesObject"
|
||||
@click="change">
|
||||
<slot></slot>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// #ifdef APP-NVUE
|
||||
const animation = uni.requireNativePlugin('animation');
|
||||
// #endif
|
||||
/**
|
||||
* Transition 过渡动画
|
||||
* @description 简单过渡动画组件
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=985
|
||||
* @property {Boolean} show = [false|true] 控制组件显示或隐藏
|
||||
* @property {Array} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
|
||||
* @value fade 渐隐渐出过渡
|
||||
* @value slide-top 由上至下过渡
|
||||
* @value slide-right 由右至左过渡
|
||||
* @value slide-bottom 由下至上过渡
|
||||
* @value slide-left 由左至右过渡
|
||||
* @value zoom-in 由小到大过渡
|
||||
* @value zoom-out 由大到小过渡
|
||||
* @property {Number} duration 过渡动画持续时间
|
||||
* @property {Object} styles 组件样式，同 css 样式，注意带’-‘连接符的属性需要使用小驼峰写法如：`backgroundColor:red`
|
||||
*/
|
||||
export default {
|
||||
name: 'uniTransition',
|
||||
props: {
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
modeClass: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
duration: {
|
||||
type: Number,
|
||||
default: 300
|
||||
},
|
||||
styles: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isShow: false,
|
||||
transform: '',
|
||||
ani: { in: '',
|
||||
active: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
show: {
|
||||
handler(newVal) {
|
||||
if (newVal) {
|
||||
this.open()
|
||||
} else {
|
||||
this.close()
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
stylesObject() {
|
||||
let styles = {
|
||||
...this.styles,
|
||||
'transition-duration': this.duration / 1000 + 's'
|
||||
}
|
||||
let transfrom = ''
|
||||
for (let i in styles) {
|
||||
let line = this.toLine(i)
|
||||
transfrom += line + ':' + styles[i] + ';'
|
||||
}
|
||||
return transfrom
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// this.timer = null
|
||||
// this.nextTick = (time = 50) => new Promise(resolve => {
|
||||
// clearTimeout(this.timer)
|
||||
// this.timer = setTimeout(resolve, time)
|
||||
// return this.timer
|
||||
// });
|
||||
},
|
||||
methods: {
|
||||
change() {
|
||||
this.$emit('click', {
|
||||
detail: this.isShow
|
||||
})
|
||||
},
|
||||
open() {
|
||||
clearTimeout(this.timer)
|
||||
this.isShow = true
|
||||
this.transform = ''
|
||||
this.ani.in = ''
|
||||
for (let i in this.getTranfrom(false)) {
|
||||
if (i === 'opacity') {
|
||||
this.ani.in = 'fade-in'
|
||||
} else {
|
||||
this.transform += `${this.getTranfrom(false)[i]} `
|
||||
}
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
this._animation(true)
|
||||
}, 50)
|
||||
})
|
||||
|
||||
},
|
||||
close(type) {
|
||||
clearTimeout(this.timer)
|
||||
this._animation(false)
|
||||
},
|
||||
_animation(type) {
|
||||
let styles = this.getTranfrom(type)
|
||||
// #ifdef APP-NVUE
|
||||
if(!this.$refs['ani']) return
|
||||
animation.transition(this.$refs['ani'].ref, {
|
||||
styles,
|
||||
duration: this.duration, //ms
|
||||
timingFunction: 'ease',
|
||||
needLayout: false,
|
||||
delay: 0 //ms
|
||||
}, () => {
|
||||
if (!type) {
|
||||
this.isShow = false
|
||||
}
|
||||
this.$emit('change', {
|
||||
detail: this.isShow
|
||||
})
|
||||
})
|
||||
// #endif
|
||||
// #ifndef APP-NVUE
|
||||
this.transform = ''
|
||||
for (let i in styles) {
|
||||
if (i === 'opacity') {
|
||||
this.ani.in = `fade-${type?'out':'in'}`
|
||||
} else {
|
||||
this.transform += `${styles[i]} `
|
||||
}
|
||||
}
|
||||
this.timer = setTimeout(() => {
|
||||
if (!type) {
|
||||
this.isShow = false
|
||||
}
|
||||
this.$emit('change', {
|
||||
detail: this.isShow
|
||||
})
|
||||
|
||||
}, this.duration)
|
||||
// #endif
|
||||
|
||||
},
|
||||
getTranfrom(type) {
|
||||
let styles = {
|
||||
transform: ''
|
||||
}
|
||||
this.modeClass.forEach((mode) => {
|
||||
switch (mode) {
|
||||
case 'fade':
|
||||
styles.opacity = type ? 1 : 0
|
||||
break;
|
||||
case 'slide-top':
|
||||
styles.transform += `translateY(${type?'0':'-100%'}) `
|
||||
break;
|
||||
case 'slide-right':
|
||||
styles.transform += `translateX(${type?'0':'100%'}) `
|
||||
break;
|
||||
case 'slide-bottom':
|
||||
styles.transform += `translateY(${type?'0':'100%'}) `
|
||||
break;
|
||||
case 'slide-left':
|
||||
styles.transform += `translateX(${type?'0':'-100%'}) `
|
||||
break;
|
||||
case 'zoom-in':
|
||||
styles.transform += `scale(${type?1:0.8}) `
|
||||
break;
|
||||
case 'zoom-out':
|
||||
styles.transform += `scale(${type?1:1.2}) `
|
||||
break;
|
||||
}
|
||||
})
|
||||
return styles
|
||||
},
|
||||
_modeClassArr(type) {
|
||||
let mode = this.modeClass
|
||||
if (typeof(mode) !== "string") {
|
||||
let modestr = ''
|
||||
mode.forEach((item) => {
|
||||
modestr += (item + '-' + type + ',')
|
||||
})
|
||||
return modestr.substr(0, modestr.length - 1)
|
||||
} else {
|
||||
return mode + '-' + type
|
||||
}
|
||||
},
|
||||
// getEl(el) {
|
||||
// console.log(el || el.ref || null);
|
||||
// return el || el.ref || null
|
||||
// },
|
||||
toLine(name) {
|
||||
return name.replace(/([A-Z])/g, "-$1").toLowerCase();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.uni-transition {
|
||||
transition-timing-function: ease;
|
||||
transition-duration: 0.3s;
|
||||
transition-property: transform, opacity;
|
||||
}
|
||||
|
||||
.fade-in {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.fade-active {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.slide-top-in {
|
||||
/* transition-property: transform, opacity; */
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
|
||||
.slide-top-active {
|
||||
transform: translateY(0);
|
||||
/* opacity: 1; */
|
||||
}
|
||||
|
||||
.slide-right-in {
|
||||
transform: translateX(100%);
|
||||
}
|
||||
|
||||
.slide-right-active {
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.slide-bottom-in {
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
.slide-bottom-active {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.slide-left-in {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
.slide-left-active {
|
||||
transform: translateX(0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.zoom-in-in {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
|
||||
.zoom-out-active {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.zoom-out-in {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
</style>
|
||||
5
package-lock.json
generated
5
package-lock.json
generated
@ -18,6 +18,11 @@
|
||||
"version": "1.8.22",
|
||||
"resolved": "https://registry.npm.taobao.org/dayjs/download/dayjs-1.8.22.tgz",
|
||||
"integrity": "sha1-XoNdd2s3PiFmeL6NEsM22nGiWpw="
|
||||
},
|
||||
"vue-ydui": {
|
||||
"version": "1.2.6",
|
||||
"resolved": "https://registry.npm.taobao.org/vue-ydui/download/vue-ydui-1.2.6.tgz",
|
||||
"integrity": "sha1-GQZItGcjkXAEpMJKe+/TzWnWQ1U="
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -12,6 +12,7 @@
|
||||
"dependencies": {
|
||||
"animate.css": "^3.7.2",
|
||||
"async-validator": "^3.2.4",
|
||||
"dayjs": "^1.8.22"
|
||||
"dayjs": "^1.8.22",
|
||||
"vue-ydui": "^1.2.6"
|
||||
}
|
||||
}
|
||||
|
||||
@ -370,7 +370,7 @@ export default {
|
||||
getBargainDetail(that.bargainId)
|
||||
.then(res => {
|
||||
that.bargain = res.data.bargain;
|
||||
that.datatime = that.bargain.stopTime;
|
||||
that.datatime = that.bargain.stopTime / 1000;
|
||||
that.getBargainHelpCount();
|
||||
})
|
||||
.catch(res => {
|
||||
@ -573,32 +573,32 @@ page {
|
||||
background-color: #eb3729;
|
||||
}
|
||||
.bargainBnt_hui {
|
||||
font-size: 0.3*100rpx;
|
||||
font-size: 0.3 * 100rpx;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
width: 6*100rpx;
|
||||
height: 0.8*100rpx;
|
||||
border-radius: 0.4*100rpx;
|
||||
width: 6 * 100rpx;
|
||||
height: 0.8 * 100rpx;
|
||||
border-radius: 0.4 * 100rpx;
|
||||
background: #bbb;
|
||||
text-align: center;
|
||||
line-height: 0.8*100rpx;
|
||||
margin-top: 0.32*100rpx;
|
||||
line-height: 0.8 * 100rpx;
|
||||
margin-top: 0.32 * 100rpx;
|
||||
}
|
||||
.bargain_view {
|
||||
left:0;
|
||||
right:0;
|
||||
height: 0.48*100rpx;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 0.48 * 100rpx;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
opacity: 1;
|
||||
border-radius: 0 0 0.06*100rpx 0.06*100rpx;
|
||||
border-radius: 0 0 0.06 * 100rpx 0.06 * 100rpx;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
font-size: 0.22*100rpx;
|
||||
font-size: 0.22 * 100rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
line-height: 0.48*100rpx;
|
||||
line-height: 0.48 * 100rpx;
|
||||
}
|
||||
.iconfonts {
|
||||
font-size: 0.22*100rpx;
|
||||
font-size: 0.22 * 100rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,8 +1,5 @@
|
||||
<template>
|
||||
<view class="group-list" ref="container">
|
||||
<!-- <view class="header">
|
||||
<image src="@/static/images/group.png" class="image" />
|
||||
</view>-->
|
||||
<view class="list" v-if="combinationList.length>0">
|
||||
<view
|
||||
class="item acea-row row-between-wrapper"
|
||||
|
||||
@ -27,7 +27,7 @@
|
||||
:hourText="' : '"
|
||||
:minuteText="' : '"
|
||||
:secondText="false"
|
||||
:datatime="pinkT.stopTime"
|
||||
:datatime="pinkT.stopTime/1000"
|
||||
></count-down>
|
||||
<text>结束</text>
|
||||
</view>
|
||||
@ -155,7 +155,8 @@ export default {
|
||||
})
|
||||
.catch(err => {
|
||||
uni.showToast({
|
||||
title: err.msg || err.response.data.msg|| err.response.data.message,
|
||||
title:
|
||||
err.msg || err.response.data.msg || err.response.data.message,
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
@ -239,8 +240,8 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.tips-warp{
|
||||
text-align: center;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.tips-warp {
|
||||
text-align: center;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -245,11 +245,6 @@
|
||||
that.$set(that, 'banner', res.data.banner);
|
||||
that.$set(that, 'menus', res.data.menus);
|
||||
that.$set(that, 'roll', res.data.roll);
|
||||
that.$set(that, 'activity', res.data.activity);
|
||||
if(res.data.activity){
|
||||
var activityOne = res.data.activity.shift();
|
||||
that.$set(that, 'activityOne', activityOne);
|
||||
}
|
||||
that.$set(that, 'info', res.data.info);
|
||||
that.$set(that, 'firstList', res.data.firstList);
|
||||
that.$set(that, 'bastList', res.data.bastList);
|
||||
@ -269,6 +264,7 @@
|
||||
}
|
||||
},
|
||||
goGoodSearch() {
|
||||
// this.$yrouter.push('/pages/shop/GoodsEvaluate/index');
|
||||
this.$yrouter.push('/pages/shop/GoodSearch/index');
|
||||
},
|
||||
goWxappUrl(item) {
|
||||
|
||||
@ -41,6 +41,12 @@
|
||||
<view class="iconfont icon-jiantou"></view>
|
||||
</view>
|
||||
</view>
|
||||
<div class="attribute acea-row row-between-wrapper">
|
||||
<div>
|
||||
运费：<span class="atterTxt">{{ tempName }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="attribute acea-row row-between-wrapper" @click="selecAttrTap">
|
||||
<view>
|
||||
<text>{{ attrTxt }}：</text>
|
||||
@ -268,6 +274,8 @@ export default {
|
||||
systemStore: {},
|
||||
qqmapsdk: null,
|
||||
productConClass: "product-con",
|
||||
tempName: '全国包邮'
|
||||
|
||||
};
|
||||
},
|
||||
computed: mapGetters(["isLogin", "location"]),
|
||||
@ -356,6 +364,7 @@ export default {
|
||||
that.reply = res.data.reply ? [res.data.reply] : [];
|
||||
that.$set(that, "reply", that.reply);
|
||||
that.$set(that, "priceName", res.data.priceName);
|
||||
that.$set(that, "tempName", res.data.tempName);
|
||||
that.posterData.image = that.storeInfo.image;
|
||||
if (that.storeInfo.storeName.length > 30) {
|
||||
that.posterData.title =
|
||||
|
||||
@ -1,226 +1,199 @@
|
||||
<template>
|
||||
<view class="evaluate-con">
|
||||
<view class="goodsStyle acea-row row-between" v-if="orderCon.productInfo">
|
||||
<view class="pictrue">
|
||||
<image :src="orderCon.productInfo.image" class="image" />
|
||||
</view>
|
||||
<view class="text acea-row row-between">
|
||||
<view class="name line2">{{ orderCon.productInfo.storeName }}</view>
|
||||
<view class="money">
|
||||
<view>￥{{ orderCon.productInfo.price }}</view>
|
||||
<view class="num">x{{ orderCon.cartNum }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="score">
|
||||
<view class="item acea-row row-middle" v-for="(item, scoreListIndexw) in scoreList" :key="scoreListIndexw">
|
||||
<view>{{ item.name }}</view>
|
||||
<view class="starsList">
|
||||
<text @click="stars(starsIndexn, scoreListIndexw)" v-for="(itemn, starsIndexn) in item.stars" :key="starsIndexn"
|
||||
class="iconfont" :class="
|
||||
item.index >= starsIndexn
|
||||
? 'icon-shitixing font-color-red'
|
||||
: 'icon-kongxinxing'
|
||||
"></text>
|
||||
</view>
|
||||
<text class="evaluate">
|
||||
{{
|
||||
item.index === -1 ? "" : item.index + 1 + "分"
|
||||
}}
|
||||
</text>
|
||||
</view>
|
||||
<view class="textarea">
|
||||
<textarea placeholder="商品满足你的期待么？说说你的想法，分享给想买的他们吧~" v-model="expect"></textarea>
|
||||
<view class="list acea-row row-middle">
|
||||
<view class="pictrue" v-for="(item, uploadPicturesIndex) in uploadPictures" :key="uploadPicturesIndex">
|
||||
<image :src="item" />
|
||||
<text class="iconfont icon-guanbi1 font-color-red" @click="uploadPictures.splice(uploadPicturesIndex, 1)"></text>
|
||||
</view>
|
||||
<!-- <VueCoreImageUpload
|
||||
class="btn btn-primary"
|
||||
:crop="false"
|
||||
compress="80"
|
||||
@imageuploaded="imageuploaded"
|
||||
:headers="headers"
|
||||
:max-file-size="5242880"
|
||||
:credentials="false"
|
||||
inputAccept="image/*"
|
||||
inputOfFile="file"
|
||||
:url="url"
|
||||
v-if="uploadPictures.length < 8"
|
||||
<view class="evaluate-con">
|
||||
<view class="goodsStyle acea-row row-between" v-if="orderCon.productInfo">
|
||||
<view class="pictrue">
|
||||
<image :src="orderCon.productInfo.image" class="image" />
|
||||
</view>
|
||||
<view class="text acea-row row-between">
|
||||
<view class="name line2">{{ orderCon.productInfo.storeName }}</view>
|
||||
<view class="money">
|
||||
<view>￥{{ orderCon.productInfo.price }}</view>
|
||||
<view class="num">x{{ orderCon.cartNum }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="score">
|
||||
<view
|
||||
class="item acea-row row-middle"
|
||||
v-for="(item, scoreListIndexw) in scoreList"
|
||||
:key="scoreListIndexw"
|
||||
>
|
||||
<view>{{ item.name }}</view>
|
||||
<view class="starsList">
|
||||
<text
|
||||
@click="stars(starsIndexn, scoreListIndexw)"
|
||||
v-for="(itemn, starsIndexn) in item.stars"
|
||||
:key="starsIndexn"
|
||||
class="iconfont"
|
||||
:class="item.index >= starsIndexn ? 'icon-shitixing font-color-red': 'icon-kongxinxing'"
|
||||
></text>
|
||||
</view>
|
||||
<text class="evaluate">{{item.index === -1 ? "" : item.index + 1 + "分"}}</text>
|
||||
</view>
|
||||
<view class="textarea">
|
||||
<textarea placeholder="商品满足你的期待么？说说你的想法，分享给想买的他们吧~" v-model="expect"></textarea>
|
||||
<view class="list acea-row row-middle">
|
||||
<view
|
||||
class="pictrue"
|
||||
v-for="(item, uploadPicturesIndex) in uploadPictures"
|
||||
:key="uploadPicturesIndex"
|
||||
>
|
||||
<view
|
||||
class="pictrue uploadBnt acea-row row-center-wrapper row-column"
|
||||
>
|
||||
<text class="iconfont icon-icon25201"></text>
|
||||
<view>上传图片</view>
|
||||
</view>
|
||||
</VueCoreImageUpload>-->
|
||||
</view>
|
||||
</view>
|
||||
<view class="evaluateBnt bg-color-red" @click="submit">立即评价</view>
|
||||
</view>
|
||||
</view>
|
||||
<image :src="item" />
|
||||
<text
|
||||
class="iconfont icon-guanbi1 font-color-red"
|
||||
@click="uploadPictures.splice(uploadPicturesIndex, 1)"
|
||||
></text>
|
||||
</view>
|
||||
<view class="pictrue uploadBnt acea-row row-center-wrapper row-column" @tap="chooseImage">
|
||||
<text class="iconfont icon-icon25201"></text>
|
||||
<view>上传图片</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="evaluateBnt bg-color-red" @click="submit">立即评价</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="less">
|
||||
.evaluate-con .score .textarea .list .pictrue.uploadBnt {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
.evaluate-con .score .textarea .list .pictrue.uploadBnt {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import {
|
||||
postOrderProduct,
|
||||
postOrderComment
|
||||
} from "@/api/store";
|
||||
import {
|
||||
trim
|
||||
} from "@/utils";
|
||||
import {
|
||||
VUE_APP_API_URL
|
||||
} from "@/config";
|
||||
import {
|
||||
required
|
||||
} from "@/utils/validate";
|
||||
import {
|
||||
validatorDefaultCatch
|
||||
} from "@/utils/dialog";
|
||||
import { postOrderProduct, postOrderComment } from "@/api/store";
|
||||
import { trim, chooseImage } from "@/utils";
|
||||
import { VUE_APP_API_URL } from "@/config";
|
||||
import { required } from "@/utils/validate";
|
||||
import { validatorDefaultCatch } from "@/utils/dialog";
|
||||
|
||||
const NAME = "GoodsEvaluate";
|
||||
const NAME = "GoodsEvaluate";
|
||||
|
||||
export default {
|
||||
name: NAME,
|
||||
components: {
|
||||
// VueCoreImageUpload
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
orderCon: {
|
||||
cartProduct: {
|
||||
productInfo: {}
|
||||
}
|
||||
},
|
||||
scoreList: [{
|
||||
name: "商品质量",
|
||||
stars: ["", "", "", "", ""],
|
||||
index: -1
|
||||
},
|
||||
{
|
||||
name: "服务态度",
|
||||
stars: ["", "", "", "", ""],
|
||||
index: -1
|
||||
}
|
||||
],
|
||||
url: `${VUE_APP_API_URL}/api/qiNiuContent`,
|
||||
headers: {
|
||||
Authorization: "Bearer " + this.$store.state.token
|
||||
},
|
||||
uploadPictures: [],
|
||||
expect: "",
|
||||
unique: ""
|
||||
};
|
||||
},
|
||||
mounted: function() {
|
||||
this.unique = this.$yroute.query.id;
|
||||
this.getOrderProduct();
|
||||
},
|
||||
watch: {
|
||||
$yroute(n) {
|
||||
if (n.name === NAME && this.unique !== n.params.id) {
|
||||
this.unique = n.params.id;
|
||||
this.$set(this.scoreList[0], "index", -1);
|
||||
this.$set(this.scoreList[1], "index", -1);
|
||||
this.expect = "";
|
||||
this.uploadPictures = [];
|
||||
this.getOrderProduct();
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getOrderProduct: function() {
|
||||
let that = this,
|
||||
unique = that.unique;
|
||||
postOrderProduct(unique).then(res => {
|
||||
that.orderCon = res.data;
|
||||
});
|
||||
},
|
||||
stars: function(indexn, indexw) {
|
||||
this.scoreList[indexw].index = indexn;
|
||||
},
|
||||
imageuploaded(res) {
|
||||
if (res.errno !== 0) {
|
||||
uni.showToast({
|
||||
title: res.msg || "上传图片失败",
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
return
|
||||
}
|
||||
this.uploadPictures.push(res.data[0]);
|
||||
},
|
||||
async submit() {
|
||||
const expect = trim(this.expect),
|
||||
product_score =
|
||||
this.scoreList[0].index + 1 === 0 ? "" : this.scoreList[0].index + 1,
|
||||
service_score =
|
||||
this.scoreList[1].index + 1 === 0 ? "" : this.scoreList[1].index + 1;
|
||||
try {
|
||||
await this.$validator({
|
||||
product_score: [
|
||||
required("请选择商品质量分数", {
|
||||
type: "number"
|
||||
})
|
||||
],
|
||||
service_score: [
|
||||
required("请选择服务态度分数", {
|
||||
type: "number"
|
||||
})
|
||||
]
|
||||
}).validate({
|
||||
product_score,
|
||||
service_score
|
||||
});
|
||||
} catch (e) {
|
||||
return validatorDefaultCatch(e);
|
||||
}
|
||||
postOrderComment({
|
||||
productScore: product_score,
|
||||
serviceScore: service_score,
|
||||
unique: this.unique,
|
||||
pics: this.uploadPictures.join(","),
|
||||
comment: expect
|
||||
})
|
||||
.then(() => {
|
||||
uni.showToast({
|
||||
title: "评价成功",
|
||||
icon: "success",
|
||||
duration: 2000
|
||||
});
|
||||
|
||||
// ? 回跳到上一页
|
||||
this.$yrouter.back()
|
||||
|
||||
// ? 默认跳转到详情页
|
||||
// this.$yrouter.push({
|
||||
// path: "/pages/order/OrderDetails/index",
|
||||
// query: {
|
||||
// id: this.orderCon.orderId
|
||||
// }
|
||||
// });
|
||||
|
||||
// ? 可选重定向到详情页，这时左上角会有一个返回首页的图标
|
||||
// this.$yrouter.reLaunch({
|
||||
// path: "/pages/home/index",
|
||||
// });
|
||||
})
|
||||
.catch(err => {
|
||||
uni.showToast({
|
||||
title: err.msg || err.response.data.msg|| err.response.data.message,
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
export default {
|
||||
name: NAME,
|
||||
components: {
|
||||
// VueCoreImageUpload
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
orderCon: {
|
||||
cartProduct: {
|
||||
productInfo: {}
|
||||
}
|
||||
},
|
||||
scoreList: [
|
||||
{
|
||||
name: "商品质量",
|
||||
stars: ["", "", "", "", ""],
|
||||
index: -1
|
||||
},
|
||||
{
|
||||
name: "服务态度",
|
||||
stars: ["", "", "", "", ""],
|
||||
index: -1
|
||||
}
|
||||
],
|
||||
uploadPictures: [],
|
||||
expect: "",
|
||||
unique: ""
|
||||
};
|
||||
},
|
||||
mounted: function() {
|
||||
this.unique = this.$yroute.query.id;
|
||||
this.getOrderProduct();
|
||||
},
|
||||
watch: {
|
||||
$yroute(n) {
|
||||
if (n.name === NAME && this.unique !== n.params.id) {
|
||||
this.unique = n.params.id;
|
||||
this.$set(this.scoreList[0], "index", -1);
|
||||
this.$set(this.scoreList[1], "index", -1);
|
||||
this.expect = "";
|
||||
this.uploadPictures = [];
|
||||
this.getOrderProduct();
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getOrderProduct: function() {
|
||||
let that = this,
|
||||
unique = that.unique;
|
||||
postOrderProduct(unique).then(res => {
|
||||
that.orderCon = res.data;
|
||||
});
|
||||
},
|
||||
stars: function(indexn, indexw) {
|
||||
this.scoreList[indexw].index = indexn;
|
||||
},
|
||||
chooseImage() {
|
||||
chooseImage(img => {
|
||||
this.uploadPictures.push(img);
|
||||
});
|
||||
},
|
||||
async submit() {
|
||||
const expect = trim(this.expect),
|
||||
product_score =
|
||||
this.scoreList[0].index + 1 === 0 ? "" : this.scoreList[0].index + 1,
|
||||
service_score =
|
||||
this.scoreList[1].index + 1 === 0 ? "" : this.scoreList[1].index + 1;
|
||||
try {
|
||||
await this.$validator({
|
||||
product_score: [
|
||||
required("请选择商品质量分数", {
|
||||
type: "number"
|
||||
})
|
||||
],
|
||||
service_score: [
|
||||
required("请选择服务态度分数", {
|
||||
type: "number"
|
||||
})
|
||||
]
|
||||
}).validate({
|
||||
product_score,
|
||||
service_score
|
||||
});
|
||||
} catch (e) {
|
||||
return validatorDefaultCatch(e);
|
||||
}
|
||||
postOrderComment({
|
||||
productScore: product_score,
|
||||
serviceScore: service_score,
|
||||
unique: this.unique,
|
||||
pics: this.uploadPictures.join(","),
|
||||
comment: expect
|
||||
})
|
||||
.then(() => {
|
||||
uni.showToast({
|
||||
title: "评价成功",
|
||||
icon: "success",
|
||||
duration: 2000
|
||||
});
|
||||
|
||||
// ? 回跳到上一页
|
||||
this.$yrouter.back();
|
||||
|
||||
// ? 默认跳转到详情页
|
||||
// this.$yrouter.push({
|
||||
// path: "/pages/order/OrderDetails/index",
|
||||
// query: {
|
||||
// id: this.orderCon.orderId
|
||||
// }
|
||||
// });
|
||||
|
||||
// ? 可选重定向到详情页，这时左上角会有一个返回首页的图标
|
||||
// this.$yrouter.reLaunch({
|
||||
// path: "/pages/home/index",
|
||||
// });
|
||||
})
|
||||
.catch(err => {
|
||||
uni.showToast({
|
||||
title:
|
||||
err.msg || err.response.data.msg || err.response.data.message,
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -1,57 +1,24 @@
|
||||
<template>
|
||||
<view class="personal-data">
|
||||
<view class="wrapper">
|
||||
<view class="title">管理我的账号</view>
|
||||
<view class="wrapList">
|
||||
<view
|
||||
class="item acea-row row-between-wrapper"
|
||||
:class="item.uid === userInfo.uid ? 'on' : ''"
|
||||
v-for="(item, switchUserInfoIndex) in switchUserInfo"
|
||||
:key="switchUserInfoIndex"
|
||||
>
|
||||
<view class="item acea-row row-between-wrapper on">
|
||||
<view class="picTxt acea-row row-between-wrapper">
|
||||
<view class="pictrue">
|
||||
<!-- <VueCoreImageUpload
|
||||
class="btn btn-primary"
|
||||
:crop="false"
|
||||
compress="80"
|
||||
@imageuploaded="imageuploaded"
|
||||
:headers="headers"
|
||||
:max-file-size="5242880"
|
||||
:credentials="false"
|
||||
inputAccept="image/*"
|
||||
inputOfFile="file"
|
||||
:url="url"
|
||||
ref="upImg"
|
||||
v-if="item.uid === userInfo.uid"
|
||||
>
|
||||
<view class="pictrue">
|
||||
<image :src="item.avatar" />
|
||||
</view>
|
||||
</VueCoreImageUpload>-->
|
||||
<!-- <view class="pictrue" v-else>
|
||||
<image :src="item.avatar" />
|
||||
</view>-->
|
||||
<image
|
||||
src="@/static/images/alter.png"
|
||||
class="alter"
|
||||
v-if="item.uid === userInfo.uid"
|
||||
/>
|
||||
<view class="pictrue" @tap="chooseImage">
|
||||
<div class="pictrue">
|
||||
<img :src="avatar" />
|
||||
</div>
|
||||
<image src="@/static/images/alter.png" class="alter" />
|
||||
</view>
|
||||
<view class="text">
|
||||
<view class="name line1">{{ item.nickname }}</view>
|
||||
<view class="phone">绑定手机号：{{ item.phone }}</view>
|
||||
<view class="name line1">{{ userInfo.nickname }}</view>
|
||||
<view class="phone">
|
||||
绑定手机号：
|
||||
<text v-if="userInfo.phone">{{ userInfo.phone }}</text>
|
||||
<text v-else>未绑定</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="currentBnt acea-row row-center-wrapper font-color-red"
|
||||
v-if="item.uid === userInfo.uid"
|
||||
>当前账号</view>
|
||||
<view
|
||||
class="bnt font-color-red acea-row row-center-wrapper"
|
||||
v-else
|
||||
@click="switchAccounts(index)"
|
||||
>使用账号</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -82,23 +49,26 @@
|
||||
<text>点击修改密码</text>
|
||||
<text class="iconfont icon-suozi"></text>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>-->
|
||||
</view>
|
||||
<!--<view class="modifyBnt bg-color-red" @click="submit">保存修改</view>-->
|
||||
<!-- <view
|
||||
<view class="modifyBnt bg-color-red" @click="submit">保存修改</view>
|
||||
<view
|
||||
class="logOut cart-color acea-row row-center-wrapper"
|
||||
@click="logout"
|
||||
v-if="!isWeixin"
|
||||
>
|
||||
退出登录
|
||||
</view>-->
|
||||
v-if="$deviceType=='app'"
|
||||
>退出登录</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import { mapGetters } from "vuex";
|
||||
import { trim, isWeixin } from "@/utils";
|
||||
import { trim, isWeixin, chooseImage } from "@/utils";
|
||||
import { VUE_APP_API_URL } from "@/config";
|
||||
import { postUserEdit, getLogout, switchH5Login, getUser } from "@/api/user";
|
||||
import {
|
||||
postUserEdit,
|
||||
getLogout,
|
||||
switchH5Login,
|
||||
getUserInfo
|
||||
} from "@/api/user";
|
||||
import cookie from "@/utils/store/cookie";
|
||||
import store from "@//store";
|
||||
import dayjs from "dayjs";
|
||||
@ -110,10 +80,6 @@ export default {
|
||||
},
|
||||
data: function() {
|
||||
return {
|
||||
url: `${VUE_APP_API_URL}/upload/image`,
|
||||
headers: {
|
||||
Authorization: "Bearer " + this.$store.state.token
|
||||
},
|
||||
avatar: "",
|
||||
isWeixin: false,
|
||||
currentAccounts: 0,
|
||||
@ -156,7 +122,8 @@ export default {
|
||||
.catch(err => {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: err.msg || err.response.data.msg|| err.response.data.message,
|
||||
title:
|
||||
err.msg || err.response.data.msg || err.response.data.message,
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
@ -170,7 +137,7 @@ export default {
|
||||
},
|
||||
getUserInfo: function() {
|
||||
let that = this;
|
||||
getUser().then(res => {
|
||||
getUserInfo().then(res => {
|
||||
// let switchUserInfo = res.data.switchUserInfo;
|
||||
// for (let i = 0; i < switchUserInfo.length; i++) {
|
||||
// if (switchUserInfo[i].uid == that.userInfo.uid) that.userIndex = i;
|
||||
@ -184,24 +151,18 @@ export default {
|
||||
// that.$set(this, "switchUserInfo", switchUserInfo);
|
||||
});
|
||||
},
|
||||
imageuploaded(res) {
|
||||
if (res.status !== 200) {
|
||||
uni.showToast({
|
||||
title: res.msg || res.response.data.msg,
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (this.switchUserInfo[this.userIndex] === undefined) return;
|
||||
this.$set(this.switchUserInfo[this.userIndex], "avatar", res.data.url);
|
||||
chooseImage() {
|
||||
chooseImage(img => {
|
||||
console.log(img)
|
||||
this.avatar = img;
|
||||
});
|
||||
},
|
||||
|
||||
submit: function() {
|
||||
let userInfo = this.switchUserInfo[this.userIndex];
|
||||
let userInfo = this.userInfo;
|
||||
postUserEdit({
|
||||
nickname: trim(this.userInfo.nickname),
|
||||
avatar: userInfo.avatar
|
||||
avatar: this.avatar
|
||||
}).then(
|
||||
res => {
|
||||
this.$store.dispatch("userInfo", true);
|
||||
@ -214,7 +175,8 @@ export default {
|
||||
},
|
||||
err => {
|
||||
uni.showToast({
|
||||
title: err.msg || err.response.data.msg|| err.response.data.message,
|
||||
title:
|
||||
err.msg || err.response.data.msg || err.response.data.message,
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
@ -230,8 +192,10 @@ export default {
|
||||
getLogout()
|
||||
.then(res => {
|
||||
this.$store.commit("logout");
|
||||
clearAuthStatus();
|
||||
location.href = location.origin;
|
||||
this.$yrouter.replace({
|
||||
path: "/pages/user/Login/index",
|
||||
query: {}
|
||||
});
|
||||
})
|
||||
.catch(err => {});
|
||||
} else if (res.cancel) {
|
||||
|
||||
@ -117,11 +117,7 @@
|
||||
<view class="myService">
|
||||
<view class="serviceList acea-row row-middle">
|
||||
<template v-for="(item, MyMenusIndex) in MyMenus">
|
||||
<view
|
||||
class="item"
|
||||
:key="MyMenusIndex"
|
||||
@click="goPages(MyMenusIndex)"
|
||||
>
|
||||
<view class="item" :key="MyMenusIndex" @click="goPages(MyMenusIndex)">
|
||||
<view class="pictrue">
|
||||
<image :src="item.pic" />
|
||||
</view>
|
||||
@ -133,19 +129,9 @@
|
||||
<view class="pictrue"></view>
|
||||
<view class="cell">hexiao</view>
|
||||
<text class="iconfont icon-jiantou"></text>
|
||||
</view> -->
|
||||
</view>-->
|
||||
</view>
|
||||
</view>
|
||||
<!--<view -->
|
||||
<!--class="item"-->
|
||||
<!--@click="changeswitch(true)"-->
|
||||
<!--v-if="userInfo.phone && isWeixin"-->
|
||||
<!-->-->
|
||||
<!--<view class="pictrue"><image src="@/static/images/switch.png" /></view>-->
|
||||
<!--<view>账号切换</!--<view>-->
|
||||
<!--</!--<view>-->
|
||||
<!-- </view>
|
||||
</view>-->
|
||||
</view>
|
||||
<view class="by">
|
||||
<view>
|
||||
@ -163,7 +149,7 @@
|
||||
</template>
|
||||
<script>
|
||||
import { mapState, mapGetters, mapMutations, mapActions } from "vuex";
|
||||
import { getUser, getMenuUser, bindingPhone } from "@/api/user";
|
||||
import { getUserInfo, getMenuUser, bindingPhone } from "@/api/user";
|
||||
import { isWeixin, VUE_APP_RESOURCES_URL } from "@/utils";
|
||||
import SwitchWindow from "@/components/SwitchWindow";
|
||||
import Authorization from "@/pages/authorization/index";
|
||||
@ -283,7 +269,7 @@ export default {
|
||||
},
|
||||
User: function() {
|
||||
let that = this;
|
||||
getUser().then(res => {
|
||||
getUserInfo().then(res => {
|
||||
that.user = res.data;
|
||||
that.orderStatusNum = res.data.orderStatusNum;
|
||||
});
|
||||
|
||||
@ -12,29 +12,13 @@
|
||||
<view class="item acea-row row-between-wrapper">
|
||||
<view class="name">所在地区</view>
|
||||
<view class="picker acea-row row-between-wrapper select-value form-control">
|
||||
<view class="address" @tap="openAddres">
|
||||
<!-- <picker
|
||||
@columnchange="addRessColumnchange"
|
||||
@change="changeAddress"
|
||||
range-key="name"
|
||||
mode="multiSelector"
|
||||
:range="district"
|
||||
>
|
||||
<text class="uni-input" v-if="model2">{{model2}}</text>
|
||||
<text class="uni-input" v-else>请选择地区</text>
|
||||
</picker>-->
|
||||
<text class="uni-input">{{model2||'请选择'}}</text>
|
||||
<simple-address
|
||||
ref="simpleAddress"
|
||||
:pickerValueDefault="cityPickerValueDefault"
|
||||
@onConfirm="onConfirm"
|
||||
themeColor="#007AFF"
|
||||
></simple-address>
|
||||
<!-- <view slot="right" @click.stop="show2 = true">{{ model2 || "请选择收货地址" }}</view> -->
|
||||
<!-- <vant-popup :show="show2" position="bottom" @close="closeaArea">
|
||||
<vant-area :area-list="district" columns-num="3" :columns-placeholder="['请选择', '请选择', '请选择']" title="请选择"
|
||||
@confirm="result2" />
|
||||
</vant-popup>-->
|
||||
<view class="address">
|
||||
<CitySelect
|
||||
ref="cityselect"
|
||||
:defaultValue="addressText"
|
||||
@callback="result"
|
||||
:items="district"
|
||||
></CitySelect>
|
||||
</view>
|
||||
<view class="iconfont icon-dizhi font-color-red"></view>
|
||||
</view>
|
||||
@ -57,92 +41,63 @@
|
||||
</view>
|
||||
</view>
|
||||
<view></view>
|
||||
<view class="keepBnt bg-color-red" @click="submit">立即保存</view>
|
||||
<view class="keepBnt bg-color-red" @tap="submit">立即保存</view>
|
||||
<view class="wechatAddress" v-if="isWechat && !id" @click="getAddress">导入微信地址</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script type="text/babel">
|
||||
// import { CitySelect } from "vue-ydui/dist/lib.rem/cityselect";
|
||||
// import District from "@/utils/area";
|
||||
import simpleAddress from "@/components/simple-address/simple-address.nvue";
|
||||
import { getAddress, postAddress, district } from "@/api/user";
|
||||
import CitySelect from "@/components/CitySelect";
|
||||
import { getAddress, postAddress, getCity } from "@/api/user";
|
||||
import attrs, { required, chs_phone } from "@/utils/validate";
|
||||
import { validatorDefaultCatch } from "@/utils/dialog";
|
||||
// import { openAddress } from "@/libs/wechat";
|
||||
import { isWeixin } from "@/utils";
|
||||
|
||||
export default {
|
||||
name: "AddAddress",
|
||||
components: {
|
||||
// CitySelect
|
||||
simpleAddress
|
||||
CitySelect
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show2: false,
|
||||
model2: "",
|
||||
districts: [],
|
||||
district: [],
|
||||
id: 0,
|
||||
userAddress: { isDefault: 0 },
|
||||
address: {},
|
||||
isWechat: isWeixin(),
|
||||
selectAddressValue: null,
|
||||
cityPickerValueDefault: [0, 0, 1],
|
||||
pickerText: ""
|
||||
addressText: ""
|
||||
};
|
||||
},
|
||||
mounted: function() {
|
||||
let id = this.$yroute.query.id;
|
||||
this.id = id;
|
||||
// document.title = !id ? "添加地址" : "修改地址";
|
||||
this.getUserAddress();
|
||||
district().then(res => {
|
||||
// city_list 市
|
||||
// county_list 区
|
||||
// province_list 省
|
||||
this.districts = res.data;
|
||||
});
|
||||
this.getCityList();
|
||||
},
|
||||
watch: {
|
||||
addressText(nextModel2) {
|
||||
console.log(nextModel2, 8585858585);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
openAddres() {
|
||||
// 根据 label 获取
|
||||
if (this.address.province) {
|
||||
// 这个插件有个问题，直辖市的 city 必须得是 市辖区
|
||||
try {
|
||||
let str = "市";
|
||||
let city = this.address.city;
|
||||
if (this.address.province.indexOf(str) != -1) {
|
||||
city = "市辖区";
|
||||
}
|
||||
var index = this.$refs.simpleAddress.queryIndex(
|
||||
[this.address.province, city, this.address.district],
|
||||
"label"
|
||||
);
|
||||
this.cityPickerValueDefault = index.index;
|
||||
} catch (error) {}
|
||||
}
|
||||
this.$refs.simpleAddress.open();
|
||||
|
||||
// var index = this.$refs.simpleAddress.queryIndex(
|
||||
// [13, 1302, 130203],
|
||||
// "value"
|
||||
// );
|
||||
// this.cityPickerValueDefault = index.index;
|
||||
// this.$refs.simpleAddress.open();
|
||||
},
|
||||
onConfirm(e) {
|
||||
this.pickerText = JSON.stringify(e);
|
||||
this.model2 = e.label;
|
||||
this.address.province = e.labelArr[0] || "";
|
||||
this.address.city = e.labelArr[1] || "";
|
||||
this.address.district = e.labelArr[2] || "";
|
||||
getCityList: function() {
|
||||
let that = this;
|
||||
getCity()
|
||||
.then(res => {
|
||||
that.district = res.data;
|
||||
that.ready = true;
|
||||
})
|
||||
.catch(err => {
|
||||
that.$dialog.error(err.msg);
|
||||
});
|
||||
},
|
||||
getUserAddress: function() {
|
||||
if (!this.id) return false;
|
||||
let that = this;
|
||||
getAddress(that.id).then(res => {
|
||||
that.userAddress = res.data;
|
||||
that.model2 =
|
||||
that.addressText =
|
||||
res.data.province + " " + res.data.city + " " + res.data.district;
|
||||
that.address.province = res.data.province;
|
||||
that.address.city = res.data.city;
|
||||
@ -151,9 +106,12 @@ export default {
|
||||
},
|
||||
getAddress() {},
|
||||
async submit() {
|
||||
console.log(this);
|
||||
console.log(this.address);
|
||||
console.log(this.addressText);
|
||||
let name = this.userAddress.realName,
|
||||
phone = this.userAddress.phone,
|
||||
model2 = this.model2,
|
||||
addressText = this.addressText,
|
||||
detail = this.userAddress.detail,
|
||||
isDefault = this.userAddress.isDefault;
|
||||
try {
|
||||
@ -166,9 +124,9 @@ export default {
|
||||
required(required.message("联系电话")),
|
||||
chs_phone(chs_phone.message())
|
||||
],
|
||||
model2: [required("请选择地址")],
|
||||
addressText: [required("请选择地址")],
|
||||
detail: [required(required.message("具体地址"))]
|
||||
}).validate({ name, phone, model2, detail });
|
||||
}).validate({ name, phone, addressText, detail });
|
||||
} catch (e) {
|
||||
return validatorDefaultCatch(e);
|
||||
}
|
||||
@ -204,7 +162,7 @@ export default {
|
||||
});
|
||||
} catch (err) {
|
||||
uni.showToast({
|
||||
title: err.msg || err.response.data.msg|| err.response.data.message,
|
||||
title: err.msg || err.response.data.msg || err.response.data.message,
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
@ -213,17 +171,17 @@ export default {
|
||||
ChangeIsDefault: function() {
|
||||
this.userAddress.isDefault = !this.userAddress.isDefault;
|
||||
},
|
||||
closeaArea() {
|
||||
this.show2 = false;
|
||||
},
|
||||
result2(ret) {
|
||||
let values = ret.mp.detail.values;
|
||||
this.closeaArea();
|
||||
this.address.province = values[0].name || "";
|
||||
this.address.city = values[1].name || "";
|
||||
this.address.district = values[2].name || "";
|
||||
this.model2 =
|
||||
this.address.province + this.address.city + this.address.district;
|
||||
result(values) {
|
||||
console.log(this);
|
||||
console.log(values);
|
||||
this.address = {
|
||||
province: values.province.name || "",
|
||||
city: values.city.name || "",
|
||||
district: values.district.name || ""
|
||||
};
|
||||
this.addressText = `${this.address.province}${this.address.city}${this.address.district}`;
|
||||
// this.addressText =
|
||||
// this.address.province + this.address.city + this.address.district;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 1.5 KiB |
BIN
static/images/404.png
Normal file → Executable file
BIN
static/images/404.png
Normal file → Executable file
Binary file not shown.
|
Before Width: | Height: | Size: 120 KiB After Width: | Height: | Size: 40 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 42 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 10 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 9.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 10 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 38 KiB After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 29 KiB After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 9.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 8.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 52 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 52 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 191 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 22 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 40 KiB After Width: | Height: | Size: 8.2 KiB |
@ -106,7 +106,7 @@ const vuexStore = new Vuex.Store({
|
||||
},
|
||||
getUser({ state, commit }) {
|
||||
return new Promise(reslove => {
|
||||
getUser().then(res => {
|
||||
getUserInfo().then(res => {
|
||||
console.log(res)
|
||||
commit("updateUserInfo", res.data);
|
||||
reslove(res.data);
|
||||
|
||||
@ -9,6 +9,7 @@ import store from "../store";
|
||||
import dayjs from "dayjs";
|
||||
import cookie from "@/utils/store/cookie";
|
||||
import stringify from "@/utils/querystring";
|
||||
import { VUE_APP_API_URL } from "@/config";
|
||||
|
||||
export function dataFormat(time, option) {
|
||||
time = +time * 1000;
|
||||
@ -186,7 +187,7 @@ export const login = () => {
|
||||
uni.hideLoading();
|
||||
store.commit("login", data.token, dayjs(data.expires_time));
|
||||
store.dispatch('userInfo', true)
|
||||
getUser().then(user => {
|
||||
getUserInfo().then(user => {
|
||||
console.log('获取用户信息成功')
|
||||
store.dispatch('setUserInfo', user.data)
|
||||
resolve(user)
|
||||
@ -221,7 +222,7 @@ export const login = () => {
|
||||
}
|
||||
|
||||
export const handleGetUserInfo = () => {
|
||||
getUser().then(res => {
|
||||
getUserInfo().then(res => {
|
||||
console.log('获取用户信息')
|
||||
store.dispatch('setUserInfo', res.data)
|
||||
var pages = getCurrentPages() //获取加载的页面
|
||||
@ -418,7 +419,7 @@ export function routerPermissions(url, type) {
|
||||
console.log('————————')
|
||||
let path = url
|
||||
if (!path) {
|
||||
path = '/'+getCurrentPageUrlWithArgs()
|
||||
path = '/' + getCurrentPageUrlWithArgs()
|
||||
}
|
||||
if (Vue.prototype.$deviceType == 'routine') {
|
||||
console.log('————————')
|
||||
@ -449,15 +450,15 @@ export function routerPermissions(url, type) {
|
||||
if (type == 'reLaunch') {
|
||||
reLaunch({
|
||||
path,
|
||||
|
||||
|
||||
})
|
||||
return
|
||||
return
|
||||
}
|
||||
if (type == 'replace') {
|
||||
replace({
|
||||
path,
|
||||
})
|
||||
return
|
||||
return
|
||||
}
|
||||
{
|
||||
push({
|
||||
@ -734,7 +735,7 @@ export const handleLoginFailure = () => {
|
||||
console.log('————————')
|
||||
store.commit("updateAuthorizationPage", true);
|
||||
|
||||
let path = '/'+getCurrentPageUrlWithArgs()
|
||||
let path = '/' + getCurrentPageUrlWithArgs()
|
||||
|
||||
// 判断是不是拼团进来的
|
||||
if (getCurrentPageUrl() == 'pages/activity/GroupRule/index' && handleQrCode()) {
|
||||
@ -828,3 +829,52 @@ const handleNoParameters = () => {
|
||||
});
|
||||
}, 1500)
|
||||
}
|
||||
|
||||
|
||||
export function chooseImage(callback) {
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sourceType: ["album"],
|
||||
success: res => {
|
||||
uni.getImageInfo({
|
||||
src: res.tempFilePaths[0],
|
||||
success: image => {
|
||||
console.log(image);
|
||||
uni.showLoading({ title: "图片上传中", mask: true });
|
||||
uni.uploadFile({
|
||||
url: `${VUE_APP_API_URL}/api/upload`,
|
||||
file: image,
|
||||
filePath: image.path,
|
||||
header: {
|
||||
Authorization: "Bearer " + store.getters.token
|
||||
},
|
||||
name: "file",
|
||||
success: res => {
|
||||
console.log(res);
|
||||
if (callback) {
|
||||
callback(JSON.parse(res.data).link)
|
||||
}
|
||||
},
|
||||
fail: err => {
|
||||
uni.showToast({
|
||||
title: "上传图片失败",
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
},
|
||||
complete: res => {
|
||||
uni.hideLoading()
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: err => {
|
||||
uni.showToast({
|
||||
title: "获取图片信息失败",
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user