|
|
|
@ -1,7 +1,12 @@ |
|
|
|
<template> |
|
|
|
<view> |
|
|
|
<view style="position: relative"> |
|
|
|
<view v-if="hasCompany && hasLogin" class="wrapper"> |
|
|
|
<uni-nav-bar :fixed="true" color="#ffffff" background-color="#ffffff" :status-bar="true"> |
|
|
|
<uni-nav-bar |
|
|
|
:fixed="true" |
|
|
|
color="#ffffff" |
|
|
|
background-color="#ffffff" |
|
|
|
:status-bar="true" |
|
|
|
> |
|
|
|
<view slot="left" class="left-title">纸商城</view> |
|
|
|
<view slot="right" class="right-title" @tap="shareTap">分享</view> |
|
|
|
</uni-nav-bar> |
|
|
|
@ -9,23 +14,42 @@ |
|
|
|
<view class=""><image class="image" :src="logo" mode=""></image></view> |
|
|
|
<view class="center"> |
|
|
|
<view class="title">{{ storeInformation.name }}</view> |
|
|
|
<view class="desc">全部商品 {{ storeInformation.productNumber }} | 上新 {{ storeInformation.currentProductNumber }}</view> |
|
|
|
<view class="desc" |
|
|
|
>全部商品 {{ storeInformation.productNumber }} | 上新 |
|
|
|
{{ storeInformation.currentProductNumber }}</view |
|
|
|
> |
|
|
|
</view> |
|
|
|
<view class="right"> |
|
|
|
<view class="cut" @click="checkMall()"> |
|
|
|
切换商城 |
|
|
|
<image class="cut-icon" src="/static/imgs/mall/cut-icon.png" mode=""></image> |
|
|
|
<image |
|
|
|
class="cut-icon" |
|
|
|
src="/static/imgs/mall/cut-icon.png" |
|
|
|
mode="" |
|
|
|
></image> |
|
|
|
</view> |
|
|
|
<view class="set" @click="setting">设置</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view> |
|
|
|
<scroll-list ref="list" :option="option" @load="upCallback" @refresh="downCallback"> |
|
|
|
<view v-for="(item, index) in listData" :key="index" style="margin-bottom: 20rpx"> |
|
|
|
<scroll-list |
|
|
|
ref="list" |
|
|
|
:option="option" |
|
|
|
@load="upCallback" |
|
|
|
@refresh="downCallback" |
|
|
|
> |
|
|
|
<view |
|
|
|
v-for="(item, index) in listData" |
|
|
|
:key="index" |
|
|
|
style="margin-bottom: 20rpx" |
|
|
|
> |
|
|
|
<view class="content" @click="detailInfo(item)"> |
|
|
|
<image |
|
|
|
class="image" |
|
|
|
:src="item.litPicUrl || 'https://qncloud.oss-cn-shenzhen.aliyuncs.com/paper_shopkeeper/paper-default-small.png'" |
|
|
|
:src=" |
|
|
|
item.litPicUrl || |
|
|
|
'https://qncloud.oss-cn-shenzhen.aliyuncs.com/paper_shopkeeper/paper-default-small.png' |
|
|
|
" |
|
|
|
mode="" |
|
|
|
></image> |
|
|
|
<view class="" style="width: 100%"> |
|
|
|
@ -34,24 +58,47 @@ |
|
|
|
<view class=""> |
|
|
|
<image |
|
|
|
class="icon" |
|
|
|
:src="item.status === 30111 ? '/static/imgs/mall/grounding-icon.png' : '/static/imgs/mall/sold-out-icon.png'" |
|
|
|
:src=" |
|
|
|
item.status === 30111 |
|
|
|
? '/static/imgs/mall/grounding-icon.png' |
|
|
|
: '/static/imgs/mall/sold-out-icon.png' |
|
|
|
" |
|
|
|
mode="" |
|
|
|
></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="sub-title">{{ item.manufacturerName }}/{{ item.categoryName }}/{{ item.brandName }}</view> |
|
|
|
<view class="desc flex-row-center-start" style="flex-wrap: wrap"> |
|
|
|
<view class="sub-title" |
|
|
|
>{{ item.manufacturerName }}/{{ item.categoryName }}/{{ |
|
|
|
item.brandName |
|
|
|
}}</view |
|
|
|
> |
|
|
|
<view |
|
|
|
class="desc flex-row-center-start" |
|
|
|
style="flex-wrap: wrap" |
|
|
|
> |
|
|
|
克重(价格)： |
|
|
|
<text style="margin-right: 8rpx" v-for="(sku, index) in item.skuList" :key="index">{{ sku.weight }}g({{ sku.listPrice }}元)</text> |
|
|
|
<text |
|
|
|
style="margin-right: 8rpx" |
|
|
|
v-for="(sku, index) in item.skuList" |
|
|
|
:key="index" |
|
|
|
>{{ sku.weight }}g({{ sku.listPrice }}元)</text |
|
|
|
> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="other"> |
|
|
|
<view class="time">{{ item.updateTime | timeFilter }}</view> |
|
|
|
<view class="btn"> |
|
|
|
<view class="" @click="editPaper(item)" v-if="item.status === 30112">编辑</view> |
|
|
|
<view |
|
|
|
class="" |
|
|
|
@click="editPaper(item)" |
|
|
|
v-if="item.status === 30112" |
|
|
|
>编辑</view |
|
|
|
> |
|
|
|
<view class="divide"></view> |
|
|
|
<view class="" @click="productStatusChange(item)">{{ item.status === 30111 ? '下架' : '上架' }}</view> |
|
|
|
<view class="" @click="productStatusChange(item)">{{ |
|
|
|
item.status === 30111 ? '下架' : '上架' |
|
|
|
}}</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -61,17 +108,65 @@ |
|
|
|
</scroll-list> |
|
|
|
</view> |
|
|
|
<view> |
|
|
|
<view class="offer-prices" @click="nativeTo()"><image class="my-image" src="../../static/imgs/trade/camera.png"></image></view> |
|
|
|
<view class="offer-prices" @click="nativeTo()" |
|
|
|
><image |
|
|
|
class="my-image" |
|
|
|
src="../../static/imgs/trade/camera.png" |
|
|
|
></image |
|
|
|
></view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view v-else> |
|
|
|
<uni-nav-bar :fixed="true" :status-bar="true"> |
|
|
|
<view slot="left" style="font-size: 40rpx; color: #000000">纸商城</view> |
|
|
|
</uni-nav-bar> |
|
|
|
<view v-if="hasLogin && !hasCompany" class="flex-col-center-center" style="margin-top: 100rpx"> |
|
|
|
<text style="font-size: 30rpx; text-align: center; font-weight: 600">请先完善企业基本信息</text> |
|
|
|
<view |
|
|
|
v-if="hasLogin && !hasCompany" |
|
|
|
class="flex-col-center-center" |
|
|
|
style="margin-top: 100rpx" |
|
|
|
> |
|
|
|
<text style="font-size: 30rpx; text-align: center; font-weight: 600" |
|
|
|
>请先完善企业基本信息</text |
|
|
|
> |
|
|
|
</view> |
|
|
|
<view class="" v-if="!hasLogin" |
|
|
|
><not-logged @loginChange="loginChange()"></not-logged |
|
|
|
></view> |
|
|
|
</view> |
|
|
|
<view class="flex-col section_4" v-show="visible"> |
|
|
|
<image |
|
|
|
src="/static/imgs/mall/close-icon.png" |
|
|
|
class="image_9" |
|
|
|
@click="closeShare" |
|
|
|
/> |
|
|
|
<!-- <view class="flex-col section_5"> |
|
|
|
<view class="flex-col section_6"> |
|
|
|
<view class="flex-col items-center group_13"> |
|
|
|
<image src="/static/imgs/mall/border-bg.png" class="image_10" /> |
|
|
|
<image :src="shareInfo.storeCodeImg" class="image_11" /> |
|
|
|
</view> |
|
|
|
<view class="flex-col items-center group_14"> |
|
|
|
<text class="text_15">{{ shareInfo.storeName }}</text> |
|
|
|
<text class="text_16">每天上新特价纸，库存有限先到先得</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
<canvas |
|
|
|
style=" |
|
|
|
width: 280px; |
|
|
|
height: 355px; |
|
|
|
margin-top: 15px; |
|
|
|
padding: 60rpx 0; |
|
|
|
border-radius: 20rpx; |
|
|
|
" |
|
|
|
canvas-id="posters" |
|
|
|
id="posters" |
|
|
|
></canvas> |
|
|
|
<view class="bottom-group flex-row view_3"> |
|
|
|
<text>下载海报</text> |
|
|
|
<text class="text_18">下载二维码</text> |
|
|
|
<text class="text_19">分享</text> |
|
|
|
</view> |
|
|
|
<view class="" v-if="!hasLogin"><not-logged @loginChange="loginChange()"></not-logged></view> |
|
|
|
</view> |
|
|
|
<!-- <view class="share-area" v-if="visible" @click="closeShare"> |
|
|
|
<view class="share-content"> |
|
|
|
@ -88,9 +183,9 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
<view v-if="visible" @click="closeShare"> |
|
|
|
<!-- <web-view :webview-styles="webviewStyles" src="/hybrid/html/share.html"></web-view> --> |
|
|
|
</view> |
|
|
|
<!-- <view v-if="visible" @click="closeShare"> |
|
|
|
<web-view :webview-styles="webviewStyles" src="/hybrid/html/share.html"></web-view> |
|
|
|
</view> --> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
@ -98,7 +193,12 @@ |
|
|
|
import notLogged from '@/components/not-logged/not-logged.vue' |
|
|
|
import uGap from '@/components/u-gap/u-gap.vue' |
|
|
|
import { back, go2, loginGo2, screenShot } from '@/utils/hook.js' |
|
|
|
import { SupplierList, productStatus, storeDetail, getSupplierQrCode } from '@/apis/add-paper.js' |
|
|
|
import { |
|
|
|
SupplierList, |
|
|
|
productStatus, |
|
|
|
storeDetail, |
|
|
|
getSupplierQrCode, |
|
|
|
} from '@/apis/add-paper.js' |
|
|
|
import { getTimer } from '@/utils/index.js' |
|
|
|
import noData from './no-data.vue' |
|
|
|
export default { |
|
|
|
@ -110,30 +210,31 @@ export default { |
|
|
|
abs = getTimer(value) |
|
|
|
} |
|
|
|
return abs |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
shareInfo: { |
|
|
|
storeCodeImg: '', |
|
|
|
storeName: '' |
|
|
|
storeName: '', |
|
|
|
}, |
|
|
|
visible: false, // 分享弹窗 |
|
|
|
canvasReady: false, |
|
|
|
storeInformation: { |
|
|
|
supplierId: null, |
|
|
|
name: null, |
|
|
|
productNumber: 0, |
|
|
|
currentProductNumber: 0 |
|
|
|
currentProductNumber: 0, |
|
|
|
}, |
|
|
|
option: { |
|
|
|
size: 10, |
|
|
|
auto: true, |
|
|
|
emptyText: '暂无数据~', |
|
|
|
disabled: false |
|
|
|
disabled: false, |
|
|
|
}, |
|
|
|
pattern: { |
|
|
|
backgroundColor: '#007AFF', |
|
|
|
buttonColor: '#007AFF' |
|
|
|
buttonColor: '#007AFF', |
|
|
|
}, |
|
|
|
content: [], |
|
|
|
horizontal: 'right', |
|
|
|
@ -144,12 +245,13 @@ export default { |
|
|
|
pageSize: 10, |
|
|
|
storeId: null, |
|
|
|
name: null, |
|
|
|
supplierId: this.$store.state.supplierInfo.supplierId |
|
|
|
supplierId: this.$store.state.supplierInfo.supplierId, |
|
|
|
}, |
|
|
|
listData: [], |
|
|
|
logo: '/static/imgs/mine/user-avatar.png', |
|
|
|
backgroundStyle: 'background: url("/static/imgs/mall/top-bg.png") no-repeat;', |
|
|
|
storeInfo: '' |
|
|
|
backgroundStyle: |
|
|
|
'background: url("/static/imgs/mall/top-bg.png") no-repeat;', |
|
|
|
storeInfo: '', |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
@ -158,12 +260,12 @@ export default { |
|
|
|
}, |
|
|
|
hasLogin() { |
|
|
|
return this.$store.state.qnToken != '' |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
onShow() { |
|
|
|
if (this.hasCompany) { |
|
|
|
this.storeInformation = { |
|
|
|
supplierId: this.$store.state.supplierInfo.supplierId |
|
|
|
supplierId: this.$store.state.supplierInfo.supplierId, |
|
|
|
} |
|
|
|
this.downCallback() |
|
|
|
this.getSupplier(this.$store.state.supplierInfo.supplierId) |
|
|
|
@ -185,7 +287,11 @@ export default { |
|
|
|
if (res) { |
|
|
|
this.storeInfo = res |
|
|
|
this.$set(this.storeInformation, 'productNumber', res.productNumber) |
|
|
|
this.$set(this.storeInformation, 'currentProductNumber', res.currentProductNumber) |
|
|
|
this.$set( |
|
|
|
this.storeInformation, |
|
|
|
'currentProductNumber', |
|
|
|
res.currentProductNumber |
|
|
|
) |
|
|
|
this.$set(this.storeInformation, 'name', res.name) |
|
|
|
if (!res.logo) { |
|
|
|
this.logo = '/static/imgs/mine/user-avatar.png' |
|
|
|
@ -193,9 +299,11 @@ export default { |
|
|
|
this.logo = res.logo |
|
|
|
} |
|
|
|
if (!res.backgroundImg) { |
|
|
|
this.backgroundStyle = 'background: url("/static/imgs/mall/top-bg.png") no-repeat;' |
|
|
|
this.backgroundStyle = |
|
|
|
'background: url("/static/imgs/mall/top-bg.png") no-repeat;' |
|
|
|
} else { |
|
|
|
this.backgroundStyle = 'background: url(' + res.backgroundImg + ') no-repeat;' |
|
|
|
this.backgroundStyle = |
|
|
|
'background: url(' + res.backgroundImg + ') no-repeat;' |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
@ -249,7 +357,7 @@ export default { |
|
|
|
// 按钮点击事件 |
|
|
|
nativeTo() { |
|
|
|
var params = { |
|
|
|
title: '添加纸品' |
|
|
|
title: '添加纸品', |
|
|
|
} |
|
|
|
go2('add-paper', params) |
|
|
|
}, |
|
|
|
@ -257,7 +365,7 @@ export default { |
|
|
|
editPaper(item) { |
|
|
|
var params = { |
|
|
|
...item, |
|
|
|
title: '编辑纸品' |
|
|
|
title: '编辑纸品', |
|
|
|
} |
|
|
|
go2('add-paper', params) |
|
|
|
}, |
|
|
|
@ -273,13 +381,13 @@ export default { |
|
|
|
productStatusChange(item) { |
|
|
|
var params = { |
|
|
|
id: item.id, |
|
|
|
status: item.status === 30111 ? 30112 : 30111 |
|
|
|
status: item.status === 30111 ? 30112 : 30111, |
|
|
|
} |
|
|
|
productStatus(params).then((res) => { |
|
|
|
if (res) { |
|
|
|
uni.showToast({ |
|
|
|
title: '状态修改成功', |
|
|
|
icon: 'success' |
|
|
|
icon: 'success', |
|
|
|
}) |
|
|
|
setTimeout(() => { |
|
|
|
this.orderPagination.pageNum = 1 |
|
|
|
@ -291,28 +399,41 @@ export default { |
|
|
|
// 分享 |
|
|
|
shareTap() { |
|
|
|
if (this.hasCompany) { |
|
|
|
getSupplierQrCode({ mallSupplierId: this.$store.state.supplierInfo.supplierId }).then((res) => { |
|
|
|
if (this.visible) { |
|
|
|
return |
|
|
|
} |
|
|
|
getSupplierQrCode({ |
|
|
|
mallSupplierId: this.$store.state.supplierInfo.supplierId, |
|
|
|
}).then((res) => { |
|
|
|
if (res) { |
|
|
|
this.visible = true |
|
|
|
this.shareInfo.storeCodeImg = `data:image/png;base64,${res}` |
|
|
|
this.shareInfo.storeName = this.storeInformation.name |
|
|
|
setTimeout(() => { |
|
|
|
this.createCanvas() |
|
|
|
}, 500) |
|
|
|
} |
|
|
|
}) |
|
|
|
} else { |
|
|
|
uni.showToast({ |
|
|
|
title: '请先完善企业信息', |
|
|
|
icon: 'none' |
|
|
|
icon: 'none', |
|
|
|
}) |
|
|
|
} |
|
|
|
}, |
|
|
|
closeShare() { |
|
|
|
this.visible = false |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
createCanvas() { |
|
|
|
let ctx = uni.createCanvasContext('posters', this) |
|
|
|
ctx.drawImage('/static/imgs/mall/qrCode-bg.png', 0, 0, 280, 355) |
|
|
|
ctx.draw(false, () => {}) |
|
|
|
}, |
|
|
|
}, |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="scss"> |
|
|
|
<style lang="scss" scoped> |
|
|
|
.wrapper { |
|
|
|
width: 750rpx; |
|
|
|
overflow: hidden; |
|
|
|
@ -521,7 +642,8 @@ export default { |
|
|
|
.border { |
|
|
|
width: 540rpx; |
|
|
|
height: 540rpx; |
|
|
|
background: url('https://qncloud.oss-cn-shenzhen.aliyuncs.com/paper_shopkeeper/qrCode-border.png') no-repeat center/cover; |
|
|
|
background: url('https://qncloud.oss-cn-shenzhen.aliyuncs.com/paper_shopkeeper/qrCode-border.png') |
|
|
|
no-repeat center/cover; |
|
|
|
} |
|
|
|
} |
|
|
|
.down-button { |
|
|
|
@ -537,4 +659,87 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.section_4 { |
|
|
|
z-index: 100; |
|
|
|
padding: 252rpx 36rpx 403rpx 95rpx; |
|
|
|
background-color: rgba(0, 0, 0, 0.5); |
|
|
|
top: 0; |
|
|
|
right: 0; |
|
|
|
bottom: 0; |
|
|
|
left: 0; |
|
|
|
position: absolute; |
|
|
|
.image_9 { |
|
|
|
align-self: flex-end; |
|
|
|
width: 62rpx; |
|
|
|
height: 62rpx; |
|
|
|
} |
|
|
|
.section_5 { |
|
|
|
margin-top: 30rpx; |
|
|
|
padding: 60rpx 0; |
|
|
|
border-radius: 20rpx; |
|
|
|
background-image: url('/static/imgs/mall/qrCode-bg.png'); |
|
|
|
background-size: 100% 100%; |
|
|
|
background-repeat: no-repeat; |
|
|
|
width: 560rpx; |
|
|
|
.section_6 { |
|
|
|
margin: 0 32rpx; |
|
|
|
padding: 50rpx 56rpx 0; |
|
|
|
background-color: rgb(255, 255, 255); |
|
|
|
box-shadow: 0px 2rpx 10rpx 0px rgba(0, 0, 0, 0.1); |
|
|
|
border-radius: 16rpx; |
|
|
|
width: 496rpx; |
|
|
|
.group_13 { |
|
|
|
margin: 0 12rpx; |
|
|
|
position: relative; |
|
|
|
.image_10 { |
|
|
|
width: 360rpx; |
|
|
|
height: 360rpx; |
|
|
|
} |
|
|
|
.image_11 { |
|
|
|
width: 330rpx; |
|
|
|
height: 330rpx; |
|
|
|
position: absolute; |
|
|
|
left: 50%; |
|
|
|
top: 50%; |
|
|
|
transform: translate(-50%, -50%); |
|
|
|
} |
|
|
|
} |
|
|
|
.group_14 { |
|
|
|
padding: 40rpx 0 56rpx; |
|
|
|
.text_15 { |
|
|
|
color: rgb(51, 51, 51); |
|
|
|
font-size: 30rpx; |
|
|
|
font-weight: 500; |
|
|
|
line-height: 42rpx; |
|
|
|
white-space: nowrap; |
|
|
|
} |
|
|
|
.text_16 { |
|
|
|
margin-top: 10rpx; |
|
|
|
color: rgb(136, 136, 136); |
|
|
|
font-size: 24rpx; |
|
|
|
font-weight: 500; |
|
|
|
line-height: 33rpx; |
|
|
|
white-space: nowrap; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.bottom-group { |
|
|
|
padding: 0 32rpx; |
|
|
|
.text_18 { |
|
|
|
margin-left: 83rpx; |
|
|
|
} |
|
|
|
.text_19 { |
|
|
|
margin-left: 83rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
.view_3 { |
|
|
|
margin-top: 40rpx; |
|
|
|
color: rgb(255, 255, 255); |
|
|
|
font-size: 30rpx; |
|
|
|
font-weight: 500; |
|
|
|
line-height: 42rpx; |
|
|
|
white-space: nowrap; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
mo-bai
4 years ago
