mkm/nk-shop2.0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增调货、发布界面，地址选择优化

Browse Source
This commit is contained in:
jia 2023-08-08 17:31:25 +08:00
parent 74377c7dd8
commit c9cbc6a43c
28 changed files with 3974 additions and 601 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
api/api.js
View File

@ -269,3 +269,21 @@ export function ajcaptchaCheck(data) {
noAuth: true noAuth: true
}); });
} }
/**
* 获取所在的地区数据
* @param {Object} data
*/
export function village(data) {
return request.get('v2/system/geo/lst', data, { noAuth: true });
}
/**
* 获取所在的村队数据
* @param {Object} data
*/
export function brigade(data) {
return request.get('v2/system/brigade', data, { noAuth: true });
}

105
components/areaWindow/index.vue
View File

@ -36,7 +36,7 @@
// | Author: CRMEB Team <admin@crmeb.com> // | Author: CRMEB Team <admin@crmeb.com>
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
import {getAddressList} from '@/api/user.js'; import {getAddressList} from '@/api/user.js';
import { getCityV2 } from '@/api/api.js'; import { getCityV2,village } from '@/api/api.js';
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
const CACHE_ADDRESS = {}; const CACHE_ADDRESS = {};
export default { export default {
@ -87,25 +87,74 @@
this.loadAddress(0) this.loadAddress(0)
}, },
methods: { methods: {
change(pid,index){ change(pid){
if(this.selectedIndex == index) return; if(this.selectedIndex == index) return;
if(pid === -1){ if(pid === -1){
pid = this.selectedArr.length ? this.selectedArr[this.selectedArr.length -1].id : 0; pid = this.selectedArr.length ? this.selectedArr[this.selectedArr.length -1].id : 0;
} }
console.log(index)
this.selectedIndex = index; this.selectedIndex = index;
this.loadAddress(pid); this.loadAddress(pid);
}, },
loadAddress(pid){ loadAddress(pid,type){
if(CACHE_ADDRESS[pid]){ if(CACHE_ADDRESS[pid]){
this.addressList = CACHE_ADDRESS[pid]; this.addressList = CACHE_ADDRESS[pid];
return ; return ;
} }
this.is_loading = true; this.is_loading = true;
getCityV2(pid).then(res=>{ // getCityV2(pid).then(res=>{
this.is_loading = false;
CACHE_ADDRESS[pid] = res.data; // this.is_loading = false;
this.addressList = res.data; // CACHE_ADDRESS[pid] = res.data;
}) // this.addressList = res.data;
// })
if(type=='province'){
village({province_code:pid}).then(res=>{
this.is_loading = false;
CACHE_ADDRESS[pid] = res.data;
this.addressList = res.data;
})
}else if(type=='city'){
village({city_code:pid}).then(res=>{
this.is_loading = false;
CACHE_ADDRESS[pid] = res.data;
this.addressList = res.data;
})
}else if(type=='area'){
village({area_code:pid}).then(res=>{
if(res.data.length>0){
this.is_loading = false;
CACHE_ADDRESS[pid] = res.data;
this.addressList = res.data;
}else{
this.$emit('submit', [...this.selectedArr]);
this.$emit('changeClose');
}
})
}else if(type=='street'){
village({street_code:pid}).then(res=>{
if(res.data.length>0){
this.is_loading = false;
CACHE_ADDRESS[pid] = res.data;
this.addressList = res.data;
}else{
this.$emit('submit', [...this.selectedArr]);
this.$emit('changeClose');
}
})
}else{
village().then(res=>{
this.is_loading = false;
CACHE_ADDRESS[pid] = res.data;
this.addressList = res.data;
})
}
this.goTop() this.goTop()
}, },
selected(item){ selected(item){
@ -114,17 +163,49 @@
this.selectedArr.splice(this.selectedIndex + 1,999) this.selectedArr.splice(this.selectedIndex + 1,999)
this.selectedArr[this.selectedIndex] = item; this.selectedArr[this.selectedIndex] = item;
this.selectedIndex = -1; this.selectedIndex = -1;
}else if(!item.parent_id){ }
// else if(!item.parent_id){
// this.selectedArr = [item];
// }else{
// this.selectedArr.push(item);
// }
else if(!item.id){
this.selectedArr = [item]; this.selectedArr = [item];
}else{ }else{
this.selectedArr.push(item);
if(this.selectedArr.length>4){
let arry=[]
arry.push(item)
this.selectedArr=arry
}else{
this.selectedArr.push(item);
}
} }
if(item.snum){
this.loadAddress(item.id); if(item.type=="province"){
this.loadAddress(item.code,"province");
}else if(item.type=="city"){
this.loadAddress(item.code,"city");
}else if(item.type=="area"){
this.loadAddress(item.code,"area");
}else if(item.type=="street"){
this.loadAddress(item.code,"street");
} else { } else {
this.$emit('submit', [...this.selectedArr]); this.$emit('submit', [...this.selectedArr]);
this.$emit('changeClose'); this.$emit('changeClose');
} }
// if(item.snum){
// this.loadAddress(item.id);
// } else {
// this.$emit('submit', [...this.selectedArr]);
// this.$emit('changeClose');
// }
this.goTop() this.goTop()
}, },
close: function() { close: function() {

185
components/release/release.vue Normal file
View File

@ -0,0 +1,185 @@
<template>
<view class="mark" v-if="isShow" @click="close">
<view class="release">
<view class="release_content" v-for="(item,i) in list" :key="i" @click="navigtion(item)">
<view class="release_content_left">
<view :class="i==1?'release_imga':'release_img'">
<image :src="item.img" mode="aspectFit"></image>
</view>
<view class="title">
<view class="title1">
{{item.title1}}
</view>
<view class="title2">
{{item.title2}}
</view>
</view>
</view>
<view class="release_content_right ">
<text class="iconfont icon-xiangyou"></text>
</view>
</view>
<view class="release_close" @click="close">
<image src="@/static/images/trad-close.png" mode="aspectFit"></image>
</view>
</view>
</view>
</view>
</template>
<script>
import {
navigateTo
} from '../../libs/uniApi'
export default {
props: {
isShow: {
type: Boolean,
default: false
},
// 子组件接收一个布尔类型的bottom，如果为true则弹窗则在页面的底部，false为默认居中显示
bottom: {
type: Boolean,
default: false
}
},
data() {
return {
list: [{
img: require('@/static/images/season.png'),
title1: '发布调货商品',
title2: '镇街店铺快捷调货',
},
{
img: require('@/static/images/discounts.png'),
title1: '发布打折商品',
title2: '发布店铺打折商品',
}
]
}
},
methods: {
navigtion(item) {
if (item.title1 = '发布调货商品') {
uni.navigateTo({
url: '/pages/trading_hall/adddiscounts/index'
})
} else {
}
},
close() {
this.$emit('close')
},
cancel() {
this.$emit('cancel')
},
confirm() {
this.$emit('confirm')
},
}
}
</script>
<style lang="scss">
.mark {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
left: 0;
bottom: 0;
top: 0;
right: 0;
display: flex;
justify-content: center;
align-items: center;
}
.release {
position: absolute;
bottom: 0px;
}
.release_content {
width: 694rpx;
height: 137rpx;
background: #FCF3EE;
border-radius: 14rpx 14rpx 14rpx 14rpx;
opacity: 1;
margin-bottom: 21rpx;
display: flex;
justify-content: space-between;
padding: 0 26rpx;
.release_content_left {
display: flex;
}
.release_content_right {
height: 137rpx;
line-height: 137rpx;
}
.release_img {
width: 111rpx;
height: 96rpx;
margin-top: 21rpx;
margin-right: 19rpx;
margin-left: -15rpx;
image {
width: 111rpx;
height: 96rpx;
}
}
.release_imga {
width: 76rpx;
height: 113rpx;
margin-left: 21rpx;
margin-top: 5rpx;
margin-right: 19rpx;
image {
width: 76rpx;
height: 113rpx;
}
}
.title {
margin-top: 21rpx;
}
.title1 {
font-size: 32rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
}
.title2 {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
margin-top: 9rpx;
}
}
.release_close {
width: 248rpx;
height: 248rpx;
margin: 0 auto;
image {
width: 248rpx;
height: 248rpx;
}
}
</style>

531
components/shoppinglist/shoppinglist.vue Normal file
View File

@ -0,0 +1,531 @@
<template>
<view class="containers" :style="viewColor">
<view class="header">
<view class="search">
<text class="iconfont icon-xiazai5"></text>
<input type="text" placeholder="请输入商品名称" v-model="searchVal" @input="setValue" confirm-type="search"
@confirm="searchBut()" placeholder-class='placeholder'>
</view>
<view class="iconclose" @click="close">
X
</view>
</view>
<view class="main">
<scroll-view scroll-y="true">
<block>
<view v-if="bought.length" @touchmove="onTouchmove" id="goods">
<view class="picTxt acea-row" v-for="(item, index) in bought" :key="index">
<view class="checkbox">
<text @click.stop="goodsCheck(item,index)" v-if="item.check"
class="iconfont icon-xuanzhong1"></text>
<text @click.stop="goodsCheck(item,index)" v-else
:class="checkedArr.length >=5 ? 'disabled': ''"
class="iconfont icon-weixuanzhong"></text>
</view>
<view class='pictrue'>
<image :src='item.image'></image>
</view>
<view class='text'>
<view class='line2 name'>{{item.store_name}}</view>
<view class="">
<view class="">
采购价格:100 库存:100
</view>
</view>
</view>
<view class="picTxt_price">
<view class="price">
<span>出售价格</span>
<input type="text" value="" placeholder="输入出售价格" />
</view>
<view class="price_num">
<span>出售数量</span>
<subtractive
style="margin-top: -10rpx;margin-left: 30rpx;"
class="step"
:min="1"
:max="100"
:value="peicenumber"
:isMax="true"
:isMin="true"
:index="11"
@eventChange="numberChange"
></subtractive>
</view>
</view>
</view>
</view>
<view v-else class="empty">
<image src="/static/images/no_thing.png"></image>
<text>暂无内容哦~</text>
</view>
</block>
</scroll-view>
<view class="foot_bar">
<button class="confirm_btn" @click="submit">确定({{checkedArr.length}})</button>
</view>
</view>
</view>
</template>
<script>
import Loading from '@/components/Loading/index.vue';
import subtractive from '@/components/subtractive/subtractive.vue';
import {
boughtLstApi,
collectLstApi,
browseLstApi
} from "@/api/community";
import {
mapGetters
} from "vuex";
export default {
props: {
checkedObj: {
type: Array,
default: []
}
},
computed: mapGetters(['viewColor']),
components: {
Loading,
subtractive
},
data() {
return {
isActive: 0,
loadedb: false,
loadingb: false,
loadedc: false,
loadingc: false,
loadeds: false,
loadings: false,
whereb: {
page: 1,
limit: 10,
keyword: '',
},
peicenumber:0,
wherec: {
page: 1,
limit: 10,
keyword: '',
},
wheres: {
page: 1,
limit: 10,
keyword: '',
},
searchVal: "",
checked: [],
list: [],
collect: [],
bought: [],
browse: [],
checkedArr: [],
};
},
watch: {
checkedObj: {
handler(n) {
// this.checkedArr = n
},
deep: true
}
},
mounted() {
this.checkedArr = this.checkedObj
this.getBounht();
this.getCollect();
this.getBrowse();
},
methods: {
// 点击关闭按钮
close() {
this.$emit('close');
},
numberChange(data){
this.peicenumber = data.number;
},
tabs(index) {
this.isActive = index
this.$set(this.whereb, 'keyword', '');
this.searchVal = ''
this.searchBut()
},
onTouchmove(e) {
if (this.loadendb) return;
if (this.loadingb) return;
const query = uni.createSelectorQuery().in(this);
query.select('#goods').boundingClientRect(data => {
if (data.bottom < 1500 && data.top < 0) {
this.getBounht();
}
}).exec();
// 模拟触底刷新
},
onTouchmove1(e) {
if (this.loadendc) return;
if (this.loadingc) return;
const query = uni.createSelectorQuery().in(this);
query.select('#collect').boundingClientRect(data => {
if (data.bottom < 1500 && data.top < 0) {
this.getCollect();
}
}).exec();
// 模拟触底刷新
},
onTouchmove2(e) {
if (this.loadends) return;
if (this.loadings) return;
const query = uni.createSelectorQuery().in(this);
query.select('#browse').boundingClientRect(data => {
if (data.bottom < 1500 && data.top < 0) {
this.getBrowse();
}
}).exec();
// 模拟触底刷新
},
setValue: function(event) {
this.$set(this.whereb, 'keyword', event.detail.value);
},
searchBut() {
this.getBounht()
},
getBounht() {
var that = this;
if (that.loadingb || that.loadedb) return;
that.loadingb = true;
boughtLstApi(that.whereb).then(
res => {
that.loadingb = false;
that.loadedb = res.data.list.length < that.whereb.limit;
that.bought.push.apply(that.bought, res.data.list);
that.whereb.page = that.whereb.page + 1;
that.getInitchecked(that.bought);
},
error => {
that.$util.Tips({
title: error.msg
})
}
);
},
getCollect() {
var that = this;
if (that.loadingc || that.loadedc) return;
that.loadingc = true;
collectLstApi(that.wherec).then(
res => {
that.loadingc = false;
that.loadedc = res.data.list.length < that.wherec.limit;
that.collect.push.apply(that.collect, res.data.list);
that.wherec.page = that.wherec.page + 1;
that.getInitchecked(that.collect);
},
error => {
that.$util.Tips({
title: error.msg
})
}
);
},
getBrowse() {
var that = this;
if (that.loadings || that.loadeds) return;
that.loadings = true;
browseLstApi(that.wheres).then(
res => {
that.loadings = false;
that.loadeds = res.data.list.length < that.wheres.limit;
that.browse.push.apply(that.browse, res.data.list);
that.wheres.page = that.wheres.page + 1;
that.getInitchecked(that.browse);
},
error => {
that.$util.Tips({
title: error.msg
})
}
);
},
/*获取初始化选中的数据*/
getInitchecked(arr) {
let that = this;
arr.forEach((item, index) => {
that.$set(item, 'check', false);
that.checkedArr.forEach((val, i) => {
if ((item.spu_id == (val.spu && val.spu.spu_id)) || (item.spu_id == val.spu_id)) {
that.$set(item, 'check', true);
}
})
})
},
/*已选中的商品打钩*/
getCheckedGoods() {
this.checked = []
this.checkedArr.forEach((item, index) => {
this.check.push(item)
})
},
/*点击选中与否*/
goodsCheck(item, index) {
this.$set(item, 'check', !item.check);
if (item.check) {
this.checkedArr.push(item)
} else {
this.checkedArr.splice(this.checkedArr.findIndex(itemn => ((itemn.spu_id == item.spu_id) || (item
.spu_id == (
itemn.spu && itemn.spu.spu_id)))), 1)
}
},
/*确定提交*/
submit() {
this.$emit('getProduct', this.checkedArr);
},
}
}
</script>
<style lang="scss" scoped>
.containers {
background: #ffffff;
border-radius: 16rpx 16rpx 0 0;
padding: 40rpx 0;
position: relative;
.header {
position: relative;
padding: 0 30rpx;
.title {
width: 100%;
text-align: center;
text {
position: relative;
margin: 0 50rpx;
color: #999999;
font-size: 30rpx;
&.on {
color: #333333;
font-weight: bold;
font-size: 34rpx;
&::after {
content: "";
display: inline-block;
width: 40rpx;
height: 5rpx;
background: var(--view-theme);
position: absolute;
bottom: -10rpx;
left: 10rpx;
}
}
}
}
.iconclose {
width: 44rpx;
height: 44rpx;
border: 2rpx solid #fff;
border-radius: 50%;
text-align: center;
color: #fff;
position: absolute;
top: -150rpx;
right: 30rpx;
}
.search {
margin-top: 44rpx;
background: #F5F5F5;
border-radius: 30rpx;
padding: 12rpx 30rpx 12rpx 66rpx;
position: relative;
.iconfont {
font-size: 24rpx;
color: #939393;
position: absolute;
top: 20rpx;
left: 30rpx;
}
.placeholder {
color: #999999;
font-size: 26rpx;
}
}
.sub_title {
color: #282828;
font-size: 26rpx;
margin-top: 30rpx;
}
.iconfont {
color: #8A8A8A;
font-size: 28rpx;
position: absolute;
top: 0;
right: 30rpx;
}
}
scroll-view {
height: 650rpx;
}
.main {
height: 650rpx;
margin: 40rpx 0 80rpx;
padding: 0 30rpx;
}
}
.picTxt {
width: 100%;
padding: 25rpx 0;
position: relative;
align-items: center;
justify-content: space-between;
margin-bottom: 10rpx;
border-top: 2rpx solid #E7E6E4;
.picTxt_price {
display: flex;
margin-top: 37rpx;
.price {
display: flex;
margin-right: 30rpx;
input {
width: 168rpx;
height: 39rpx;
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #CCCCCC;
margin-left: 30rpx;
}
}
.price_num{
display: flex;
}
}
.checkbox {
margin-right: 30rpx;
.iconfont {
font-size: 38rpx;
color: #CCCCCC;
}
.icon-xuanzhong1 {
color: var(--view-theme);
}
.disabled {
pointer-events: none;
cursor: default;
opacity: 0.3;
}
}
.pictrue {
width: 160rpx;
height: 160rpx;
image {
width: 100%;
height: 100%;
border-radius: 8rpx;
}
}
.text {
width: 430rpx;
margin-left: 30rpx;
font-size: 28rpx;
color: #282828;
position: relative;
height: 160rpx;
.name {
color: #282828;
font-size: 28rpx;
}
.money {
position: absolute;
bottom: 0;
left: 0;
color: var(--view-priceColor);
font-size: 22rpx;
font-weight: bold;
text {
font-size: 26rpx;
}
}
}
}
.foot_bar {
width: 100%;
position: fixed;
// bottom: 54px;
left: 0;
padding: 20rpx 0;
z-index: 5;
.confirm_btn {
width: 710rpx;
height: 86rpx;
line-height: 86rpx;
color: #ffffff;
text-align: center;
font-size: 32rpx;
background: var(--view-theme);
border-radius: 43rpx;
margin: 0 auto;
}
}
.empty {
margin: 130rpx 0 150rpx;
text-align: center;
image,
uni-image {
display: inline-block;
width: 414rpx;
height: 305rpx;
}
text {
display: block;
color: #999999;
font-size: 26rpx;
}
}
</style>

208
components/subtractive/subtractive.vue Normal file
View File

@ -0,0 +1,208 @@
<template>
<view class="uni-numbox">
<!-- -部分 -->
<view class="uni-numbox-minus" @click="_calcValue('subtract')">
<text :class="minDisabled?'uni-numbox-disabled': ''">-</text>
</view>
<!-- 中间输入数值部分 -->
<input class="uni-numbox-value" type="number" :disabled="disabled" :value="inputValue" @blur="_onBlur">
<!-- + 部分 -->
<view class="uni-numbox-plus" @click="_calcValue('add')">
<text :class="maxDisabled?'uni-numbox-disabled': ''">+</text>
</view>
</view>
</template>
<script>
export default {
name: 'uni-number-box',
props: {
// isMax 是否有上限设置
isMax: {
type: Boolean,
default: false
},
// isMin 是否有下限设置
isMin: {
type: Boolean,
default: false
},
// index 唯一值，如果一个页面有多个数量增减组件时，起到唯一的作用
index: {
type: String,
default: 0
},
// value 是数值
value: {
type: Number,
default: 0
},
// min 最小值
min: {
type: Number,
default: -Infinity
},
// max 最大值
max: {
type: Number,
default: Infinity
},
// step 步长
step: {
type: Number,
default: 1
},
// disabled 是否禁用
disabled: {
type: Boolean,
default: false
}
},
data() {
return {
inputValue: this.value,
minDisabled: false,
maxDisabled: false
}
},
created() {
this.maxDisabled = this.isMax;
this.minDisabled = this.isMin;
},
computed: {
},
watch: {
inputValue(number) {
const data = {
number: number,
index: this.index
}
this.$emit('eventChange', data);
}
},
methods: {
_calcValue(type) {
const scale = this._getDecimalScale();
let value = this.inputValue * scale;
let newValue = 0;
let step = this.step * scale;
if (type === 'subtract') {
newValue = value - step;
if (newValue <= this.min) {
this.minDisabled = true;
}
if (newValue < this.min) {
newValue = this.min
}
if (newValue < this.max && this.maxDisabled === true) {
this.maxDisabled = false;
}
} else if (type === 'add') {
newValue = value + step;
if (newValue >= this.max) {
this.maxDisabled = true;
}
if (newValue > this.max) {
newValue = this.max
}
if (newValue > this.min && this.minDisabled === true) {
this.minDisabled = false;
}
}
if (newValue === value) {
return;
}
this.inputValue = newValue / scale;
},
_getDecimalScale() {
let scale = 1;
// 浮点型
if (~~this.step !== this.step) {
scale = Math.pow(10, (this.step + '').split('.')[1].length);
}
return scale;
},
_onBlur(event) {
let value = event.detail.value;
if (!value) {
this.inputValue = 0;
return
}
value = +value;
if (value > this.max) {
value = this.max;
} else if (value < this.min) {
value = this.min
}
this.inputValue = value
}
}
}
</script>
<style>
.uni-numbox {
/* position:absolute; */
/* left: 30upx;
bottom: 0; */
display: flex;
justify-content: flex-start;
align-items: center;
width: 200upx;
height: 50upx;
/* background:#f5f5f5; */
}
.uni-numbox-minus {
background: #EEEEEE !important;
color: #909399 !important;
}
.uni-numbox-minus,
.uni-numbox-plus {
margin: 0;
width: 53rpx;
height: 53rpx;
background-color: #F84221;
opacity: 1;
line-height: 53rpx;
text-align: center;
position: relative;
color: #fff;
font-size: 40upx;
}
.uni-numbox-minus .yticon,
.uni-numbox-plus .yticon {
font-size: 36upx;
color: #555;
}
.uni-numbox-minus {
/* border-right: none;
border-top-left-radius: 6upx;
border-bottom-left-radius: 6upx; */
}
.uni-numbox-plus {
/* border-left: none;
border-top-right-radius: 6upx;
border-bottom-right-radius: 6upx; */
}
.uni-numbox-value {
position: relative;
/* background-color: #f5f5f5; */
width: 90upx;
height: 50upx;
text-align: center;
padding: 0;
font-size: 30upx;
}
.uni-numbox-disabled.yticon {
color: #d6d6d6;
}
</style>

261
components/villageTeam/villageTeam.vue Normal file
View File

@ -0,0 +1,261 @@
<template>
<view :style="viewColor">
<view class="address-window" :class="display==true?'on':''">
<view class='title'>请选择所在村队<text class='iconfont icon-guanbi' @tap='close'></text></view>
<view class="address-count">
<view class="address-selected">
<view v-for="(item,index) in selectedArr" :key="index" class="selected-list" :class="{active:index === selectedIndex}" @click="change(item.parent_id, index)">
{{item.name}}
<text class="iconfont icon-xiangyou"></text>
</view>
<view class="selected-list" :class="{active:-1 === selectedIndex}" v-if="showMore" @click="change(-1, -1)">
<text class="iconfont icon-xiangyou"></text>
请选择
</view>
</view>
<scroll-view scroll-y="true" :scroll-top="scrollTop" class="address-list" @scroll="scroll">
<view v-for="(item,index) in addressList" :key="index" class="list" :class="{active:item.id === activeId}" @click="selected(item)">
<text class="item-name">{{item.name}}</text>
<text v-if="item.id === activeId" class="iconfont icon-duihao2"></text>
</view>
</scroll-view>
</view>
</view>
<view class='mask' catchtouchmove="true" :hidden='display==false' @tap='close'></view>
</view>
</template>
<script>
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import {getAddressList} from '@/api/user.js';
import {brigade } from '@/api/api.js';
import { mapGetters } from "vuex";
const CACHE_ADDRESS = {};
export default {
props: {
display: {
type: Boolean,
default: true
},
address: Array,
},
data() {
return {
active: 0,
//地址列表
addressList: [],
selectedArr: [],
selectedIndex: -1,
is_loading: false,
old: { scrollTop: 0 },
scrollTop: 0
};
},
computed:{
...mapGetters(['viewColor']),
activeId(){
return this.selectedIndex == -1 ? 0 : this.selectedArr[this.selectedIndex].id
},
showMore(){
return this.selectedArr.length ? this.selectedArr[this.selectedArr.length - 1].snum > 0 : true
}
},
watch:{
address(n){
this.selectedArr = n ? [...n] : []
},
display(n){
if(!n) {
this.addressList = [];
this.selectedArr = this.address ? [...this.address] : [];
this.selectedIndex = -1;
this.is_loading = false;
}else{
this.loadAddress()
}
}
},
mounted() {
this.loadAddress()
},
methods: {
change(pid,index){
if(this.selectedIndex == index) return;
if(pid === -1){
pid = this.selectedArr.length ? this.selectedArr[this.selectedArr.length -1].id : 0;
}
console.log(index)
this.selectedIndex = index;
this.loadAddress();
},
loadAddress(pid){
if(CACHE_ADDRESS[pid]){
this.addressList = CACHE_ADDRESS[pid];
return ;
}
this.is_loading = true;
brigade(pid).then(res=>{
console.log(res.data)
this.is_loading = false;
CACHE_ADDRESS[pid] = res.data;
this.addressList = res.data;
})
this.goTop()
},
selected(item){
if(this.is_loading) return;
if(this.selectedIndex > -1){
this.selectedArr.splice(this.selectedIndex + 1,999)
this.selectedArr[this.selectedIndex] = item;
this.selectedIndex = -1;
}else if(!item.parent_id){
this.selectedArr = [item];
}else{
this.selectedArr.push(item);
}
if(item.snum){
this.loadAddress(item.id);
} else {
this.$emit('submit', [...this.selectedArr]);
this.$emit('changeClose');
}
this.goTop()
},
close: function() {
this.$emit('changeClose');
},
scroll : function(e) {
this.old.scrollTop = e.detail.scrollTop
},
goTop: function(e) {
this.scrollTop = this.old.scrollTop
this.$nextTick(() => {
this.scrollTop = 0
});
}
}
}
</script>
<style scoped lang="scss">
.address-window {
background-color: #fff;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 101;
border-radius: 30rpx 30rpx 0 0;
transform: translate3d(0, 100%, 0);
transition: all .3s cubic-bezier(.25, .5, .5, .9);
}
.address-window.on {
transform: translate3d(0, 0, 0);
}
.address-window .title {
font-size: 32rpx;
font-weight: bold;
text-align: center;
height: 123rpx;
line-height: 123rpx;
position: relative;
}
.address-window .title .iconfont {
position: absolute;
right: 30rpx;
color: #8a8a8a;
font-size: 35rpx;
}
.address-count{
.address-selected{
padding: 0 30rpx;
margin-top: 10rpx;
position: relative;
padding-bottom: 20rpx;
border-bottom: 2rpx solid #f7f7f7;
}
.selected-list{
font-size: 26rpx;
color: #282828;
line-height: 50rpx;
padding-bottom: 10rpx;
padding-left: 60rpx;
position: relative;
&.active{
color: #e28d54;
}
&:before,&:after{
content: '';
display: block;
position: absolute;
}
&:before{
width: 4rpx;
height: 100%;
background-color: var(--view-theme);
top: 0;
left: 10rpx;
}
&:after{
width: 12rpx;
height: 12rpx;
background: var(--view-theme);
border-radius: 100%;
left: 6rpx;
top: 50%;
margin-top: -8rpx;
}
&:first-child,&:last-child{
&:before{
height: 50%;
}
}
&:first-child{
&:before{
top: auto;
bottom: 0;
}
}
.iconfont{
font-size: 20rpx;
float: right;
color: #dddddd;
}
}
scroll-view{
height: 550rpx;
}
.address-list{
padding: 0 30rpx;
margin-top: 20rpx;
box-sizing: border-box;
.list{
.iconfont{
float: right;
color: #ddd;
font-size: 22rpx;
}
.item-name{
display: inline-block;
line-height: 50rpx;
margin-bottom: 20rpx;
font-size: 26rpx;
}
&.active{
color: #e28d54;
.iconfont{
color: #e28d54;
}
}
}
}
}
</style>

3
config/app.js
View File

@ -10,8 +10,9 @@ let httpApiThree
// let httpApi = 'http://192.168.31.110:8324' // 测试 // let httpApi = 'http://192.168.31.110:8324' // 测试
if (process.env.NODE_ENV === "development") { if (process.env.NODE_ENV === "development") {
// httpApi = 'https://shop.lihaink.cn' // 生产 // httpApi = 'https://shop.lihaink.cn' // 生产
httpApi = "https://crmeb-test.shop.lihaink.cn" // httpApi = "https://crmeb-test.shop.lihaink.cn"
// httpApi = "http://192.168.0.222" // httpApi = "http://192.168.0.222"
httpApi = "http://192.168.0.108:8325"
// #ifdef MP-WEIXIN // #ifdef MP-WEIXIN
httpApiTwo = "https://nk.lihaink.cn" httpApiTwo = "https://nk.lihaink.cn"
httpApiThree = 'http://ceshi-oa.lihaink.cn' httpApiThree = 'http://ceshi-oa.lihaink.cn'

25
pages.json
View File

@ -694,13 +694,36 @@
}, { }, {
"path": "trading_hall/index", "path": "trading_hall/index",
"style": { "style": {
"navigationBarTitleText": "", "navigationBarTitleText": "交易大厅",
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
} }
] ]
}, },
{
"root": "pages/trading_hall",
"name": "trading_hall",
"pages": [{
"path": "adddiscounts/index",
"style": {
"navigationBarTitleText": "新增调货",
"enablePullDownRefresh": false
}
},{
"path": "product_details/index",
"style": {
"navigationBarTitleText": "商品详情",
"enablePullDownRefresh": false
}
}
]
},
{ {
"root": "pages/store", "root": "pages/store",
"name": "store", "name": "store",

979
pages/trading_hall/adddiscounts/index.vue Normal file
View File

@ -0,0 +1,979 @@
<template>
<!-- #ifdef MP -->
<view :style="viewColor">
<!-- #endif -->
<!-- #ifdef APP || H5 -->
<view :style="viewColor">
<!-- #endif -->
<form @submit="formSubmit" report-submit='true'>
<view class="release_content">
<view class="release_tab acea-row">
<view class="tab_item" v-for="(item, index) in tabList" :key="item.value"
:class="{on:tabActive == item.value}" @click="changeTab(item)">
<text class="iconfont" :class="item.icon"></text>{{item.name}}
</view>
</view>
<view>
<view class="release_item">
<view class="photo_count">
<view class="input_photo acea-row row-middle">
<block v-if="tabActive == 2">
<view class="pictrue" v-if="formData.video_link">
<view v-if="videoplay">
<video controls id="myvideo" :src="video_link"
@fullscreenchange="screenChange"></video>
</view>
<!--#ifndef APP-PLUS-->
<video class="pictrue" :src="formData.video_link"></video>
<!--#endif-->
<image class="video-bg" mode="widthFix"
src="https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/3/video_bg.png">
</image>
<view class="videoHover" @click="videoshow">
<view>
<text class="iconfont icon-24gf-play"></text>
</view>
</view>
<text class="video-text">点击可预览视频</text>
<view class="close_btn" @click="delVideo"><text
class="iconfont icon-guanbi4"></text></view>
</view>
<view v-else class="pictrue acea-row row-center-wrapper row-column add"
@click="uploadVideo">
<view><text class='iconfont icon-tianjiashipin'></text></view>
<view class="text">添加视频</view>
</view>
<view v-if="formData.image.length < 1"
class="pictrue acea-row row-center-wrapper row-column add"
@click.stop="clk">
<view><text class='iconfont icon-fengmian'></text></view>
<view class="text">添加封面</view>
</view>
</block>
<view class="pictrue" v-for="(item, index) in formData.image" :key="index">
<easy-loadimage mode="widthFix" :image-src="item"></easy-loadimage>
<text class="cover_text" v-if="tabActive == 2">封面</text>
<view class="close_btn" @click="DelPic(index)"><text
class="iconfont icon-guanbi4"></text></view>
</view>
<block v-if="tabActive == 1">
<view v-if="formData.image.length < 6"
class="pictrue acea-row row-center-wrapper row-column add"
@click.stop="clk">
<view><text class='iconfont icon-icon25201'></text></view>
<view class="text">添加图片</view>
</view>
</block>
<view v-if="showCd" :ratio="16/9" class="container">
<bt-cropper ref="cropper" :imageSrc="imageSrc" @cropEnd="loadImage"
:dWidth="800" :compress="true">
<!-- 你想插入的内容 -->
<button class="crop_btn" @click="crop">裁切</button>
</bt-cropper>
</view>
</view>
</view>
<view class="textarea">
<textarea placeholder='分享使用体验和心得，获得更多点赞和关注哦~(600字以内)' name="comment"
placeholder-class='placeholder' v-model="formData.content"
maxlength="600"></textarea>
</view>
</view>
<view class="release_item">
<view class='item acea-row row-between-wrapper'>
<view class='name'><text
class="iconfont icon-baobeilianjie"></text>添加产品({{productList.length}})</view>
<view class="select">
<view class="select_count" @click.stop="addProduct">
<text v-if="productList.length == 0" class="text">选择产品</text>
<view v-else class="text">
<image class="image" v-for="(item,index) in productList" :key="index"
:src="item.image || (item.spu && item.spu.image)"></image>
</view>
<text class="iconfont icon-xiangyou"></text>
</view>
</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name' style="font-size: 28rpx;rfont-family: PingFang SC;font-weight: 400;color: #F84221;">价格：￥{{price}}</view>
<view class="select">
<view class="select_count" @click="addprice">
<text v-if="!isshow" class="text1">点击输入价格</text>
<view v-else @click.stop="deleteTopic">
<input type="number" value="" v-model="price" placeholder="请输入价格"
style="text-align: right;font-size: 28rpx;" />
</view>
</view>
</view>
</view>
</view>
</view>
<button class="release_btn button" form-type="submit">发布</button>
</view>
</form>
<!--视频预览弹窗-->
<view v-if="showVideo" class="video-count">
<!--#ifndef APP-PLUS-->
<video id="myVideo" class="videoLink" autoplay loop muted :src="formData.video_link"></video>
<!--#endif-->
<!--#ifdef APP-PLUS-->
<video id="myVideo" class="videoLink" autoplay loop
:src='formData.video_link && (formData.video_link.substring(0,4) == "http" || formData.video_link.substring(0,5) == "https") ? formData.video_link : "http:" + formData.video_link'></video>
<!--#endif-->
</view>
<view class='mask' catchtouchmove="true" :hidden='showVideo==false' @tap="showVideo=false"></view>
<avatar @upload="doUpload" @getName="getImgName" quality="1" ref="avatar" selWidth="250upx"
selHeight="250upx">
</avatar>
<!-- 提到的宝贝弹窗 -->
<uni-popup ref="associated" type="bottom">
<associated @close="close" @getProduct="getProduct" :checkedObj="productList"></associated>
</uni-popup>
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse">
</authorize>
<!-- <m-tabbar native>
<template v-slot:tabbar_index_2>
<view class="custom_style">
<view class="custom_style_icon"></view>
</view>
</template>
</m-tabbar> -->
</view>
</template>
<script>
import mTabbar from '@/components/m-tabbar/m-tabbar.vue'
import {
mapGetters
} from "vuex";
import authorize from '@/components/Authorize';
import avatar from "@/components/yq-avatar/yq-avatar.vue";
import associated from '@/components/shoppinglist/shoppinglist.vue';
import participateTopic from '@/components/participateTopic.vue';
import {
TOKENNAME,
HTTP_REQUEST_URL
} from '@/config/app.js';
import {
createPlantApi,
updatePlantApi,
plantDetailApi,
orderAssociatePlantApi
} from "@/api/community";
import {
setStorage,
getStorage
} from '@/libs/uniApi.js';
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
import {
configMap
} from '@/utils';
import store from '@/store';
export default {
components: {
avatar,
associated,
participateTopic,
authorize,
easyLoadimage,
mTabbar
},
data() {
return {
formData: {
image: [],
content: "",
topic_id: "",
spu_id: [],
video_link: ''
},
price:0,
imageSrc: '',
productList: [],
topicName: {},
isUpload: true,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
showCd: false,
isshow: false,
id: "",
order_id: "",
imgName: "",
upload_max: 50,
uploadUrl: `${HTTP_REQUEST_URL}/api/upload/video`,
tabList: [{
name: '图文',
value: 1,
icon: 'icon-tuwen'
},
{
name: '视频',
value: 2,
icon: 'icon-shipin'
},
],
tabActive: 1,
isPlay: false,
videoContext: "",
video_link: "",
showVideo: false,
videoplay: false,
videoContext: ''
};
},
computed: {
...mapGetters(['isLogin', 'viewColor', 'uid']),
...configMap({
community_app_switch: []
})
},
watch: {
// formData:{
// handler(n){
// if(!this.id){
// setTimeout(()=>{
// setStorage('addPlant', n);
// });
// }
// },
// deep: true
// }
},
mounted() {
// #ifndef APP-PLUS
this.videoContext = uni.createVideoContext('myVideo', this);
// #endif
},
onLoad(options) {
// uni.hideTabBar()
this.id = options.id;
this.order_id = options.order_id;
// console.log("options.order_id", options.order_id)
this.tabActive = options.type || 1;
if (this.community_app_switch.length == 1) {
this.tabActive = this.community_app_switch[0]
}
if (!this.isLogin) {
this.isAuto = true;
this.isShowAuth = true
} else {
if (this.id) {
this.getDetail()
} else {
// const data = getStorage('addPlant');
// if(data){
// this.formData.content = data.content || '';
// this.formData.image = data.image || [];
// }
}
if (this.order_id) this.getOrderGoods()
}
this.videoContext = uni.createVideoContext("myvideo", this);
},
onTabItemTap() {
this.$refs.associated.close();
this.formData.content = ''
this.formData.image = []
this.formData.topic_id = ''
this.formData.spu_id = ''
this.formData.video_link = ''
this.productList = []
this.topicName = {}
},
methods: {
onLoadFun() {
this.isShowAuth = false;
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e;
},
/*获取图文详情*/
getDetail() {
let that = this
plantDetailApi(that.id).then(res => {
that.formData = res.data
that.productList = res.data.relevance || []
that.topicName = res.data.topic || {}
}).catch(err => {
return that.$util.Tips({
title: err
});
})
},
/*获取关联订单商品*/
getOrderGoods() {
let that = this
orderAssociatePlantApi(that.order_id).then(res => {
that.productList = res.data || []
that.formData.spu_id = res.data.map(val => val.spu_id)
}).catch(err => {
return that.$util.Tips({
title: err
});
})
},
/*点击输入价格*/
addprice() {
this.isshow = !this.isshow
},
/*切换tab*/
changeTab(item) {
if (this.tabActive == item.value) return
this.tabActive = item.value
this.formData.image = []
},
clk() {
let that = this
uni.chooseImage({
count: 1,
sizeType: ['original'],
success: (res) => {
// console.log(res)
let tempFilePaths = res.tempFilePaths[0]
//#ifdef APP-PLUS
if (uni.getSystemInfoSync().platform == 'ios') {
that.doUpload(tempFilePaths)
} else {
let size = res.tempFiles[0].size / 1024
if (size >= 1) {
uni.compressImage({
src: tempFilePaths,
quality: 80, // 仅对jpg有效
success: res => {
that.imageSrc = res.tempFilePath;
that.showCd = true;
},
fail: err => {
// console.log('失败了compressImage', tempFilePaths);
that.imageSrc = tempFilePaths
that.showCd = true
}
})
} else {
that.imageSrc = tempFilePaths
that.showCd = true
}
}
//#endif
//#ifndef APP-PLUS
that.imageSrc = tempFilePaths
that.showCd = true
//#endif
}
})
},
crop() {
uni.showLoading({
title: '',
mask: true
})
// 通过组件定义的ref调用cropper方法，返回一个promise对象
this.$refs.cropper.crop().then(([err, res]) => {
if (!err) {
uni.hideLoading()
this.doUpload(res.tempFilePath)
} else {
uni.hideLoading()
// console.log(err)
}
})
},
loadImage() {
this.showCd = false
},
doUpload(rsp) {
let that = this
uni.showLoading({
title: '上传中',
mask: true
})
uni.uploadFile({
url: HTTP_REQUEST_URL + '/api/upload/image/field',
filePath: rsp,
name: 'field',
formData: {
'filename': rsp,
'name': that.imgName
},
header: {
// #ifdef MP
"Content-Type": "multipart/form-data",
// #endif
[TOKENNAME]: 'Bearer ' + store.state.app.token
},
success: (uploadFileRes) => {
let imgData = JSON.parse(uploadFileRes.data)
if (imgData.data.path) {
that.formData.image.push(imgData.data.path)
uni.hideLoading()
}
},
complete(res) {
let data = JSON.parse(res.data)
// that.$util.Tips({
// title: data.message
// });
}
});
},
// 上传视频
uploadVideo() {
let that = this
uni.chooseVideo({
sourceType: ['camera', 'album'],
success: res => {
if (Math.ceil(res.size / 1024) < that.upload_max * 1024) {
uni.uploadFile({
url: that.uploadUrl, //仅为示例，非真实的接口地址
filePath: res.tempFilePath,
name: 'file',
//请求参数
formData: {
user: 'test'
},
header: {
// #ifdef MP
'Content-Type': 'multipart/form-data',
// #endif
[TOKENNAME]: 'Bearer ' + store.state.app.token
},
success: uploadFileRes => {
let data = JSON.parse(uploadFileRes.data);
that.formData.video_link = (data.data.src);
},
complete: a => {
}
});
} else {
uni.showModal({
title: '提示',
content: `视频超出限制${that.upload_max}MB,已过滤`
});
}
},
fail: err => {
that.$util.Tips({
title: err
});
}
});
},
getImgName(name) {
this.imgName = name
},
/**删除图片*/
DelPic: function(index) {
let that = this
that.formData.image.splice(index, 1);
},
/*删除视频*/
delVideo() {
this.formData.video_link = '';
},
/*添加宝贝*/
addProduct() {
this.$refs.associated.open();
},
close() {
this.$refs.associated.close();
this.$refs.participateTopic.close();
},
/*查看视频*/
videoshow() {
this.showVideo = true
this.videoContext = uni.createVideoContext('myVideo', this);
this.$nextTick(() => {
this.videoContext.play();
})
// this.video_link = this.formData.video_link;
// this.videoContext.requestFullScreen({ direction: 90 });
// this.videoContext.play(); this.videoplay = true;
},
screenChange(e) {
let fullScreen = e.detail.fullScreen; //值true为进入全屏，false为退出全屏
// console.log(e, "qweeee========================================");
if (!fullScreen) {
this.videoplay = false
//退出全屏 this.videoplay = false; // 隐藏播放盒子
}
},
/*获取选中的宝贝*/
getProduct(data) {
this.productList = data;
this.formData.spu_id = data.map(val => val.spu_id)
this.$refs.associated.close();
},
/**
* 提交数据
*/
formSubmit: function(e) {
let that = this,
value = that.formData;
if (value.image.length == 0) return that.$util.Tips({
title: '请添加话题图片'
});
if (!value.content) return that.$util.Tips({
title: '请分享使用心得和体会'
});
if (that.tabActive == 2 && !value.video_link) {
return that.$util.Tips({
title: '请添加话题视频'
});
}
if (!value.category_id || !value.topic_id) {
return that.$util.Tips({
title: '请选择话题'
})
}
if (that.id) {
if (value.relevance.length) {
value.spu_id = value.relevance.map(val => (val.spu && val.spu.spu_id) || val.spu_id)
}
}
value.order_id = that.order_id
value.is_type = that.tabActive
uni.showLoading({
title: '保存中',
mask: true
})
that.id ? updatePlantApi(that.id, value).then(res => {
uni.hideLoading()
that.$util.Tips({
title: res.messge,
icon: 'success'
});
setTimeout(function() {
if (that.tabActive == 2) {
uni.navigateTo({
//#ifdef APP
url: '/pages/short_video/appSwiper/index?id=' + res.data
.community_id + '&user=1&uid=' +
that.uid
//#endif
//#ifndef APP
url: '/pages/short_video/nvueSwiper/index?id=' + res.data
.community_id + '&user=1&uid=' +
that.uid
//#endif
});
} else {
uni.navigateTo({
url: '/pages/plantGrass/plant_detail/index?id=' + res.data
.community_id + '&type=' + that
.tabActive
})
}
/**
* 将对象所有值为空
* */
/**
* 将对象所有值为空
* */
that.formData = {
image: [],
content: "",
topic_id: "",
spu_id: [],
video_link: "",
}
that.topicName = {}
}, 1000);
}).catch(err => {
return that.$util.Tips({
title: err
});
}) : createPlantApi(value).then(res => {
uni.hideLoading()
that.$util.Tips({
title: res.messge,
icon: 'success'
});
setStorage('addPlant', '');
setTimeout(function() {
if (that.tabActive == 2) {
uni.navigateTo({
//#ifdef APP
url: '/pages/short_video/appSwiper/index?id=' + res.data
.community_id + '&user=1&uid=' +
that.uid
//#endif
//#ifndef APP
url: '/pages/short_video/nvueSwiper/index?id=' + res.data
.community_id + '&user=1&uid=' +
that.uid
//#endif
});
} else {
uni.navigateTo({
url: '/pages/plantGrass/plant_detail/index?id=' + res.data
.community_id + '&type=' + that
.tabActive
})
}
/**
* 将对象所有值为空
* */
that.formData = {
image: [],
content: "",
topic_id: "",
spu_id: [],
video_link: "",
}
}, 1000);
}).catch(err => {
// console.log('aaa', value)
return that.$util.Tips({
title: err
});
})
}
}
}
</script>
<style lang="scss" scoped>
page {
background: #F5F5F5;
}
.crop_btn {
line-height: 90rpx;
height: 90rpx;
height: calc(90rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
height: calc(200rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
}
.container {
position: fixed;
top: 0;
left: 0;
z-index: 20;
width: 750rpx;
height: 100vh;
}
.release_content {
margin-top: 30rpx;
.release_tab {
border-radius: 16rpx 16rpx 0 0;
border-bottom: 1rpx solid #E4E4E4;
background: #fff;
align-items: center;
justify-content: center;
height: 86rpx;
.tab_item {
margin: 0 40rpx;
font-size: 32rpx;
color: #999;
position: relative;
line-height: 86rpx;
cursor: pointer;
&.on {
color: #E93323;
&::after {
content: "";
display: inline-block;
width: 100%;
height: 3rpx;
background: #E93323;
position: absolute;
bottom: 2rpx;
left: 0;
}
}
.iconfont {
margin-right: 10rpx;
font-size: 32rpx;
}
}
}
padding: 0 20rpx;
.release_item {
background: #ffffff;
padding: 0 30rpx;
border-radius: 10rpx;
}
.photo_count {
padding: 30rpx 0;
}
}
/deep/.input_photo .easy-loadimage,
/deep/.input_photo uni-image,
/deep/.input_photo image {
width: 180rpx;
height: 180rpx;
border-radius: 12rpx !important;
}
.input_photo .pictrue {
width: 180rpx;
height: 180rpx;
border-radius: 12rpx !important;
margin-right: 11rpx;
position: relative;
overflow: hidden;
&:nth-child(3n) {
margin-right: 0;
}
.close_btn {
width: 30rpx;
height: 30rpx;
background: rgba(0, 0, 0, .6);
border-radius: 0 12rpx 0 12rpx;
position: absolute;
top: 0;
right: 0;
display: flex;
align-items: center;
justify-content: center;
z-index: 999;
.iconfont {
color: #ffffff;
font-size: 12rpx;
}
}
.cover_text {
display: flex;
width: 58rpx;
height: 29rpx;
background: #E93323;
border-radius: 0px 12rpx 0px 12rpx;
position: absolute;
left: 0;
bottom: 0;
z-index: 10;
align-items: center;
justify-content: center;
font-size: 18rpx;
color: #fff;
}
}
/deep/.loading-img {
width: 180rpx;
height: 180rpx;
border-radius: 12rpx;
}
.input_photo .pictrue {
margin-bottom: 20rpx;
.videoHover {
width: 180rpx;
height: 180rpx;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 0;
left: 0;
z-index: 10;
>view {
width: 50rpx;
height: 50rpx;
background: #000000;
border-radius: 50rpx;
display: flex;
align-items: center;
justify-content: center;
.iconfont {
color: #ffffff;
font-size: 21rpx;
}
}
}
.video-text {
display: block;
width: 180rpx;
text-align: center;
color: #ffffff;
font-size: 18rpx;
z-index: 13;
position: absolute;
bottom: 20rpx;
}
video {
width: 180rpx;
height: 180rpx;
border-radius: 12rpx;
}
}
.input_photo .add {
background: #f6f6f6;
color: #666666;
.iconfont {
font-size: 50rpx;
}
.text {
margin-top: 20rpx;
font-size: 27rpx;
}
}
.textarea textarea {
font-size: 28rpx;
padding-bottom: 38rpx;
width: 100%;
box-sizing: border-box;
height: 400rpx;
overflow: hidden;
}
.textarea .placeholder {
color: #BBBBBB;
}
.release_item .item {
height: 106rpx;
border-bottom: 1rpx solid #eee;
position: relative;
font-size: 30rpx;
&:last-child {
border-bottom: none;
}
.name {
color: #333333;
.iconfont {
margin-right: 10rpx;
font-size: 28rpx;
}
}
.select {
color: #bbbbbb;
.select_count {
display: flex;
align-items: center;
}
.text {
margin-right: 15rpx;
display: flex;
align-items: center;
.image,
image,
uni-image {
width: 60rpx;
height: 60rpx;
margin-right: 5rpx;
}
}
.text1 {
width: 308rpx;
height: 70rpx;
line-height: 70rpx;
background: #FFFFFF;
border-radius: 7px 7px 7px 7px;
text-align: center;
opacity: 1;
border: 2rpx solid #999999;
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #CCCCCC;
}
.iconfont {
font-size: 24rpx;
}
.text_name {
color: var(--view-theme);
padding: 5rpx 12rpx;
background: var(--view-minorColor);
border-radius: 23rpx;
font-size: 24rpx;
margin-right: 10rpx;
.icon {
color: var(--view-theme);
font-weight: bold;
font-size: 24rpx;
}
.title {
margin: 0 10rpx;
}
.iconfont {
font-size: 16rpx;
}
}
}
}
.button {
width: 710rpx;
height: 86rpx;
line-height: 86rpx;
color: #ffffff;
text-align: center;
font-size: 32rpx;
background: var(--view-theme);
border-radius: 43rpx;
}
.release_btn {
margin-top: 100rpx;
}
.video-count {
position: fixed;
width: 600rpx;
height: 500rpx;
top: 50%;
left: 50%;
margin-left: -300rpx;
margin-top: -250rpx;
z-index: 100;
display: flex;
align-items: center;
justify-content: center;
.videoLink {
width: 600rpx;
height: 500rpx;
}
}
</style>

351
pages/trading_hall/product_details/index.vue Normal file
View File

@ -0,0 +1,351 @@
<template>
<view class="content">
<view class="content_top">
<view class="content_top-one">
<view class="content_symbol">
<image src="@/static/images/f.png" mode="aspectFit"></image>
</view>
<view class="content_title">
<view class="title_one">
张三生产资料供销
</view>
<view class="title_two">
100+人关注 100+销量
</view>
</view>
<view class="content_titimg">
<image src="@/static/images/sym.png" mode="aspectFit"></image>
</view>
</view>
<view view class="content_top-two">
<view class="price">
￥100
</view>
<view class="top-two_content">
【新鲜上架】“新鲜摘下，美味到你口，我们为您带来最新鲜的蔬菜，从田地到餐桌，健康从这里开始！快来选择你的绿色盛宴吧！"
</view>
<view class="top-two_img">
<view class="">
<image src="../../annex/static/vipBg.png" mode=""></image>
</view>
<view class="">
<image src="../../annex/static/vipBg.png" mode=""></image>
</view>
<view class="">
<image src="../../annex/static/vipBg.png" mode=""></image>
</view>
</view>
</view>
</view>
<view class="content_middle">
<view class="middle-one">
<view class="midding-img">
<image src="@/static/images/bg2.png" mode=""></image>
</view>
<view class="middle-one_text">
<view class="one_text_a">
良品铺子肉松饼1000g/箱 面包糕...
</view>
<view class="one_text_b">
￥100
</view>
<view class="one_text_c">
<view class="">
采购价:¥34.90
</view>
<view class="">
数量:100个
</view>
</view>
</view>
</view>
<view class="middle-one">
<view class="midding-img">
<image src="@/static/images/bg2.png" mode=""></image>
</view>
<view class="middle-one_text">
<view class="one_text_a">
良品铺子肉松饼1000g/箱 面包糕...
</view>
<view class="one_text_b">
￥100
</view>
<view class="one_text_c">
<view class="">
采购价:¥34.90
</view>
<view class="">
数量:100个
</view>
</view>
</view>
</view>
</view>
<view class="content_bootm">
<view class="content_bootm_txt">
查看TA提到的宝贝(2)
</view>
<view class="content_bootm_one">
<view class="bootm_oneimg">
<image src="@/static/images/bg2.png" mode=""></image>
</view>
<view class="">
良品铺子肉松饼1000g/箱 面包糕...
</view>
</view>
<view class="content_bootm_one">
<view class="bootm_oneimg">
<image src="@/static/images/bg2.png" mode=""></image>
</view>
<view class="">
良品铺子肉松饼1000g/箱 面包糕...
</view>
</view>
</view>
<view class="pay">
<view class="pay_tilte-a">
合计: <span>￥200.00</span>
</view>
<view class="pay_tilte-b">提交订单</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
onLoad() {},
methods: {},
}
</script>
<style lang="scss" scoped>
.content {}
.content_top {
padding: 21rpx 28rpx;
background: #FFFFFF;
.content_top-one {
display: flex;
border-bottom: 1rpx solid #CCCCCC;
.content_symbol {
width: 81rpx;
height: 81rpx;
image {
width: 81rpx;
height: 81rpx;
}
margin-bottom: 21rpx;
}
.content_title {
margin-left: 21rpx;
.title_one {
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
color: #333333;
}
.title_two {
font-size: 25rpx;
font-family: PingFang SC;
font-weight: 400;
color: #999999;
}
}
.content_titimg {
width: 136rpx;
height: 64rpx;
margin-top: -10rpx;
margin-left: 10rpx;
image {
width: 136rpx;
height: 64rpx;
}
}
}
.content_top-two {
.price {
font-size: 46rpx;
font-family: PingFang SC;
font-weight: 500;
color: #F84221
}
.top-two_content {
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 400;
color: #333333;
margin-top: 21rpx;
}
.top-two_img {
display: flex;
justify-content: space-between;
view {
width: 217rpx;
height: 217rpx;
border-radius: 14rpx 14rpx 14rpx 14rpx;
}
image {
width: 217rpx;
height: 217rpx;
border-radius: 14rpx 14rpx 14rpx 14rpx;
}
}
}
}
.content_middle {
.middle-one {
background-color: #FFFFFF;
display: flex;
margin-top: 28rpx;
padding: 21rpx 0;
.midding-img {
width: 176rpx;
height: 176rpx;
margin-left: 24rpx;
margin-right: 21rpx;
image {
width: 176rpx;
height: 176rpx;
}
}
.middle-one_text {
.one_text_a {
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
color: #333333;
}
.one_text_b {
font-size: 35rpx;
font-family: PingFang SC;
font-weight: 500;
color: #F84221;
margin-top: 11rpx;
}
.one_text_c {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
margin-top: 12rpx;
display: flex;
justify-content: space-between;
margin-right: 50rpx;
}
}
}
}
.content_bootm {
margin-bottom: 150rpx;
.content_bootm_txt {
margin-top: 42rpx;
padding-left: 28rpx;
}
.content_bootm_one {
height: 112rpx;
line-height: 112rpx;
background: #FFFFFF;
display: flex;
margin-top: 21rpx;
.bootm_oneimg {
width: 80rpx;
height: 80rpx;
margin: auto 0;
margin-left: 28rpx;
margin-right: 21rpx;
image {
width: 80rpx;
height: 80rpx;
}
}
}
}
.pay {
width: 100%;
height: 121rpx;
line-height:121rpx;
background: #FFFFFF;
position: absolute;
bottom: 0;
position: fixed;
display: flex;
justify-content: space-between;
padding: 0 28rpx;
.pay_tilte-a{
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
color: #333333;
span{
font-size: 42rpx;
font-family: PingFang SC;
font-weight: 500;
color: #F84221;
}
}
.pay_tilte-b{
width: 238rpx;
height: 74rpx;
line-height:74rpx;
text-align: center;
background: linear-gradient(90deg, #F98649 0%, #F34E45 100%);
border-radius: 37rpx 37rpx 37rpx 37rpx;
opacity: 1;
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
color: #FFFFFF;
margin: auto 0;
}
}
</style>

791
pages/users/online_warehousing/index.vue
View File

@ -1,460 +1,461 @@
<template> <template>
<view class="center"> <view class="center">
<view class="top"> <view class="top">
<view class="top-header"> <view class="top-header">
<view class="search"> <view class="search">
<view class="search-content acea-row row-middle"> <view class="search-content acea-row row-middle">
<text class="iconfont icon-sousuo"></text> <text class="iconfont icon-sousuo"></text>
<input v-model="where.store_name" confirm-type="search" placeholder="请输收货人手机号或订单号搜索" class="input" <input v-model="where.store_name" confirm-type="search" placeholder="请输收货人手机号或订单号搜索"
@confirm="handleSearch" /> class="input" @confirm="handleSearch" />
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<view class="bgc_img" v-if="this.shopList == ![]"> <view class="bgc_img" v-if="this.shopList == ![]">
<image src="@/static/images/empty-box.png" mode="widthFix"></image> <image src="@/static/images/empty-box.png" mode="widthFix"></image>
<view class="txt"> <view class="txt">
暂无商品订单~ 暂无商品订单~
</view> </view>
</view> </view>
<view class='list' v-else> <view class='list' v-else>
<block> <block>
<view class='item' v-for="(item,index) in shopList" :key="index"> <view class='item' v-for="(item,index) in shopList" :key="index">
<view > <view>
<view class='title acea-row row-between-wrapper'> <view class='title acea-row row-between-wrapper'>
<view class="acea-row row-middle left-wrapper"> <view class="acea-row row-middle left-wrapper">
{{item.merchant.mer_name}} {{item.merchant.mer_name}}
</view> </view>
</view> </view>
<view> <view>
<view> <view>
<block> <block>
<view class="_order"> <view class="_order">
订单号: {{item.order_sn}} 订单号: {{item.order_sn}}
</view> </view>
<view class='item-info acea-row row-between row-top' v-for="(items,indexs) in item.orderProduct" :key="indexs"> <view class='item-info acea-row row-between row-top'
<view class='pictrue'> v-for="(items,indexs) in item.orderProduct" :key="indexs">
<image :src="items.cart_info.product.image"> <view class='pictrue'>
</image> <image :src="items.cart_info.product.image">
</view> </image>
<view class='text'> </view>
<view class='_left'> <view class='text'>
{{items.cart_info.product.store_name}} <view class='_left'>
<view class=""> {{items.cart_info.product.store_name}}
{{items.cart_info.productAttr.sku}} <view class="">
</view> {{items.cart_info.productAttr.sku}}
</view> </view>
<view class="_right"> </view>
<view class='name'>￥{{items.cart_info.productAttr.price}}</view> <view class="_right">
<view class='name'>x {{items.product_num}}</view> <view class='name'>￥{{items.cart_info.productAttr.price}}</view>
</view> <view class='name'>x {{items.product_num}}</view>
<!-- <view class="totalfooter"> </view>
<!-- <view class="totalfooter">
<view class='bnt b-color' v-if="items.is_imported == 0 && item.orderProduct.length > 1" <view class='bnt b-color' v-if="items.is_imported == 0 && item.orderProduct.length > 1"
@click="importshop(items.order_id,items.product_id,items.product_sku)"> @click="importshop(items.order_id,items.product_id,items.product_sku)">
立即导入</view> 立即导入</view>
</view> --> </view> -->
</view> </view>
<view class="totalfooter"> <view class="totalfooter">
<view class='bnt b-color' v-if="item.orderProduct[indexs]" <view class='bnt b-color' v-if="!item.orderProduct[indexs]"
@click="importshop(item.order_id,item.orderProduct[indexs].product_id,item.orderProduct[indexs].product_sku)"> @click="importshop(item.order_id,item.orderProduct[indexs].product_id,item.orderProduct[indexs].product_sku)">
立即导入</view> 立即导入</view>
</view> </view>
</view> </view>
</block> </block>
</view> </view>
</view> </view>
<view class='totalPrice'>s <view class='totalPrice'>
共{{item.orderProduct.length}}件商品，总金额 共{{item.orderProduct.length}}件商品，总金额
<text class='money'>￥{{item.pay_price}}</text> <text class='money'>￥{{item.pay_price}}</text>
</view> </view>
<!-- <view class="totalfooter"> <!-- <view class="totalfooter">
<view class='bnt b-color' v-if="item.orderProduct[index]" <view class='bnt b-color' v-if="item.orderProduct[index]"
@click="importshop(item.order_id,item.orderProduct[index].product_id,item.orderProduct[index].cart_info.productAttr.product_sku)"> @click="importshop(item.order_id,item.orderProduct[index].product_id,item.orderProduct[index].cart_info.productAttr.product_sku)">
立即导入</view> 立即导入</view>
</view> --> </view> -->
</view> </view>
</view> </view>
</block> </block>
</view> </view>
<u-popup :show="show" @close="close" mode="center" bgColor='transparent'> <u-popup :show="show" @close="close" mode="center" bgColor='transparent'>
<image src="@/static/images/xianshang.png" mode="widthFix"></image> <image src="@/static/images/xianshang.png" mode="widthFix"></image>
<view class="popen"> <view class="popen">
<h4>{{title}}</h4> <h4>{{title}}</h4>
<view class="shuru"> <view class="shuru">
点击确定，返回商品管理 点击确定，返回商品管理
</view> </view>
<view class="btn"> <view class="btn">
<button class="btn_l" @click="closeasd()">取消</button> <button class="btn_l" @click="closeasd()">取消</button>
<button class="btn_r" @click="getback()">确定</button> <button class="btn_r" @click="getback()">确定</button>
</view> </view>
</view> </view>
</u-popup> </u-popup>
<!-- <Loading :loaded="loaded" :loading="loading"></Loading> --> <!-- <Loading :loaded="loaded" :loading="loading"></Loading> -->
</view> </view>
</template> </template>
<script> <script>
import { import {
getPreviewProDetail, getPreviewProDetail,
} from '@/api/store.js' } from '@/api/store.js'
import { import {
postImport postImport
} from '@/api/product.js' } from '@/api/product.js'
import { import {
getOrderList getOrderList
} from '@/api/order.js' } from '@/api/order.js'
import Loading from '@/components/Loading/index' import Loading from '@/components/Loading/index'
export default { export default {
data() { data() {
return { return {
shopList: [], shopList: [],
shopinfo: {}, shopinfo: {},
mer_id: '', mer_id: '',
keyword: '', keyword: '',
where: { where: {
page: 1, page: 1,
limit: 10, limit: 10,
status: 20, status: 20,
product_type: 98, product_type: 98,
store_name: '', store_name: '',
}, },
data: { data: {
product_id: '', product_id: '',
unique: "", unique: "",
order_id: '', order_id: '',
order_product_id: '', order_product_id: '',
order_unique: '' order_unique: ''
}, },
show: false, show: false,
title: '', title: '',
loaded: false, loaded: false,
} }
}, },
onLoad(option) { onLoad(option) {
console.log(option); // console.log(option);
this.mer_id = option.mer_id this.mer_id = option.mer_id
this.getList(); this.getList();
this.data.product_id = option.product_id this.data.product_id = option.product_id
this.data.unique = option.unique this.data.unique = option.unique
}, },
methods: { methods: {
handleSearch() { handleSearch() {
let that = this let that = this
that.loaded = false; that.loaded = false;
that.where.page = 1; that.where.page = 1;
that.shopList = []; that.shopList = [];
getOrderList(that.where, that.mer_id).then(res => { getOrderList(that.where, that.mer_id).then(res => {
console.log(res); console.log(res);
that.shopList = res.data.list that.shopList = res.data.list
console.log(that.shopList); console.log(that.shopList);
}) })
}, },
getList: function() { getList: function() {
if (this.loading || this.loaded) return; if (this.loading || this.loaded) return;
this.loading = true; this.loading = true;
getOrderList(this.where, this.mer_id).then(res => { getOrderList(this.where, this.mer_id).then(res => {
console.log(res); console.log(res);
this.shopList = res.data.list this.shopList = res.data.list
console.log(this.shopList); console.log(this.shopList);
}) })
}, },
importshop(order_id, product_id, unique) { importshop(order_id, product_id, unique) {
this.data.order_id = order_id this.data.order_id = order_id
this.data.order_product_id = product_id this.data.order_product_id = product_id
this.data.order_unique = unique this.data.order_unique = unique
console.log(this.data) console.log(this.data)
this.show = true this.show = true
postImport(this.mer_id, this.data).then(res => { postImport(this.mer_id, this.data).then(res => {
console.log(res); console.log(res);
this.title = res.message this.title = res.message
this.$util.Tips({ this.$util.Tips({
title: res.message title: res.message
}) })
}) })
}, },
close() { close() {
this.show = false this.show = false
}, },
closeasd: function() { closeasd: function() {
this.show = false this.show = false
getOrderList(this.where, this.mer_id).then(res => { getOrderList(this.where, this.mer_id).then(res => {
console.log(res); console.log(res);
this.shopList = res.data.list this.shopList = res.data.list
console.log(this.shopList); console.log(this.shopList);
}) })
}, },
getback() { getback() {
uni.navigateBack({ uni.navigateBack({
delta: 1 delta: 1
}); });
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.top { .top {
background-color: red; background-color: red;
.top-header { .top-header {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
z-index: 9999; z-index: 9999;
width: 100%; width: 100%;
background-color: #fff; background-color: #fff;
.search { .search {
padding: 17rpx 30rpx; padding: 17rpx 30rpx;
.search-content { .search-content {
width: 100%; width: 100%;
height: 60rpx; height: 60rpx;
padding: 0 30rpx; padding: 0 30rpx;
border-radius: 30rpx; border-radius: 30rpx;
background-color: #F5F5F5; background-color: #F5F5F5;
font-size: 26rpx; font-size: 26rpx;
} }
.iconfont { .iconfont {
margin-right: 10rpx; margin-right: 10rpx;
font-size: 26rpx; font-size: 26rpx;
color: #999999; color: #999999;
} }
.input-placeholder { .input-placeholder {
font-size: 26rpx; font-size: 26rpx;
color: #999999; color: #999999;
} }
.input { .input {
flex: 1; flex: 1;
} }
} }
} }
} }
.bgc_img { .bgc_img {
position: absolute; position: absolute;
top: 30vh; top: 30vh;
left: 10vw; left: 10vw;
image { image {
width: 300px; width: 300px;
} }
.txt { .txt {
text-align: center; text-align: center;
} }
} }
.list { .list {
width: 690rpx; width: 690rpx;
margin: 50px auto 0 auto; margin: 50px auto 0 auto;
.title { .title {
height: 84rpx; height: 84rpx;
padding: 0 30rpx; padding: 0 30rpx;
border-bottom: 1px solid #CCCCCC; border-bottom: 1px solid #CCCCCC;
font-size: 32rpx; font-size: 32rpx;
font-weight: 700; font-weight: 700;
color: #282828; color: #282828;
.left-wrapper { .left-wrapper {
.iconfont { .iconfont {
margin-top: 5rpx; margin-top: 5rpx;
} }
.store-name { .store-name {
margin: 0 10rpx; margin: 0 10rpx;
} }
.icon-xiangyou { .icon-xiangyou {
font-size: 20rpx; font-size: 20rpx;
} }
} }
.sign { .sign {
font-size: 24rpx; font-size: 24rpx;
padding: 0 7rpx; padding: 0 7rpx;
height: 36rpx; height: 36rpx;
margin-right: 15rpx; margin-right: 15rpx;
} }
} }
.item { .item {
background-color: #fff; background-color: #fff;
margin: 5px 0 5px 0; margin: 5px 0 5px 0;
.item-info { .item-info {
padding: 0 30rpx; padding: 0 30rpx;
margin-top: 22rpx; margin-top: 22rpx;
.pictrue { .pictrue {
width: 120rpx; width: 120rpx;
height: 120rpx; height: 120rpx;
image { image {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 6rpx; border-radius: 6rpx;
} }
} }
.text { .text {
width: 486rpx; width: 486rpx;
font-size: 28rpx; font-size: 28rpx;
color: #999; color: #999;
margin-top: 6rpx; margin-top: 6rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
._left { ._left {
width: 300rpx; width: 300rpx;
color: #282828; color: #282828;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.name { .name {
width: 100rpx; width: 100rpx;
color: #282828; color: #282828;
} }
.money { .money {
text-align: right; text-align: right;
float: right; float: right;
} }
} }
} }
.event_name { .event_name {
display: inline-block; display: inline-block;
margin-right: 9rpx; margin-right: 9rpx;
color: #fff; color: #fff;
font-size: 20rpx; font-size: 20rpx;
padding: 0 8rpx; padding: 0 8rpx;
line-height: 30rpx; line-height: 30rpx;
text-align: center; text-align: center;
border-radius: 6rpx; border-radius: 6rpx;
} }
.event_ship { .event_ship {
font-size: 20rpx; font-size: 20rpx;
margin-top: 10rpx; margin-top: 10rpx;
} }
._order { ._order {
font-size: 28rpx; font-size: 28rpx;
margin: 5px 0 0 15px; margin: 5px 0 0 15px;
} }
.totalPrice { .totalPrice {
font-size: 26rpx; font-size: 26rpx;
color: #282828; color: #282828;
text-align: right; text-align: right;
margin: 27rpx 0 0 30rpx; margin: 27rpx 0 0 30rpx;
padding: 0 30rpx 30rpx 0; padding: 0 30rpx 30rpx 0;
.money { .money {
font-size: 34rpx; font-size: 34rpx;
font-weight: bold; font-weight: bold;
color: rgb(233, 51, 35); color: rgb(233, 51, 35);
} }
} }
.totalfooter { .totalfooter {
width: 100%; width: 100%;
height: 50px; height: 50px;
position: relative; position: relative;
border-top: 1px solid #CCCCCC; border-top: 1px solid #CCCCCC;
.bnt { .bnt {
position: absolute; position: absolute;
right: 10px; right: 10px;
width: 176rpx; width: 176rpx;
height: 60rpx; height: 60rpx;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-radius: 50rpx; border-radius: 50rpx;
font-size: 27rpx; font-size: 27rpx;
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%); background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
color: white; color: white;
margin-left: 70%; margin-left: 70%;
margin-top: 5px; margin-top: 5px;
} }
} }
.bottom { .bottom {
height: 107rpx; height: 107rpx;
padding: 0 30rpx; padding: 0 30rpx;
border-top: 1px solid #f0f0f0; border-top: 1px solid #f0f0f0;
} }
} }
.event_price { .event_price {
margin: 0 0 50rpx 120rpx; margin: 0 0 50rpx 120rpx;
} }
} }
.popen { .popen {
position: absolute; position: absolute;
top: 110px; top: 110px;
width: 100%; width: 100%;
margin: auto; margin: auto;
padding: 10px; padding: 10px;
h4 { h4 {
font-weight: 400; font-weight: 400;
font-size: 20px; font-size: 20px;
padding: 5px; padding: 5px;
text-align: center; text-align: center;
} }
.guige { .guige {
margin: 10px 0 10px 20px; margin: 10px 0 10px 20px;
} }
.shuru { .shuru {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
font-size: 18px; font-size: 18px;
padding: 5px; padding: 5px;
} }
.btn { .btn {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
margin: 10px; margin: 10px;
.btn_l { .btn_l {
padding: 5px; padding: 5px;
width: 100px; width: 100px;
border-radius: 4px; border-radius: 4px;
} }
.btn_r { .btn_r {
width: 100px; width: 100px;
padding: 5px; padding: 5px;
border-radius: 4px; border-radius: 4px;
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%); background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
border-radius: 27px 27px 27px 27px; border-radius: 27px 27px 27px 27px;
color: white; color: white;
} }
} }
} }
</style> </style>

2
pages/users/order_list/index.vue
View File

@ -650,6 +650,7 @@
groupOrderList({ groupOrderList({
page: that.page, page: that.page,
limit: that.limit, limit: that.limit,
product_type:0
}).then(res => { }).then(res => {
that.isReady = true; that.isReady = true;
let list = res.data.list || []; let list = res.data.list || [];
@ -670,6 +671,7 @@
status: that.orderStatus - 1, status: that.orderStatus - 1,
page: that.page, page: that.page,
limit: that.limit, limit: that.limit,
product_type:0
}).then(res => { }).then(res => {
let list = res.data.list || []; let list = res.data.list || [];
let loadend = list.length < that.limit; let loadend = list.length < that.limit;

2
pages/users/order_list/indexCopy.vue
View File

@ -651,6 +651,7 @@
groupOrderList({ groupOrderList({
page: that.page, page: that.page,
limit: that.limit, limit: that.limit,
}).then(res => { }).then(res => {
that.isReady = true; that.isReady = true;
let list = res.data.list || []; let list = res.data.list || [];
@ -671,6 +672,7 @@
status: that.orderStatus - 1, status: that.orderStatus - 1,
page: that.page, page: that.page,
limit: that.limit, limit: that.limit,
product_type:98
}).then(res => { }).then(res => {
let list = res.data.list || []; let list = res.data.list || [];
let loadend = list.length < that.limit; let loadend = list.length < that.limit;

37
pages/users/releaseOrdermanagement/index.vue Normal file
View File

@ -0,0 +1,37 @@
<template>
<view class="">
<view class="">
</view>
</view>
</template>
<script>
export default {
data() {
return {
list:[{
name:在售
},
{
name:已售出
},
{
name:待审核
},
{
name:审核未通过
},
{
name:在售
}]
}
}
}
</script>
<style>
</style>

527
pages/users/trading_hall/index.vue
View File

@ -1,208 +1,371 @@
<template> <template>
<view> <view>
<view class="header"> <view class="header">
<view class="top-header"> <view class="top-header">
<view class="search"> <view class="search">
<view class="search-content acea-row row-middle"> <view class="search-content acea-row row-middle">
<text class="iconfont icon-sousuo"></text> <text class="iconfont icon-sousuo"></text>
<input v-model="where.keyword" confirm-type="search" placeholder="请输收货人手机号或订单号搜索" class="input" <input v-model="where.keyword" confirm-type="search" placeholder="请输入关键字" class="input"
@confirm="handleSearch" /> @confirm="handleSearch" />
</view> <view class="search_btn">
</view> <image src="@/static/images/serchbtn.png" mode="aspectFill"></image>
</view>
<view class="recom">
<view class="recom_bnt">
<rudon-rowMenuDotDotDot :localdata="options" @change="menuAction($event)">
{{this.recomname}}
</rudon-rowMenuDotDotDot>
</view>
</view>
</view>
<view class="type_switch">
<view class="recom_mend">
推荐
</view>
</view>
<view class="type_switch">
<view class="recom_mend">
调货
</view>
</view>
<view class="type_switch">
<view class="recom_mend">
打折专区
</view>
</view>
<view class="list">
<view class="item">
<image class="shopimg" src="@/static/images/2-002.png" mode="widthFix"></image>
<view class="item_text">
<span>调货</span> 夹岸数范德萨范德萨衣服上的
</view>
<view class="item_prices">
啊沙发上
</view>
<view class="item_name">
<image class="avater" src="../user_grade/images/suozi.png" mode="widthFix"></image>
<view class="item_name_text">
啊沙发上
</view>
</view>
</view>
</view>
</view>
</view> </view>
</view> </view>
<view class="recom">
<view class="recom_bnt">
<rudon-rowMenuDotDotDot :localdata="options" @change="menuAction($event)">
{{this.recomname}}
<view class="recom_sym">
<image src='@/static/images/arrow-bottom.png' mode="aspectFit"></image>
</view>
</rudon-rowMenuDotDotDot>
</view>
</view>
</view>
<view class="type_switch">
<view class="recom_mend" v-for="(item,i) in options" :key="i" :class="i==num?'tradcolor':''"
@click="btntap(i)">
{{item.text}}
<view :class="i==num?'tradline':''"></view>
</view>
</view>
<view class="list">
<view class="item" v-for='(item,index) in datatlist' :key='index' @click="shopping">
<image class="shopimg" :src="item.img" mode="aspectFit"></image>
<view class="item_text">
<span>{{item.txt}}</span> {{item.name}}
</view>
<view class="item_prices">
<span>￥</span>{{item.price}}
</view>
<view class="item_name">
<image class="avater" :src="item.img1" mode="aspectFit"></image>
<view class="item_name_text">
{{item.adess}}
</view>
</view>
</view>
</view>
<view class="tardimg_add" @click="open">
<!-- <img src="@/static/images/trad-add.png" mode="widthFix" alt=""> -->
<image src="@/static/images/trad-add.png" mode="aspectFit"></image>
</view>
<release :isShow='visible' :bottom='true' @close="closeMadle" @cancel="cancel" @confirm="confirm"></release>
</view>
</template> </template>
<script> <script>
import { methods } from '../../../uni_modules/uview-ui/libs/mixin/mixin' import {
export default { methods
data() { } from '../../../uni_modules/uview-ui/libs/mixin/mixin'
return { import release from '@/components/release/release.vue';
where: { export default {
page: 1, components: {
limit: 10, release
status: 20, },
product_type: 98, data() {
keyword: '', return {
}, where: {
options: [{ page: 1,
value: '0', limit: 10,
text: '推荐' status: 20,
}, product_type: 98,
{ keyword: '',
value: '1',
text: '调货' },
}, visible: false,
{ num: 0,
value: '2', options: [{
text: '打折专区' value: '0',
} text: '推荐'
], },
recomname: '', {
} value: '1',
}, text: '调货'
methods: { },
menuAction(action, rowId) { {
console.log(action); value: '2',
// 忽略初始化时的传入的空操作 text: '打折专区'
if (action === '') { }
this.recomname = this.options[0].text ],
} else { datatlist: [{
this.recomname = this.options[action].text img: require('@/static/images/2-002.png'),
} txt: "调货",
}, name: '焦糖山核桃味瓜子90g',
} price: '25.00',
} // ../user_grade/images/suozi.png
img1: require('@/static/images/2-002.png'),
adess: '张三生活超市'
}, {
img: require('@/static/images/2-002.png'),
txt: "委托销售",
name: '焦糖山核桃味瓜子90g',
price: '25.00',
// ../user_grade/images/suozi.png
img1: require('@/static/images/2-002.png'),
adess: '张三生活超市'
}, {
img: require('@/static/images/2-002.png'),
txt: "打折专区",
name: '焦糖山核桃味瓜子90g',
price: '25.00',
// ../user_grade/images/suozi.png
img1: require('@/static/images/2-002.png'),
adess: '张三生活超市'
}],
recomname: '',
}
},
methods: {
btntap(index) {
this.num = index
},
shopping(){
uni.navigateTo({
url:'/pages/trading_hall/product_details/index'
})
},
open() {
this.visible = true
},
closeMadle() {
this.visible = false
},
confirm() {
// 这里调用接口执行点击确定后的操作并关闭弹窗
console.log('点击了确认按钮')
this.visible = false
},
cancel() {
// 点击了取消按钮直接关闭弹窗
console.log('点击了取消按钮')
this.visible = false
},
menuAction(action, rowId) {
console.log(action);
// 忽略初始化时的传入的空操作
if (action === '') {
this.recomname = this.options[0].text
} else {
this.recomname = this.options[action].text
}
},
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.header { .header {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
background-color: #fff;
.top-header { .top-header {
z-index: 9999;
width: 80%;
background-color: #fff;
.search { width: 80%;
padding: 17rpx 30rpx;
.search-content { .search {
width: 100%; padding: 17rpx 30rpx;
height: 60rpx;
padding: 0 30rpx;
border-radius: 30rpx;
background-color: #F5F5F5;
font-size: 26rpx;
}
.iconfont { .search-content {
margin-right: 10rpx; width: 100%;
font-size: 26rpx; height: 60rpx;
color: #999999; padding-left: 30rpx;
} border-radius: 30rpx;
background-color: #F5F5F5;
font-size: 26rpx;
}
.input-placeholder { .iconfont {
font-size: 26rpx; margin-right: 10rpx;
color: #999999; font-size: 26rpx;
} color: #999999;
}
.input { .input-placeholder {
flex: 1; font-size: 26rpx;
} color: #999999;
} }
}
.recom { .input {
width: 78px; flex: 1;
height: 34px; }
text-align: center;
border-radius: 30px;
border: 1px solid #F84221;
display: flex;
justify-content: center;
align-items: center;
.recom_bnt {} .search_btn {
} width: 98rpx;
} height: 60rpx;
.list { margin-left: 20rpx;
width: 100%;
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
.item { image {
width: 45%; width: 98rpx;
margin: 9px; height: 60rpx;
}
}
}
.shopimg {
width: 100%;
}
.item_text {
width: 100%;
padding: 15px 10px 15px 10px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
span { }
height: 20px;
padding: 3px;
margin: 2px;
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
border-radius: 4px 0px 4px 0px;
color: white;
}
}
.item_prices { .recom {
font-size: 18px; width: 137rpx;
color: #F84221; height: 60rpx;
padding-left: 15px; text-align: center;
border-bottom: 1px solid #707070; border-radius: 30px;
} border: 1px solid #F84221;
display: flex;
justify-content: center;
align-items: center;
.item_name { .recom_bnt {
width: 100%; font-size: 32rpx;
height: 50px; font-family: 'PingFang SC';
display: flex; font-weight: 400;
align-items: center; color: #F84221;
.avater { .recom_sym {
margin: 5px; width: 28rpx;
width: 40px; height: 28rpx;
height: 40px; margin-left: 0rpx;
} image{
} width: 28rpx;
} height: 28rpx;
} margin-left: 10rpx;
}
}
}
}
}
.type_switch {
display: flex;
justify-content: space-around;
padding-top: 17rpx;
font-size: 18px;
background-color: #fff;
font-weight: 500;
color: #999999;
padding-bottom: 10rpx;
.tradcolor {
color: #F84221;
}
.tradline {
width: 26rpx;
opacity: 1;
border: 2rpx solid #F84221;
margin: 0 auto;
}
}
.tardimg_add {
position: absolute;
bottom: 193rpx;
right: 0rpx;
position: fixed;
width: 176rpx;
height: 176rpx;
image {
width: 176rpx;
height:176rpx;
}
}
.list {
width: 100%;
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
.item {
width: 336rpx;
height: 561rpx;
background-color: #fff;
margin-top: 21rpx;
margin-left: 25rpx;
border-radius: 14rpx 14rpx 0 0;
.shopimg {
width: 336rpx;
height: 314rpx
}
.item_text {
width: 100%;
padding: 15px 10px 15px 10px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
span {
height: 35rpx;
width: 100%;
padding: 3px;
margin: 2px;
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
border-radius: 7px 0px 7px 0px;
font-weight: 400;
color: #FFFFFF;
font-size: 25rpx;
}
}
.item_prices {
font-size: 18px;
color: #F84221;
padding-left: 15px;
border-bottom: 1px solid #707070;
}
.item_name {
width: 100%;
padding-left: 15rpx;
display: flex;
font-size: 28rpx;
font-family: 'PingFang SC';
font-weight: 400;
color: #333333;
.avater {
width: 60rpx;
height: 60rpx;
border-radius: 50%;
margin-top: 19rpx;
margin-right:10rpx ;
image{
width: 60rpx;
height: 60rpx;
display: block;
}
}
.item_name_text{
margin-top: 30rpx;
}
}
}
}
</style> </style>

53
pages/users/user_address/index.vue
View File

@ -17,22 +17,33 @@
<view class='name'>所在地区</view> <view class='name'>所在地区</view>
<view class="region"> <view class="region">
<view class="region_count" @click="changeRegion"> <view class="region_count" @click="changeRegion">
<text v-if="!addressInfo.length" style="color:#cdcdcd;">请选择地址</text> <text v-if="!addressInfo.length" style="color:#cdcdcd;">请选择地区</text>
<text v-else>{{addressText}}</text> <text v-else>{{addressText}}</text>
<text class="iconfont icon-xiangyou"></text> <text class="iconfont icon-xiangyou"></text>
</view> </view>
</view> </view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>所在村队</view>
<view class="region">
<view class="region_count" @click="changevillage">
<text v-if="!villageInfo.length" style="color:#cdcdcd;">请选择村队</text>
<text v-else>{{villageText}}</text>
<text class="iconfont icon-xiangyou"></text>
</view>
</view>
</view> </view>
<view class='item acea-row row-between-wrapper'> <view class='item acea-row row-between-wrapper'>
<view class='name'>详细地址</view> <view class='name'>详细地址</view>
<input type='text' class="location-input" placeholder='请填写具体地址' name='detail' <input type='text' class="location-input" placeholder='请填写具体地址' name='detail'
placeholder-class='placeholder' v-model="userAddress.detail"></input> placeholder-class='placeholder' v-model="userAddress.detail"></input>
<view class="location" @click="selfLocation"> <!--<view class="location" @click="selfLocation">
<text class="iconfont icon-chakanditu"></text> <text class="iconfont icon-chakanditu"></text>
<br> <br>
定位 定位
</view> </view> -->
</view> </view>
</view> </view>
@ -54,6 +65,9 @@
</form> </form>
<areaWindow ref="areaWindow" :display="display" :address="addressInfo" @submit="OnChangeAddress" <areaWindow ref="areaWindow" :display="display" :address="addressInfo" @submit="OnChangeAddress"
@changeClose="changeClose"></areaWindow> @changeClose="changeClose"></areaWindow>
<villageTeam ref="villageTeam" :display="display_one" :address="villageInfo" :villageaddress="list"
@submit="OnChangevAddress" @changeClose="changevClose"></villageTeam>
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
</view> </view>
</template> </template>
@ -80,6 +94,7 @@
mapGetters mapGetters
} from "vuex"; } from "vuex";
import areaWindow from '@/components/areaWindow'; import areaWindow from '@/components/areaWindow';
import villageTeam from '@/components/villageTeam/villageTeam.vue';
import { import {
getGeocoder getGeocoder
} from '@/api/store.js'; } from '@/api/store.js';
@ -88,6 +103,7 @@
components: { components: {
areaWindow, areaWindow,
authorize, authorize,
villageTeam
}, },
data() { data() {
return { return {
@ -107,7 +123,10 @@
multiIndex: [0, 0, 0], multiIndex: [0, 0, 0],
cityId: 0, cityId: 0,
display: false, display: false,
display_one: false,
addressInfo: [], addressInfo: [],
villageInfo: [],
list: [],
latitude: '', latitude: '',
longitude: '' longitude: ''
}; };
@ -116,6 +135,9 @@
...mapGetters(['isLogin', 'viewColor']), ...mapGetters(['isLogin', 'viewColor']),
addressText() { addressText() {
return this.addressInfo.map(v => v.name).join('/'); return this.addressInfo.map(v => v.name).join('/');
},
villageText() {
return this.villageInfo.map(v => v.name).join('/');
} }
}, },
onLoad(options) { onLoad(options) {
@ -137,6 +159,11 @@
methods: { methods: {
OnChangeAddress(address) { OnChangeAddress(address) {
this.addressInfo = address; this.addressInfo = address;
this.list = address
},
OnChangevAddress(address) {
this.villageInfo = address;
console.log(this.villageInfo)
}, },
// 地址数据 // 地址数据
getCityList: function() { getCityList: function() {
@ -148,10 +175,16 @@
changeRegion() { changeRegion() {
this.display = true; this.display = true;
}, },
changevillage() {
this.display_one = true;
},
// 关闭地址弹窗； // 关闭地址弹窗；
changeClose: function() { changeClose: function() {
this.display = false; this.display = false;
}, },
changevClose: function() {
this.display_one = false;
},
// 授权回调 // 授权回调
onLoadFun: function() { onLoadFun: function() {
this.isShowAuth = false; this.isShowAuth = false;
@ -171,11 +204,12 @@
if (!this.address_id) return false; if (!this.address_id) return false;
let that = this; let that = this;
getAddressDetail(this.address_id).then(res => { getAddressDetail(this.address_id).then(res => {
let region = [res.data.province, res.data.city, res.data.district]; let region = [res.data.province, res.data.city, res.data.district, res.data.street, res.data.village];
that.$set(that, 'userAddress', res.data); that.$set(that, 'userAddress', res.data);
that.$set(that, 'region', region); that.$set(that, 'region', region);
that.city_id = res.data.city_id that.city_id = res.data.city_id
that.addressInfo = res.data.area that.addressInfo = res.data.areas
that.villageInfo = [res.data.brigade]
}); });
}, },
// 导入共享地址（小程序） // 导入共享地址（小程序）
@ -240,17 +274,14 @@
// console.log(err); // console.log(err);
}); });
}, },
selfLocation() { selfLocation() {
console.log(66)
let self = this let self = this
uni.showLoading({ uni.showLoading({
title: '定位中', title: '定位中',
mask: true, mask: true,
}); });
uni.getLocation({ uni.getLocation({
type: 'wgs84', type: 'gcj02',
timeout: '10',
success: (res) => { success: (res) => {
let latitude, longitude; let latitude, longitude;
latitude = res.latitude.toString(); latitude = res.latitude.toString();
@ -316,12 +347,16 @@
if (!that.addressInfo.length) return that.$util.Tips({ if (!that.addressInfo.length) return that.$util.Tips({
title: '请选择所在地区' title: '请选择所在地区'
}); });
if (!that.villageInfo.length) return that.$util.Tips({
title: '请选择所在村队'
});
if (!value.detail) return that.$util.Tips({ if (!value.detail) return that.$util.Tips({
title: '请填写详细地址' title: '请填写详细地址'
}); });
value.address_id = that.address_id; value.address_id = that.address_id;
value.is_default = that.userAddress.is_default ? 1 : 0; value.is_default = that.userAddress.is_default ? 1 : 0;
value.area = that.addressInfo; value.area = that.addressInfo;
value.brigade=that.villageInfo[0]
uni.showLoading({ uni.showLoading({
title: '保存中', title: '保存中',

BIN
static/images/arrow-bottom.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 196 B

BIN
static/images/discounts.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.4 KiB

BIN
static/images/season.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

BIN
static/images/serchbtn.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
static/images/sym.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
static/images/trad-add.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.4 KiB

BIN
static/images/trad-close.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 25 KiB

18
uni_modules/uni-share/changelog.md Normal file
View File

@ -0,0 +1,18 @@
## 2.0.2（2021-12-16）
修复在某些情况下报：`Cannot read property 'hide' of undefined`的问题
## 2.0.1（2021-11-29）
修改错误的scene值WXSenceTimeline(分享到朋友圈)更正为WXSceneTimeline
## 2.0.0（2021-10-14）
支持监听返回操作(如：物理返回，全面屏手机侧滑)关闭分享弹窗
## 1.0.6（2021-08-25）
兼容vue3
## 1.0.5（2021-08-05）
优化代码实现，修改原来用`eval()`函数实现的逻辑
## 1.0.4（2021-06-07）
为符合苹果应用市场的审核，只显示存在对应的分享客户端的选项。如：配置包含微信分享，但是用户手机上并没有安装微信，就不显示微信分享。
## 1.0.2（2021-05-06）
修复错误的提示：“打包时未添加oauth模块”
## 1.0.1（2021-04-30）
新增完整示例
## 1.0.0（2021-04-28）
第1版发布

204
uni_modules/uni-share/js_sdk/uni-image-menu.js Normal file
View File

@ -0,0 +1,204 @@
var nvMask, nvImageMenu;
class NvImageMenu {
constructor(arg) {
this.isShow = false
}
show({
list,
cancelText
}, callback) {
if (!list) {
list = [{
"img": "/static/sharemenu/wechatfriend.png",
"text": "图标文字"
}]
}
//以下为计算菜单的nview绘制布局，为固定算法，使用者无关关心
var screenWidth = plus.screen.resolutionWidth
//以360px宽度屏幕为例，上下左右边距及2排按钮边距留25像素，图标宽度55像素，同行图标间的间距在360宽的屏幕是30px，但需要动态计算，以此原则计算4列图标分别的left位置
//图标下的按钮文字距离图标5像素，文字大小12像素
//底部取消按钮高度固定为44px
//TODO 未处理横屏和pad，这些情况6个图标应该一排即可
var margin = 20,
iconWidth = 60,
icontextSpace = 5,
textHeight = 12
var left1 = margin / 360 * screenWidth
var iconSpace = (screenWidth - (left1 * 2) - (iconWidth * 4)) / 3 //屏幕宽度减去左右留白间距，再减去4个图标的宽度，就是3个同行图标的间距
if (iconSpace <= 5) { //屏幕过窄时，缩小边距和图标大小，再算一次
margin = 15
iconWidth = 40
left1 = margin / 360 * screenWidth
iconSpace = (screenWidth - (left1 * 2) - (iconWidth * 4)) / 3 //屏幕宽度减去左右留白间距，再减去4个图标的宽度，就是3个同行图标的间距
}
var left2 = left1 + iconWidth + iconSpace
var left3 = left1 + (iconWidth + iconSpace) * 2
var left4 = left1 + (iconWidth + iconSpace) * 3
var top1 = left1
var top2 = top1 + iconWidth + icontextSpace + textHeight + left1
const TOP = {
top1,
top2
},
LEFT = {
left1,
left2,
left3,
left4
};
nvMask = new plus.nativeObj.View("nvMask", { //先创建遮罩层
top: '0px',
left: '0px',
height: '100%',
width: '100%',
backgroundColor: 'rgba(0,0,0,0.2)'
});
nvImageMenu = new plus.nativeObj.View("nvImageMenu", { //创建底部图标菜单
bottom: '0px',
left: '0px',
height: (iconWidth + textHeight + 2 * margin) * Math.ceil(list.length / 4) + 44 +
'px', //'264px',
width: '100%',
backgroundColor: 'rgb(255,255,255)'
});
nvMask.addEventListener("click", () => { //处理遮罩层点击
// console.log('处理遮罩层点击');
this.hide()
callback({
event: "clickMask"
})
})
let myList = []
list.forEach((item, i) => {
myList.push({
tag: 'img',
src: item.img,
position: {
top: TOP['top' + (parseInt(i / 4) + 1)],
left: LEFT['left' + (1 + i % 4)],
width: iconWidth,
height: iconWidth
}
})
myList.push({
tag: 'font',
text: item.text,
textStyles: {
size: textHeight
},
position: {
top: TOP['top' + (parseInt(i / 4) + 1)] + iconWidth + icontextSpace,
left: LEFT['left' + (1 + i % 4)],
width: iconWidth,
height: textHeight
}
})
})
//绘制底部图标菜单的内容
nvImageMenu.draw([{
tag: 'rect', //菜单顶部的分割灰线
color: '#e7e7e7',
position: {
top: '0px',
height: '1px'
}
},
{
tag: 'font',
text: cancelText, //底部取消按钮的文字
textStyles: {
size: '14px'
},
position: {
bottom: '0px',
height: '44px'
}
},
{
tag: 'rect', //底部取消按钮的顶部边线
color: '#e7e7e7',
position: {
bottom: '45px',
height: '1px'
}
},
...myList
])
nvMask.show()
nvImageMenu.show()
// 开始动画
/*
plus.nativeObj.View.startAnimation({
type: 'slide-in-bottom',
duration: 300
}, nvImageMenu, {}, function() {
console.log('plus.nativeObj.View.startAnimation动画结束');
// 关闭原生动画
plus.nativeObj.View.clearAnimation();
nvImageMenu.show()
});
*/
this.isShow = true
nvImageMenu.addEventListener("click", e => { //处理底部图标菜单的点击事件，根据点击位置触发不同的逻辑
// console.log("click menu"+JSON.stringify(e));
if (e.screenY > plus.screen.resolutionHeight - 44) { //点击了底部取消按钮
// callback({event:"clickCancelButton"})
this.hide()
} else if (e.clientX < 5 || e.clientX > screenWidth - 5 || e.clientY < 5) {
//屏幕左右边缘5像素及菜单顶部5像素不处理点击
} else { //点击了图标按钮
var iClickIndex = -1 //点击的图标按钮序号，第一个图标按钮的index为0
var iRow = e.clientY < (top2 - (left1 / 2)) ? 0 : 1
var iCol = -1
if (e.clientX < (left2 - (iconSpace / 2))) {
iCol = 0
} else if (e.clientX < (left3 - (iconSpace / 2))) {
iCol = 1
} else if (e.clientX < (left4 - (iconSpace / 2))) {
iCol = 2
} else {
iCol = 3
}
if (iRow == 0) {
iClickIndex = iCol
} else {
iClickIndex = iCol + 4
}
// console.log("点击按钮的序号: " + iClickIndex);
// if (iClickIndex >= 0 && iClickIndex <= 5) { //处理具体的点击逻辑，此处也可以自行定义逻辑。如果增减了按钮，此处也需要跟着修改
// }
callback({
event: "clickMenu",
index: iClickIndex
})
}
})
/* nvImageMenu.addEventListener("touchstart", function(e) {
if (e.screenY > (plus.screen.resolutionHeight - 44)) {
//TODO 这里可以处理按下背景变灰的效果
}
})
nvImageMenu.addEventListener("touchmove", function(e) {
//TODO 这里可以处理按下背景变灰的效果
if (e.screenY > plus.screen.resolutionHeight - 44) {}
})
nvImageMenu.addEventListener("touchend", function(e) {
//TODO 这里可以处理释放背景恢复的效果
})
*/
}
hide() {
if (this.isShow) {
nvMask.hide()
nvImageMenu.hide()
this.isShow = false
}
}
}
export default NvImageMenu

98
uni_modules/uni-share/js_sdk/uni-share.js Normal file
View File

@ -0,0 +1,98 @@
import UniImageMenu from './uni-image-menu.js';
class UniShare extends UniImageMenu{
constructor(arg) {
super()
this.isShow = super.isShow
}
async show(param, callback){
var menus = []
plus.share.getServices(services => { //只显示有服务的项目
services = services.filter(item => item.nativeClient)
let servicesList = services.map(e => e.id)
param.menus.forEach(item => {
if (servicesList.includes(item.share.provider) || typeof(item.share) == 'string') {
menus.push(item)
}
})
super.show({
list: menus,
cancelText: param.cancelText
}, e => {
callback(e)
if(e.event == 'clickMenu'){
if (typeof(menus[e.index]['share']) == 'string') {
this[menus[e.index]['share']](param)
} else {
uni.share({
...param.content,
...menus[e.index].share,
success: res=> {
console.log("success:" + JSON.stringify(res));
super.hide()
},
fail: function(err) {
console.log("fail:" + JSON.stringify(err));
uni.showModal({
content: JSON.stringify(err),
showCancel: false,
confirmText: "知道了"
});
}
})
}
}
})
}, err => {
uni.showModal({
title: '获取服务供应商失败：' + JSON.stringify(err),
showCancel: false,
confirmText: '知道了'
});
console.error('获取服务供应商失败：' + JSON.stringify(err));
})
}
hide(){
super.hide()
}
copyurl(param) {
console.log('copyurl',param);
uni.setClipboardData({
data: param.content.href,
success: ()=>{
console.log('success');
uni.hideToast() //关闭自带的toast
uni.showToast({
title: '复制成功',
icon: 'none'
});
super.hide();
},
fail: (err) => {
uni.showModal({
content: JSON.stringify(err),
showCancel: false
});
}
});
}
// 使用系统分享发送分享消息
shareSystem(param) {
console.log('shareSystem',param);
plus.share.sendWithSystem({
type: 'text',
content: param.content.title + param.content.summary || '',
href: param.content.href,
}, (e)=> {
console.log('分享成功');
super.hide()
}, (err)=> {
console.log('分享失败：' + JSON.stringify(err));
uni.showModal({
title: '获取服务供应商失败：' + JSON.stringify(err),
showCancel: false,
confirmText: '知道了'
});
});
}
}
export default UniShare

80
uni_modules/uni-share/package.json Normal file
View File

@ -0,0 +1,80 @@
{
"id": "uni-share",
"displayName": "uni-share",
"version": "2.0.2",
"description": "底部弹出宫格图标式的分享菜单，可覆盖原生组件。",
"keywords": [
"分享菜单"
],
"repository": "",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"category": [
"JS SDK",
"通用 SDK"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "n",
"Android Browser": "n",
"微信浏览器(Android)": "n",
"QQ浏览器(Android)": "n"
},
"H5-pc": {
"Chrome": "n",
"IE": "n",
"Edge": "n",
"Firefox": "n",
"Safari": "n"
},
"小程序": {
"微信": "n",
"阿里": "n",
"百度": "n",
"字节跳动": "n",
"QQ": "n"
},
"快应用": {
"华为": "n",
"联盟": "n"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

95
uni_modules/uni-share/readme.md Normal file
View File

@ -0,0 +1,95 @@
#### 本功能基于[底部图标菜单](https://ext.dcloud.net.cn/plugin?id=4858)封装而成。
### 示例代码
```
<template>
<button type="default" @click="uniShare">显示</button>
</template>
<script>
import uniShare from '@/uni_modules/uni-share/js_sdk/uni-share.js';
export default {
onBackPress({from}) {
console.log(from);
if(from=='backbutton'){
this.$nextTick(function(){
uniShare.hide()
})
return uniShare.isShow;
}
},
methods: {
uniShare() {
uniShare.show({
content: { //公共的分享参数配置 类型（type）、链接（herf）、标题（title）、summary（描述）、imageUrl（缩略图）
type: 0,
href: 'https://uniapp.dcloud.io/',
title: '标题',
summary: '描述',
imageUrl: 'https://img-cdn-aliyun.dcloud.net.cn/stream/icon/__UNI__HelloUniApp.png'
},
menus: [{
"img": "/static/app-plus/sharemenu/wechatfriend.png",
"text": "微信好友",
"share": { //当前项的分享参数配置。可覆盖公共的配置如下：分享到微信小程序，配置了type=5
"provider": "weixin",
"scene": "WXSceneSession"
}
},
{
"img": "/static/app-plus/sharemenu/wechatmoments.png",
"text": "微信朋友圈",
"share": {
"provider": "weixin",
"scene": "WXSceneTimeline"
}
},
{
"img": "/static/app-plus/sharemenu/mp_weixin.png",
"text": "微信小程序",
"share": {
provider: "weixin",
scene: "WXSceneSession",
type: 5,
miniProgram: {
id: '123',
path: '/pages/list/detail',
webUrl: '/#/pages/list/detail',
type: 0
},
}
},
{
"img": "/static/app-plus/sharemenu/weibo.png",
"text": "微博",
"share": {
"provider": "sinaweibo"
}
},
{
"img": "/static/app-plus/sharemenu/qq.png",
"text": "QQ",
"share": {
"provider": "qq"
}
},
{
"img": "/static/app-plus/sharemenu/copyurl.png",
"text": "复制",
"share": "copyurl"
},
{
"img": "/static/app-plus/sharemenu/more.png",
"text": "更多",
"share": "shareSystem"
}
],
cancelText: "取消分享",
}, e => { //callback
console.log(uniShare.isShow);
console.log(e);
})
}
}
}
</script>
```