Compare commits
4 Commits
61aace0dc0
...
a8816672c5
| Author | SHA1 | Date |
|---|---|---|
 tianyi
|
a8816672c5 | 1 week ago |
|
tianyi
|
4c7909ae27 | 1 week ago |
|
tianyi
|
b78da7c562 | 1 week ago |
|
tianyi
|
a9a3af33f2 | 1 week ago |
18 changed files with 4325 additions and 61 deletions
@ -0,0 +1,196 @@ |
|||||
|
|
||||
|
import PrinterJobs from '@/components/print/printerjobs.js' |
||||
|
import printerUtil from '@/components/print/printerutil.js' |
||||
|
import util from '@/components/print/util.js' |
||||
|
import drawQrcode from '@/components/print/weapp.qrcode.esm.js' |
||||
|
import Bluetooth from '@/components/print/bluetooth.js' |
||||
|
let bluetooth = new Bluetooth(); |
||||
|
let isPrint= false |
||||
|
export default { |
||||
|
getData() { |
||||
|
var that = this; |
||||
|
if(uni.getStorageSync('bluetoothDeviceId')){ |
||||
|
let id = uni.getStorageSync('bluetoothDeviceId') |
||||
|
this.bindViewTap(id,false) |
||||
|
}else{ |
||||
|
uni.showModal({ |
||||
|
title: '提示', |
||||
|
content: '您还没有连接打印机，将无法为您打印小票！' |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
async bindViewTap(deviceId, state) { |
||||
|
var _this = this; |
||||
|
console.log(deviceId) |
||||
|
try { |
||||
|
//1.链接设备
|
||||
|
await bluetooth.createBLEConnection(deviceId).then((res) => { |
||||
|
bluetooth.deviceId = deviceId; |
||||
|
}).catch((e) => { |
||||
|
throw e; |
||||
|
}); |
||||
|
|
||||
|
let server = []; |
||||
|
//2.寻找服务
|
||||
|
await bluetooth.getBLEDeviceServices().then((res) => { |
||||
|
console.log(res) |
||||
|
bluetooth.notifyId = ''; |
||||
|
bluetooth.writeId = ''; |
||||
|
bluetooth.num = 0; |
||||
|
bluetooth.serviceList = res |
||||
|
}).catch((e) => { |
||||
|
throw e; |
||||
|
}); |
||||
|
|
||||
|
//3.获取蓝牙设备所有服务
|
||||
|
let result3 = await bluetooth.getBLEDeviceCharacteristics().then(res => { |
||||
|
uni.setStorageSync('bluetoothDeviceId', deviceId); |
||||
|
this.pickUpOnce() |
||||
|
}).catch((e) => { |
||||
|
throw e; |
||||
|
}); |
||||
|
} catch (e) { |
||||
|
//TODO handle the exception
|
||||
|
console.log("e: " + JSON.stringify(e)); |
||||
|
} |
||||
|
}, |
||||
|
//打印一次
|
||||
|
pickUpOnce() { |
||||
|
isPrint = true; |
||||
|
bluetooth.notifyBLECharacteristicValue(); |
||||
|
let self = this; |
||||
|
setTimeout(() => { |
||||
|
self.writeBLECharacteristicValue(); |
||||
|
}, 500); |
||||
|
}, |
||||
|
//写入控制命令
|
||||
|
async writeBLECharacteristicValue() { |
||||
|
let data = { |
||||
|
"settled_name": "#0112配送", |
||||
|
"detail": { |
||||
|
"total_amount": "137.00", |
||||
|
"other_amount": "0.00", |
||||
|
"discount_amount": "0.00", |
||||
|
"actual_amount": "137.00", |
||||
|
"order_sn": "20220512165337", |
||||
|
"goods_count": 3, |
||||
|
"order_time": "2022-05-12 16:53:00", |
||||
|
"supplier_id": 1 |
||||
|
}, |
||||
|
"code": "https://www.oulaisong.com/purchase?id=8", |
||||
|
"list": [{ |
||||
|
"id": 8, |
||||
|
"goods_name": "红烧带鱼", |
||||
|
"article_number": "1", |
||||
|
'sum_price':'16.00' |
||||
|
}, { |
||||
|
"id": 9, |
||||
|
"goods_name": "女童外套", |
||||
|
"article_number": "2", |
||||
|
|
||||
|
"sum_price": "34.00" |
||||
|
}, { |
||||
|
"id": 10, |
||||
|
"goods_name": "25", |
||||
|
"article_number": "3", |
||||
|
"sum_price": "3.00" |
||||
|
}] |
||||
|
} |
||||
|
let printerJobs = new PrinterJobs(); |
||||
|
printerJobs.setAlign('ct').setSize(2, 2).setLineSpacing(80).print('#0112配送') |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('预计时间:2026-02-01 13:41:00') |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('七里香快餐明珠店') |
||||
|
.print(printerUtil.fillLine('-', 1, 50)) |
||||
|
.setAlign('lt').setSize(2, 2).setLineSpacing(80).print('王先生') |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('联系电话: *******0775') |
||||
|
.setAlign('lt').setSize(2, 2).setLineSpacing(80).print('地址:黑背生东川建设集团有限公司黑恶生运河区****') |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('为保护隐私，顾客电话及地址已被隐藏，您可登录商家端或骑手端查看') |
||||
|
.print(printerUtil.fillLine('-', 1, 50)); |
||||
|
|
||||
|
|
||||
|
for (var i = 0; i < data.list.length; i++) { |
||||
|
printerJobs.setAlign('lt').setSize(1, 1).setLineSpacing(40).print(data.list[i].goods_name) |
||||
|
|
||||
|
|
||||
|
let setLineSpacing = 40 |
||||
|
|
||||
|
printerJobs.setLineSpacing(setLineSpacing).print(printerUtil.inlineArr([{ |
||||
|
'text': 'X' + data.list[i].article_number, |
||||
|
'width': 20, |
||||
|
}, { |
||||
|
'text': data.list[i].sum_price, |
||||
|
'width': 10, |
||||
|
}], 1, 50)); |
||||
|
} |
||||
|
printerJobs.print(printerUtil.fillLine('-', 1, 50)) |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('配送费：1圆') |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('合计金额：17圆') |
||||
|
.print(printerUtil.fillLine('-', 1, 50)) |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('商品取到后，如有任何商品问题，请及时联系商家和平台，客服将为您服务，客服电话15533910775，谢谢您的惠顾') |
||||
|
.println(); |
||||
|
let buffer = printerJobs.buffer(); |
||||
|
this.sendPrint(buffer); |
||||
|
}, |
||||
|
sendPrint(buffer) { |
||||
|
// 1.并行调用多次会存在写失败的可能性
|
||||
|
// 2.建议每次写入不超过20字节
|
||||
|
// 分包处理，延时调用
|
||||
|
let that = this |
||||
|
const maxChunk = 20; |
||||
|
const delay = 20; |
||||
|
isPrint = true; |
||||
|
for (let i = 0, j = 0, length = buffer.byteLength; i < length; i += maxChunk, j++) { |
||||
|
let subPackage = buffer.slice(i, i + maxChunk <= length ? (i + maxChunk) : length); |
||||
|
setTimeout(this.sendPrintData, j * delay, subPackage); |
||||
|
} |
||||
|
isPrint = false; |
||||
|
}, |
||||
|
sendPrintData(buffer) { |
||||
|
bluetooth.writeBLECharacteristicValue(buffer).then(res => {}); |
||||
|
}, |
||||
|
startSearch(state) { |
||||
|
let that = this |
||||
|
bluetooth.openBluetoothAdapter().then(e => { |
||||
|
|
||||
|
uni.startBluetoothDevicesDiscovery({ |
||||
|
success: res => { |
||||
|
uni.onBluetoothDeviceFound(result => { |
||||
|
let arr = that.list; |
||||
|
let devices = []; |
||||
|
let list = result.devices; |
||||
|
for (let i = 0; i < list.length; ++i) { |
||||
|
console.log(list[i]) |
||||
|
if (list[i].name && list[i].name != "未知设备") { |
||||
|
let arrNew = arr.filter((item) => { |
||||
|
return item.deviceId == list[i].deviceId; |
||||
|
}); |
||||
|
if (arrNew.length == 0) { |
||||
|
devices.push(list[i]); |
||||
|
} |
||||
|
if (uni.getStorageSync('bluetoothDeviceId') == list[i] |
||||
|
.deviceId) { |
||||
|
// that.bindViewTap(list[i].deviceId, state)
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
that.list = arr.concat(devices); |
||||
|
}); |
||||
|
}, |
||||
|
fail: res => { |
||||
|
uni.hideLoading(); |
||||
|
uni.showToast({ |
||||
|
title: `搜索设备失败` + JSON.stringify(err) |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
}).catch(e => { |
||||
|
console.log(e) |
||||
|
}); |
||||
|
}, |
||||
|
// 停止搜索
|
||||
|
stopSearch() { |
||||
|
|
||||
|
uni.hideLoading(); |
||||
|
bluetooth.stopBluetoothDevicesDiscovery(); |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,319 @@ |
|||||
|
<template> |
||||
|
<view class=""> |
||||
|
<view class="btn"> |
||||
|
<button type="primary" :loading="isSearching" v-if="isSearching == false" @tap="startSearch(true)" |
||||
|
text="">搜索蓝牙设备 |
||||
|
</button> |
||||
|
<button type="primary" :loading="isSearching" v-if="isSearching == true" @tap="stopSearch" text="">搜索蓝牙设备 |
||||
|
</button> |
||||
|
<button type="primary" style="margin-top: 40rpx;" v-if="okAddress !=''" @tap="endSearch(true)" |
||||
|
text="">删除已连接蓝牙设备 |
||||
|
</button> |
||||
|
<button type="primary" style="margin-top: 40rpx;font-size: 32rpx;" :loading="isPrint" v-if="okAddress" |
||||
|
@tap="pickUpOnce" text=''>打印测试</button> |
||||
|
</view> |
||||
|
|
||||
|
<view class="content"> |
||||
|
<text>新设备</text> |
||||
|
<view v-for="(item) in list" :data-title="item.deviceId" :data-name="item.name" |
||||
|
:data-advertisData="item.advertisServiceUUIDs" :key="item.deviceId" |
||||
|
@tap="bindViewTap(item.deviceId,true)"> |
||||
|
<view> |
||||
|
<text>{{item.name}}</text> |
||||
|
<view v-if="linkAddress == item.deviceId" style="background-color: #4caf50;">正在匹配</view> |
||||
|
<view v-if="okAddress == item.deviceId">匹配成功</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import PrinterJobs from '@/components/print/printerjobs.js' |
||||
|
import printerUtil from '@/components/print/printerutil.js' |
||||
|
import util from '@/components/print/util.js' |
||||
|
import drawQrcode from '@/components/print/weapp.qrcode.esm.js' |
||||
|
import Bluetooth from '@/components/print/bluetooth.js' |
||||
|
let bluetooth = new Bluetooth(); |
||||
|
export default { |
||||
|
components: {}, |
||||
|
data() { |
||||
|
return { |
||||
|
isSearching: false, |
||||
|
list: [], |
||||
|
okAddress: '', |
||||
|
linkAddress: '', |
||||
|
data: { |
||||
|
"settled_name": "#0112配送", |
||||
|
"detail": { |
||||
|
"total_amount": "137.00", |
||||
|
"other_amount": "0.00", |
||||
|
"discount_amount": "0.00", |
||||
|
"actual_amount": "137.00", |
||||
|
"order_sn": "20220512165337", |
||||
|
"goods_count": 3, |
||||
|
"order_time": "2022-05-12 16:53:00", |
||||
|
"supplier_id": 1 |
||||
|
}, |
||||
|
"code": "https://www.oulaisong.com/purchase?id=8", |
||||
|
"list": [{ |
||||
|
"id": 8, |
||||
|
"goods_name": "红烧带鱼", |
||||
|
"article_number": "1", |
||||
|
'sum_price':'16.00' |
||||
|
}, { |
||||
|
"id": 9, |
||||
|
"goods_name": "女童外套", |
||||
|
"article_number": "2", |
||||
|
|
||||
|
"sum_price": "34.00" |
||||
|
}, { |
||||
|
"id": 10, |
||||
|
"goods_name": "25", |
||||
|
"article_number": "3", |
||||
|
"sum_price": "3.00" |
||||
|
}] |
||||
|
}, |
||||
|
isPrint: false, |
||||
|
} |
||||
|
}, |
||||
|
//页面卸载是关闭蓝牙链接 |
||||
|
// onUnload() { |
||||
|
// uni.hideLoading() |
||||
|
// bluetooth.closeBLEConnection(); |
||||
|
// bluetooth.closeBluetoothAdapter(); |
||||
|
// }, |
||||
|
//页面打开,获取位置,打开蓝牙链接 |
||||
|
onLoad() { |
||||
|
uni.getLocation({ |
||||
|
type: 'wgs84', |
||||
|
success: function(res) { |
||||
|
console.log('当前位置的经度：' + res.longitude); |
||||
|
console.log('当前位置的纬度：' + res.latitude); |
||||
|
} |
||||
|
}); |
||||
|
// this.getData() |
||||
|
|
||||
|
}, |
||||
|
onShow() { |
||||
|
console.log('---') |
||||
|
}, |
||||
|
methods: { |
||||
|
endSearch(){ |
||||
|
uni.hideLoading() |
||||
|
bluetooth.closeBLEConnection(); |
||||
|
bluetooth.closeBluetoothAdapter(); |
||||
|
this.okAddress = '' |
||||
|
}, |
||||
|
getData() { |
||||
|
var that = this; |
||||
|
that.startSearch(false); |
||||
|
}, |
||||
|
async bindViewTap(deviceId, state) { |
||||
|
var _this = this; |
||||
|
_this.okAddress = ''; |
||||
|
_this.linkAddress = deviceId; |
||||
|
console.log(deviceId) |
||||
|
if (state == true) { |
||||
|
_this.isSearching = false |
||||
|
} |
||||
|
try { |
||||
|
//1.链接设备 |
||||
|
await bluetooth.createBLEConnection(deviceId).then((res) => { |
||||
|
bluetooth.deviceId = deviceId; |
||||
|
}).catch((e) => { |
||||
|
throw e; |
||||
|
}); |
||||
|
|
||||
|
let server = []; |
||||
|
//2.寻找服务 |
||||
|
await bluetooth.getBLEDeviceServices().then((res) => { |
||||
|
console.log(res) |
||||
|
bluetooth.notifyId = ''; |
||||
|
bluetooth.writeId = ''; |
||||
|
bluetooth.num = 0; |
||||
|
bluetooth.serviceList = res |
||||
|
}).catch((e) => { |
||||
|
throw e; |
||||
|
}); |
||||
|
|
||||
|
//3.获取蓝牙设备所有服务 |
||||
|
let result3 = await bluetooth.getBLEDeviceCharacteristics().then(res => { |
||||
|
_this.okAddress = deviceId; |
||||
|
_this.linkAddress = ''; |
||||
|
uni.setStorageSync('bluetoothDeviceId', deviceId); |
||||
|
}).catch((e) => { |
||||
|
throw e; |
||||
|
}); |
||||
|
} catch (e) { |
||||
|
_this.okAddress = ''; |
||||
|
_this.linkAddress = ''; |
||||
|
//TODO handle the exception |
||||
|
console.log("e: " + JSON.stringify(e)); |
||||
|
} |
||||
|
}, |
||||
|
//打印一次 |
||||
|
pickUpOnce() { |
||||
|
this.isPrint = true; |
||||
|
bluetooth.notifyBLECharacteristicValue(); |
||||
|
let self = this; |
||||
|
setTimeout(() => { |
||||
|
self.writeBLECharacteristicValue(); |
||||
|
}, 500); |
||||
|
}, |
||||
|
//写入控制命令 |
||||
|
async writeBLECharacteristicValue() { |
||||
|
let data = this.data; |
||||
|
let printerJobs = new PrinterJobs(); |
||||
|
printerJobs.setAlign('ct').setSize(2, 2).setLineSpacing(80).print('#0112配送') |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('预计时间:2026-02-01 13:41:00') |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('七里香快餐明珠店') |
||||
|
.print(printerUtil.fillLine('-', 1, 50)) |
||||
|
.setAlign('lt').setSize(2, 2).setLineSpacing(80).print('王先生') |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('联系电话: *******0775') |
||||
|
.setAlign('lt').setSize(2, 2).setLineSpacing(80).print('地址:黑背生东川建设集团有限公司黑恶生运河区****') |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('为保护隐私，顾客电话及地址已被隐藏，您可登录商家端或骑手端查看') |
||||
|
.print(printerUtil.fillLine('-', 1, 50)); |
||||
|
|
||||
|
|
||||
|
for (var i = 0; i < data.list.length; i++) { |
||||
|
printerJobs.setAlign('lt').setSize(1, 1).setLineSpacing(40).print(data.list[i].goods_name) |
||||
|
|
||||
|
|
||||
|
let setLineSpacing = 40 |
||||
|
|
||||
|
printerJobs.setLineSpacing(setLineSpacing).print(printerUtil.inlineArr([{ |
||||
|
'text': 'X' + data.list[i].article_number, |
||||
|
'width': 20, |
||||
|
}, { |
||||
|
'text': data.list[i].sum_price, |
||||
|
'width': 10, |
||||
|
}], 1, 50)); |
||||
|
} |
||||
|
printerJobs.print(printerUtil.fillLine('-', 1, 50)) |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('配送费：1圆') |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('合计金额：17圆') |
||||
|
.print(printerUtil.fillLine('-', 1, 50)) |
||||
|
.setAlign('lt').setSize(1, 1).setLineSpacing(40).print('商品取到后，如有任何商品问题，请及时联系商家和平台，客服将为您服务，客服电话15533910775，谢谢您的惠顾') |
||||
|
.println(); |
||||
|
let buffer = printerJobs.buffer(); |
||||
|
this.sendPrint(buffer); |
||||
|
}, |
||||
|
sendPrint(buffer) { |
||||
|
// 1.并行调用多次会存在写失败的可能性 |
||||
|
// 2.建议每次写入不超过20字节 |
||||
|
// 分包处理，延时调用 |
||||
|
let that = this |
||||
|
const maxChunk = 20; |
||||
|
const delay = 20; |
||||
|
that.isPrint = true; |
||||
|
for (let i = 0, j = 0, length = buffer.byteLength; i < length; i += maxChunk, j++) { |
||||
|
let subPackage = buffer.slice(i, i + maxChunk <= length ? (i + maxChunk) : length); |
||||
|
setTimeout(this.sendPrintData, j * delay, subPackage); |
||||
|
} |
||||
|
that.isPrint = false; |
||||
|
}, |
||||
|
sendPrintData(buffer) { |
||||
|
bluetooth.writeBLECharacteristicValue(buffer).then(res => {}); |
||||
|
}, |
||||
|
startSearch(state) { |
||||
|
let that = this |
||||
|
bluetooth.openBluetoothAdapter().then(e => { |
||||
|
that.isSearching = true; |
||||
|
uni.startBluetoothDevicesDiscovery({ |
||||
|
success: res => { |
||||
|
uni.onBluetoothDeviceFound(result => { |
||||
|
let arr = that.list; |
||||
|
let devices = []; |
||||
|
let list = result.devices; |
||||
|
for (let i = 0; i < list.length; ++i) { |
||||
|
console.log(list[i]) |
||||
|
if (list[i].name && list[i].name != "未知设备") { |
||||
|
let arrNew = arr.filter((item) => { |
||||
|
return item.deviceId == list[i].deviceId; |
||||
|
}); |
||||
|
if (arrNew.length == 0) { |
||||
|
devices.push(list[i]); |
||||
|
} |
||||
|
if (uni.getStorageSync('bluetoothDeviceId') == list[i] |
||||
|
.deviceId) { |
||||
|
// that.bindViewTap(list[i].deviceId, state) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
that.list = arr.concat(devices); |
||||
|
}); |
||||
|
}, |
||||
|
fail: res => { |
||||
|
uni.hideLoading(); |
||||
|
uni.showToast({ |
||||
|
title: `搜索设备失败` + JSON.stringify(err) |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
}).catch(e => { |
||||
|
console.log(e) |
||||
|
}); |
||||
|
}, |
||||
|
// 停止搜索 |
||||
|
stopSearch() { |
||||
|
this.isSearching = false; |
||||
|
uni.hideLoading(); |
||||
|
bluetooth.stopBluetoothDevicesDiscovery(); |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
page { |
||||
|
background: #F7F8FA; |
||||
|
} |
||||
|
</style> |
||||
|
<style scoped lang="scss"> |
||||
|
.btn { |
||||
|
padding: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.content { |
||||
|
padding: 40rpx; |
||||
|
|
||||
|
&>text { |
||||
|
display: block; |
||||
|
padding-bottom: 30rpx; |
||||
|
font-size: 28rpx; |
||||
|
color: #333 |
||||
|
} |
||||
|
|
||||
|
&>view { |
||||
|
background-color: #fff; |
||||
|
padding: 30rpx 40rpx; |
||||
|
margin-bottom: 24rpx; |
||||
|
|
||||
|
&>view { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: space-between; |
||||
|
|
||||
|
&>text { |
||||
|
margin-left: 24rpx; |
||||
|
font-size: 32rpx; |
||||
|
font-weight: 500; |
||||
|
color: #333333; |
||||
|
} |
||||
|
|
||||
|
&>view { |
||||
|
border-radius: 10rpx; |
||||
|
font-size: 24rpx; |
||||
|
color: #fff; |
||||
|
background-color: #3769FF; |
||||
|
padding: 5rpx 10rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&>view:last-child { |
||||
|
margin-bottom: 0; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,881 @@ |
|||||
|
<!-- 底部菜单--库存--新增商品 --> |
||||
|
<template> |
||||
|
<view class="page1"> |
||||
|
<view class="title"> |
||||
|
<view class="title-sreach"> |
||||
|
<view class="back-btn" @tap="back"> |
||||
|
<uni-icons type="left" size="28"></uni-icons> |
||||
|
</view> |
||||
|
<view class="title-name"> |
||||
|
新增商品 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="formBox"> |
||||
|
<uni-forms ref="form" :modelValue="formData" :rules="rules" labelWidth="170rpx"> |
||||
|
<uni-forms-item label="商品名称" name="productName" required> |
||||
|
<uni-easyinput type="text" v-model="formData.productName" placeholder="请输入商品名称" trim="all" /> |
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="商品主图" name="productPicture"> |
||||
|
<view style="display: flex;"> |
||||
|
<view class="upload-img" @tap="pictureAdd" |
||||
|
style="background: #eee;text-align: center;line-height: 160rpx;"> |
||||
|
<uni-icons type="camera" size="28" color="#777"></uni-icons> |
||||
|
</view> |
||||
|
<view style="overflow-x: scroll;display: flex;width: 350rpx;"> |
||||
|
<view v-if="formData.productPicture !=''" style="width: 160rpx;height: 160rpx;margin-left: 20rpx;"> |
||||
|
<img :src="formData.productPicture" alt="" class="upload-img"> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="排名" name="orderFiled"> |
||||
|
<input type="digit" class="content-input" v-model="formData.orderFiled" placeholder="请输入排名"> |
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="商品分类" name="editTitle"> |
||||
|
<view style="border: 4rpx solid #eee;display: flex;flex: 1;border-radius: 10rpx;"> |
||||
|
<input type="text" placeholder="请选择商品分类" disabled v-model="typeItem.categoryName" |
||||
|
class="content-input" @tap="goGategoryLow" style="border: 0;"> |
||||
|
<uni-icons type="right" size="16" |
||||
|
style="margin-left: 40rpx;line-height: 70rpx;"></uni-icons> |
||||
|
</view> |
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="商品规格" name="attributeListPrice"> |
||||
|
<view> |
||||
|
<view v-for="(item,index) in formData.attributeListPrice" :key="index" style="display: flex;margin-top:10rpx;"> |
||||
|
<input class="content-input" v-model="item.specName" v-if="item.specName != ''&& formData.attributeListPrice.length != 1" style="padding-right: 20rpx;" disabled /> |
||||
|
<input class="content-input" v-model="item.specPrice" style="padding-right: 20rpx;margin-right: 20rpx;" @click="changePrice(index)" placeholder="商品价格" /> |
||||
|
<input class="content-input" v-model="item.specNum" style="padding-right: 20rpx;" @click="changecount(index)" placeholder="商品库存"/> |
||||
|
<button @click="deldantiaoguige(index)" v-if="formData.attributeListPrice.length>1" style="width: 240rpx;height: 60rpx;line-height: 60rpx;color: red;border:none;background: #fff;">删除</button> |
||||
|
</view> |
||||
|
<!-- <view @click="checkSpec('guige')" style="margin-top: 5px;width: 80px;height: 30px;text-align: center;line-height: 30px;background: rgba(0, 35, 28, 1);border-radius: 30px;color: rgba(166, 255, 234, 1);"> |
||||
|
选择规格 |
||||
|
</view> --> |
||||
|
</view> |
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="拼团信息" name="productGroupBuyPrices"> |
||||
|
<view> |
||||
|
<view v-for="(item,index) in formData.productGroupBuyPrices" :key="index" style="display: flex;margin-top:10rpx;"> |
||||
|
<input class="content-input" v-model="item.groupCount" style="padding-right: 20rpx;margin-right: 20rpx;" placeholder="成团人数" /> |
||||
|
<input class="content-input" v-model="item.groupPrice" style="padding-right: 20rpx;" placeholder="成团价格"/> |
||||
|
<button @click="delGroup(index)" v-if="formData.productGroupBuyPrices.length>1" style="width: 240rpx;height: 60rpx;line-height: 60rpx;color: red;border:none;background: #fff;">删除</button> |
||||
|
</view> |
||||
|
<view @click="addGroup()" style="margin-top: 10rpx;width: 160rpx;height: 60rpx;text-align: center;line-height: 60rpx;background: rgba(0, 35, 28, 1);border-radius: 60rpx;color: rgba(166, 255, 234, 1);"> |
||||
|
新增拼团 |
||||
|
</view> |
||||
|
</view> |
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="商品属性" name="attributeList1"> |
||||
|
<view style="display: flex;flex-direction: column;"> |
||||
|
<view v-for="(value,key) in Array.from(formData.attributeList1)" :key="index" style="display: flex;"> |
||||
|
{{value[0]}}: |
||||
|
<view v-for="(item,index) in value[1].title" :key="index"> |
||||
|
{{item}}、 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view @click="checkSpec('shuxing')" style="width: 160rpx;height: 60rpx;text-align: center;line-height: 60rpx;background: rgba(0, 35, 28, 1);border-radius: 60rpx;color: rgba(166, 255, 234, 1);"> |
||||
|
选择属性 |
||||
|
</view> |
||||
|
</view> |
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="可售时间" name="sellTime"> |
||||
|
<view style="display: flex;flex-direction: column;"> |
||||
|
<view style="line-height: 74rpx;"> |
||||
|
<radio :checked="formData.sellTime==0" name="sellTime" @click="checkSellTime(0)" />全时段售卖 |
||||
|
<radio :checked="formData.sellTime==1" name="sellTime" @click="checkSellTime(1)" />自定义时段 |
||||
|
</view> |
||||
|
<view style="display: flex;" v-if="formData.sellTime == 1"> |
||||
|
<picker mode="time" v-model="formData.sellBeginTime" start="00:00" end="23:59" @change="selectDateRange($event,'start')"> |
||||
|
<view class="uni-input">{{formData.sellBeginTime}}</view> |
||||
|
</picker> |
||||
|
<view style="width: 50rpx;height: 50rpx;line-height: 50rpx;text-align: center;">-</view> |
||||
|
<picker mode="time" v-model="formData.sellEndTime" start="00:00" end="23:59" @change="selectDateRange($event,'end')"> |
||||
|
<view class="uni-input">{{formData.sellEndTime}}</view> |
||||
|
</picker> |
||||
|
</view> |
||||
|
</view> |
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="设置加料" name="isMoreBuy"> |
||||
|
<view style="line-height: 74rpx;"> |
||||
|
<radio :checked="formData.isMoreBuy==0" name="isMoreBuy" @click="checkisMoreBuy('0')" />否 |
||||
|
<radio :checked="formData.isMoreBuy==1" name="isMoreBuy" @click="checkisMoreBuy('1')" />是 |
||||
|
</view> |
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="餐盒费" name="lunchBox"> |
||||
|
<input type="digit" class="content-input" v-model="formData.lunchBox" placeholder="请输入餐盒费"> |
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="起售数量" name="startPayNum"> |
||||
|
<input type="digit" class="content-input" v-model="formData.startPayNum" placeholder="请输入起售数量"> |
||||
|
</uni-forms-item> |
||||
|
<uni-forms-item label="详细图文" name="startPayNum"> |
||||
|
<view class="xiangxi-box"> |
||||
|
<sp-editor |
||||
|
@init="initEditor" |
||||
|
@input="inputOver" |
||||
|
@upinImage="upinImage" |
||||
|
@overMax="overMax"> |
||||
|
</sp-editor> |
||||
|
</view> |
||||
|
</uni-forms-item> |
||||
|
</uni-forms> |
||||
|
<view> |
||||
|
<button @tap.stop="submit()">保存</button> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 添加分类弹出层 --> |
||||
|
<uni-popup ref="addTypeDialog" background-color="#fff"> |
||||
|
<view class="add-popup-content"> |
||||
|
<view style="height:900rpx;"> |
||||
|
<view class="content-left" style="float: left;"> |
||||
|
<view class="left-box" v-for="(item,index) in categoryData" :key="index" |
||||
|
:class="item.parentId ? 'left-box-hover':''" @tap="clickLeftBtn(index)"> |
||||
|
<text style="width: 100%;height: 100rpx;line-height: 100rpx;display: inline-block;overflow: hidden;" |
||||
|
:class="item.parentId ? 'red' :''">{{item.title}}</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view v-for="(item,index) in categorySonData" :key="index" @tap="checkSpecValue(index)" class="content-low" :class="item.checked?'checked':''"> |
||||
|
{{item.title}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<view slot="footer" style="display: flex;padding-left: 40rpx;margin-top: 20rpx;"> |
||||
|
<button type="text" @tap="$refs.addTypeDialog.close()" style="margin-right: 20rpx;">取消</button> |
||||
|
<button type="text" @tap="guigeSubmit">提交</button> |
||||
|
</view> |
||||
|
</view> |
||||
|
</uni-popup> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
dataList: {}, |
||||
|
modalType:0, |
||||
|
categoryData:[], |
||||
|
categoryIndex: 0, |
||||
|
modalclassType:'', |
||||
|
categorySonData:[], |
||||
|
specValueArr:[], |
||||
|
attrValueArr:[], |
||||
|
editorIns: null, |
||||
|
typeItem: {}, |
||||
|
formData: { |
||||
|
id: '', |
||||
|
shopId: '', |
||||
|
categoryId: '', //商品分类id |
||||
|
categoryName: '', //商品分类名称 |
||||
|
productPicture: '', //商品图标 |
||||
|
productName: '', //商品名称 |
||||
|
orderFiled: '', //商品名称 |
||||
|
lunchBox: 0, //餐盒 |
||||
|
startPayNum: '', //起售数量 |
||||
|
attributeListPrice: [{ //商品规格 |
||||
|
specPrice: "", |
||||
|
specNum: 9999 |
||||
|
}], |
||||
|
shopId:'', |
||||
|
sellTime: 0, //可售时间 |
||||
|
isMoreBuy: 0, |
||||
|
sellBeginTime: '', //可售时段自定义---开始时间 |
||||
|
sellEndTime: '', //可售时段自定义---结束时间 |
||||
|
attributeList: '', |
||||
|
productGroupBuyPrices: [], |
||||
|
attributeList1: new Map(), //商品属性 |
||||
|
productIntro: "" //详细图文 |
||||
|
}, |
||||
|
rules: { |
||||
|
productName: { |
||||
|
rules: [{ |
||||
|
required: true, |
||||
|
errorMessage: '请输入名称', |
||||
|
}] |
||||
|
}, |
||||
|
categoryId: { |
||||
|
rules: [{ |
||||
|
required: true, |
||||
|
errorMessage: '请选择商品分类', |
||||
|
}, ], |
||||
|
}, |
||||
|
}, |
||||
|
} |
||||
|
}, |
||||
|
filters: { |
||||
|
|
||||
|
}, |
||||
|
onShow() { |
||||
|
// uni.authorize({ |
||||
|
// scope: 'scope.writePhotosAlbum', |
||||
|
// success() { |
||||
|
|
||||
|
// }, |
||||
|
// fail() { |
||||
|
// this.tui.toast("您未授权，图片上传功能可能会出现错误") |
||||
|
// } |
||||
|
// }) |
||||
|
this.typeItem = JSON.parse(JSON.stringify(this.typeItem)) || '' |
||||
|
if (this.typeItem) { |
||||
|
this.formData.categoryId = this.typeItem.id |
||||
|
} |
||||
|
this.formData.shopId = uni.getStorageSync('shopId') |
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
this.getGategoryList() |
||||
|
if (option.dataList) { |
||||
|
this.dataList = JSON.parse(option.dataList) |
||||
|
this.NB.sendRequest("/app/product/getById/"+ this.dataList.id, {}, false, 'POST', 'application/json').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
this.modalType = 1 |
||||
|
this.formData.id = res.result.id |
||||
|
this.formData.shopId = res.result.shopId |
||||
|
this.formData.categoryName = res.result.categoryName |
||||
|
this.formData.orderFiled = res.result.orderFiled |
||||
|
this.formData.lunchBox = res.result.lunchBox |
||||
|
this.formData.startPayNum = res.result.startPayNum |
||||
|
this.formData.attributeListPrice = JSON.parse(res.result.attributeListPrice) |
||||
|
this.formData.shopId = res.result.shopId |
||||
|
this.formData.sellTime = res.result.sellBeginTime !=''?1:0 |
||||
|
this.formData.isMoreBuy = res.result.isMoreBuy |
||||
|
this.formData.sellBeginTime = res.result.sellBeginTime |
||||
|
this.formData.sellEndTime = res.result.sellEndTime |
||||
|
this.formData.attributeList = res.result.attributeList |
||||
|
this.formData.productGroupBuyPrices = res.result.productGroupBuyPrices |
||||
|
this.formData.attributeList1 = new Map() |
||||
|
this.formData.productName = res.result.productName |
||||
|
this.formData.productPicture = res.result.productPicture |
||||
|
this.formData.productIntro = res.result.productIntro |
||||
|
this.formData.categoryId = res.result.categoryId |
||||
|
this.edit(this.formData) |
||||
|
} else { |
||||
|
this.tui.toast(res.message) |
||||
|
} |
||||
|
}).catch((res) => {}) |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
/** |
||||
|
* 获取输入内容 |
||||
|
* @param {Object} e {html,text} 内容的html文本，和text文本 |
||||
|
*/ |
||||
|
inputOver(e) { |
||||
|
// 可以在此处获取到编辑器已编辑的内容 |
||||
|
console.log('==== inputOver :', e) |
||||
|
this.productIntro = e |
||||
|
}, |
||||
|
/** |
||||
|
* 超出最大内容限制 |
||||
|
* @param {Object} e {html,text} 内容的html文本，和text文本 |
||||
|
*/ |
||||
|
overMax(e) { |
||||
|
// 若设置了最大字数限制，可在此处触发超出限制的回调 |
||||
|
console.log('==== overMax :', e) |
||||
|
}, |
||||
|
/** |
||||
|
* 编辑器就绪 |
||||
|
* @param {Object} editor 编辑器实例，你可以自定义调用editor实例的方法 |
||||
|
* @tutorial editor组件 https://uniapp.dcloud.net.cn/component/editor.html#editor-%E7%BB%84%E4%BB%B6 |
||||
|
* @tutorial 相关api https://uniapp.dcloud.net.cn/api/media/editor-context.html |
||||
|
*/ |
||||
|
initEditor(editor) { |
||||
|
this.editorIns = editor // 保存编辑器实例 |
||||
|
// 保存编辑器实例后，可以在此处获取后端数据，并赋值给编辑器初始化内容 |
||||
|
|
||||
|
}, |
||||
|
/** |
||||
|
* 直接运行示例工程插入图片无法正常显示的看这里 |
||||
|
* 因为插件默认采用云端存储图片的方式 |
||||
|
* 以$emit('upinImage', tempFiles, this.editorCtx)的方式回调 |
||||
|
* @param {Object} tempFiles |
||||
|
* @param {Object} editorCtx |
||||
|
*/ |
||||
|
upinImage(tempFiles, editorCtx) { |
||||
|
/** |
||||
|
* 本地临时插入图片预览 |
||||
|
* 注意：这里仅是示例本地图片预览，因为需要将图片先上传到云端，再将图片插入到编辑器中 |
||||
|
* 正式开发时，还请将此处注释，并解开下面 使用 uniCloud.uploadFile 上传图片的示例方法 的注释 |
||||
|
* @tutorial https://uniapp.dcloud.net.cn/api/media/editor-context.html#editorcontext-insertimage |
||||
|
*/ |
||||
|
// #ifdef MP-WEIXIN |
||||
|
// 注意微信小程序的图片路径是在tempFilePath字段中 |
||||
|
editorCtx.insertImage({ |
||||
|
src: tempFiles[0].tempFilePath, |
||||
|
width: '80%', // 默认不建议铺满宽度100%，预留一点空隙以便用户编辑 |
||||
|
success: function() {} |
||||
|
}) |
||||
|
// #endif |
||||
|
|
||||
|
// #ifndef MP-WEIXIN |
||||
|
editorCtx.insertImage({ |
||||
|
src: tempFiles[0].path, |
||||
|
width: '80%', // 默认不建议铺满宽度100%，预留一点空隙以便用户编辑 |
||||
|
success: function() {} |
||||
|
}) |
||||
|
// #endif |
||||
|
|
||||
|
/** |
||||
|
* 使用 uniCloud.uploadFile 上传图片的示例方法（可适用多选上传） |
||||
|
* 正式开发环境中，请将上面 本地临时插入图片预览 注释后，模仿以下写法 |
||||
|
*/ |
||||
|
// tempFiles.forEach(async (item) => { |
||||
|
// uni.showLoading({ |
||||
|
// title: '上传中请稍后', |
||||
|
// mask: true |
||||
|
// }) |
||||
|
// let upfile = await uniCloud.uploadFile({ |
||||
|
// filePath: item.path, |
||||
|
// // 同名会导致报错 policy_does_not_allow_file_overwrite |
||||
|
// // cloudPath可由 想要存储的文件夹/文件名 拼接，若不拼文件夹名则默认存储在cloudstorage文件夹中 |
||||
|
// cloudPath: `cloudstorage/${item.name}`, |
||||
|
// cloudPathAsRealPath: true |
||||
|
// }) |
||||
|
// editorCtx.insertImage({ |
||||
|
// src: upfile.fileID, |
||||
|
// width: '80%', // 默认不建议铺满宽度100%，预留一点空隙以便用户编辑 |
||||
|
// success: function () { |
||||
|
// uni.hideLoading() |
||||
|
// } |
||||
|
// }) |
||||
|
// }) |
||||
|
}, |
||||
|
//跳转分类页 |
||||
|
goGategoryLow() { |
||||
|
uni.navigateTo({ |
||||
|
url: '/pages/shop/addType' |
||||
|
}) |
||||
|
}, |
||||
|
//初始化获取分类列表 |
||||
|
getGategoryList() { |
||||
|
|
||||
|
this.NB.sendRequest("/app/productCategory/list", { |
||||
|
shopId:uni.getStorageSync('shopId') |
||||
|
}, false, 'get', 'application/json').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
if (res.result.length > 0) { |
||||
|
if(this.formData.categoryId != '' && this.formData.categoryId != undefined){ |
||||
|
for(let i=0;i<res.result.length;i++){ |
||||
|
if(res.result[i].id == this.formData.categoryId){ |
||||
|
this.typeItem = res.result[i] |
||||
|
} |
||||
|
} |
||||
|
}else{ |
||||
|
this.typeItem = res.result[0] |
||||
|
this.formData.categoryId = this.typeItem.id |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} else { |
||||
|
this.tui.toast(res.message) |
||||
|
} |
||||
|
}).catch((res) => {}) |
||||
|
}, |
||||
|
// 触发提交表单 |
||||
|
submit() { |
||||
|
let that = this; |
||||
|
// this.$refs.form.validate((valid) => { |
||||
|
// if (valid) { |
||||
|
if (this.modalType == 0) { |
||||
|
// 添加 避免编辑后传入id等数据 记得删除 |
||||
|
delete this.formData.id; |
||||
|
if(this.formData.isMoreBuy != 1){ |
||||
|
this.formData.isMoreBuy = 0 |
||||
|
} |
||||
|
this.formData.attributeListPrice = JSON.stringify(this.formData.attributeListPrice) |
||||
|
this.formData.attributeList = Object.fromEntries(this.formData.attributeList1) |
||||
|
this.formData.attributeList = JSON.stringify(this.formData.attributeList) |
||||
|
|
||||
|
this.NB.sendRequest("/app/product/save", this.formData, false, 'post', 'application/json').then((res) => { |
||||
|
if(res.code == 200){ |
||||
|
that.tui.toast("操作成功"); |
||||
|
uni.navigateBack() |
||||
|
} |
||||
|
}).catch(() => {}); |
||||
|
} else if (this.modalType == 1) { |
||||
|
// 编辑 |
||||
|
this.formData.attributeListPrice = JSON.stringify(this.formData.attributeListPrice) |
||||
|
this.formData.attributeList = Object.fromEntries(this.formData.attributeList1) |
||||
|
this.formData.attributeList = JSON.stringify(this.formData.attributeList) |
||||
|
this.formData.productPictures = [] |
||||
|
|
||||
|
this.NB.sendRequest("/app/product/edit", this.formData, false, 'post', 'application/json').then((res) => { |
||||
|
if(res.code == 200){ |
||||
|
that.tui.toast("操作成功"); |
||||
|
uni.navigateBack() |
||||
|
} |
||||
|
}).catch(() => {}); |
||||
|
} |
||||
|
// } |
||||
|
// }); |
||||
|
}, |
||||
|
back() { |
||||
|
uni.navigateBack() |
||||
|
}, |
||||
|
checkisMoreBuy(type){ |
||||
|
this.formData.isMoreBuy = type; |
||||
|
}, |
||||
|
checkSellTime(type){ |
||||
|
this.formData.sellTime = type; |
||||
|
}, |
||||
|
selectDateRange(e,type){ |
||||
|
if(type == 'start'){ |
||||
|
this.formData.sellBeginTime = e.detail.value |
||||
|
}else{ |
||||
|
this.formData.sellEndTime = e.detail.value |
||||
|
} |
||||
|
}, |
||||
|
guigeSubmit(){ |
||||
|
if(this.modalclassType == 'shuxing'){ |
||||
|
for(let i=0;i<this.attrValueArr.length;i++){ |
||||
|
if(this.formData.attributeList1.size == 0){ |
||||
|
//set has get |
||||
|
let data = { |
||||
|
title:[] |
||||
|
} |
||||
|
data.title.push(this.attrValueArr[i].title) |
||||
|
this.formData.attributeList1.set(this.attrValueArr[i].parentName,data) |
||||
|
}else{ |
||||
|
if(this.formData.attributeList1.has(this.attrValueArr[i].parentName) && this.formData.attributeList1.get(this.attrValueArr[i].parentName).title.indexOf(this.attrValueArr[i].title) == -1){ |
||||
|
this.formData.attributeList1.get(this.attrValueArr[i].parentName).title.push(this.attrValueArr[i].title) |
||||
|
}else{ |
||||
|
let data = { |
||||
|
title:[] |
||||
|
} |
||||
|
data.title.push(this.attrValueArr[i].title) |
||||
|
this.formData.attributeList1.set(this.attrValueArr[i].parentName,data) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
}else{ |
||||
|
//guige |
||||
|
let message = [] |
||||
|
for(let i=0;i<this.specValueArr.length;i++){ |
||||
|
for(let m=0;m<this.formData.attributeListPrice.length;m++){ |
||||
|
if(this.specValueArr[i].id == this.formData.attributeListPrice[m].id){ |
||||
|
this.specValueArr[i].specPrice = this.formData.attributeListPrice[m].specPrice |
||||
|
this.specValueArr[i].specName = this.formData.attributeListPrice[m].specName |
||||
|
this.specValueArr[i].specNum = this.formData.attributeListPrice[m].specNum |
||||
|
} |
||||
|
} |
||||
|
message.push({ |
||||
|
id:this.specValueArr[i].id, |
||||
|
specName:this.specValueArr[i].specName == undefined ? this.specValueArr[i].title : this.specValueArr[i].specName, |
||||
|
specPrice:this.specValueArr[i].specPrice == undefined ? '' : this.specValueArr[i].specPrice, |
||||
|
specNum:this.specValueArr[i].specNum == undefined ? 9999 : this.specValueArr[i].specNum |
||||
|
}) |
||||
|
} |
||||
|
this.formData.attributeListPrice = message |
||||
|
} |
||||
|
this.$forceUpdate() |
||||
|
this.$refs.addTypeDialog.close() |
||||
|
}, |
||||
|
add() { |
||||
|
if (!this.selectNode.id) { |
||||
|
this.$Message.warning("请先选择一个分类"); |
||||
|
return; |
||||
|
} |
||||
|
this.modalType = 0; |
||||
|
this.$refs.form.resetFields(); |
||||
|
this.form.sort = this.data.length + 1; |
||||
|
this.formData = { |
||||
|
id:'', |
||||
|
shopId:'', |
||||
|
categoryId:'', //商品分类id |
||||
|
categoryName:'', //商品分类名称 |
||||
|
productPicture:'', //商品图标 |
||||
|
productName:'', //商品名称 |
||||
|
lunchBox:0, //餐盒 |
||||
|
startPayNum:'', //起售数量 |
||||
|
orderFiled:'',//排名 |
||||
|
attributeListPrice:[{ //商品规格 |
||||
|
specPrice:"", |
||||
|
specNum:9999 |
||||
|
}], |
||||
|
sellTime:0, //可售时间 |
||||
|
sellBeginTime:'', //可售时段自定义---开始时间 |
||||
|
sellEndTime:'', //可售时段自定义---结束时间 |
||||
|
attributeList:'', |
||||
|
productGroupBuyPrices:[], |
||||
|
attributeList1:new Map(), //商品属性 |
||||
|
productIntro:"" //详细图文 |
||||
|
} |
||||
|
this.specValueArr = [] |
||||
|
this.attrValueArr = [] |
||||
|
this.formData.shopId = this.shopId |
||||
|
this.formData.categoryId = this.selectNode.id |
||||
|
this.formData.categoryName = this.selectNode.categoryName |
||||
|
this.modalVisible = true; |
||||
|
}, |
||||
|
edit(v) { |
||||
|
this.modalType = 1; |
||||
|
// 转换null为"" |
||||
|
for (let attr in v) { |
||||
|
if (v[attr] == null) { |
||||
|
v[attr] = ""; |
||||
|
} |
||||
|
} |
||||
|
let str = JSON.stringify(v); |
||||
|
let data = JSON.parse(str); |
||||
|
console.log('111111',data) |
||||
|
this.formData = data; |
||||
|
this.formData.attributeList1 = JSON.parse(this.formData.attributeList) |
||||
|
this.formData.attributeList1 = new Map(Object.entries(this.formData.attributeList1)); |
||||
|
this.formData.attributeListPrice = JSON.parse(this.formData.attributeListPrice) |
||||
|
|
||||
|
this.formData.attributeList1.forEach((value, key) => { |
||||
|
for(let i = 0;i<value.title.length;i++){ |
||||
|
this.attrValueArr.push({ |
||||
|
parentName:key, |
||||
|
title:value.title[i] |
||||
|
}) |
||||
|
} |
||||
|
}); |
||||
|
this.specValueArr = this.formData.attributeListPrice |
||||
|
|
||||
|
|
||||
|
this.formData.sellTime = this.formData.sellBeginTime != '' ? 1 : 0 |
||||
|
this.modalVisible = true; |
||||
|
}, |
||||
|
checkSpecValue(index){ |
||||
|
this.categorySonData[index].checked = !this.categorySonData[index].checked |
||||
|
if(this.modalclassType == 'shuxing'){ |
||||
|
if(this.categorySonData[index].checked == true){ |
||||
|
this.categorySonData[index].parentName = this.typeToAttrName |
||||
|
this.attrValueArr.push(this.categorySonData[index]) |
||||
|
}else{ |
||||
|
for(let i=0;i<this.attrValueArr.length;i++){ |
||||
|
if(this.categorySonData[index].title == this.attrValueArr[i].title){ |
||||
|
this.attrValueArr.splice(i,1) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
}else{ |
||||
|
//guige |
||||
|
if(this.categorySonData[index].checked == true){ |
||||
|
this.specValueArr.push(this.categorySonData[index]) |
||||
|
}else{ |
||||
|
for(let i=0;i<this.specValueArr.length;i++){ |
||||
|
if(this.categorySonData[index].id == this.specValueArr[i].id){ |
||||
|
this.specValueArr.splice(i,1) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
this.$forceUpdate() |
||||
|
}, |
||||
|
//点击左侧菜单切换 |
||||
|
clickLeftBtn(index) { |
||||
|
for (var i = 0; i < this.categoryData.length; i++) { |
||||
|
if (i == index) { |
||||
|
this.categoryData[i].parentId = true |
||||
|
} else { |
||||
|
this.categoryData[i].parentId = false |
||||
|
} |
||||
|
} |
||||
|
this.categoryIndex = index |
||||
|
this.typeToAttrName = this.categoryData[this.categoryIndex].title |
||||
|
this.getCateGorySon(this.categoryData[this.categoryIndex].id) |
||||
|
}, |
||||
|
pictureAdd(id, huan) { |
||||
|
let that = this |
||||
|
uni.chooseMedia({ |
||||
|
count: 9, |
||||
|
mediaType: ['image'], |
||||
|
sourceType: ['album', 'camera'], |
||||
|
success(res) { |
||||
|
uni.showLoading({ |
||||
|
title: '加载中...', |
||||
|
mask: true |
||||
|
}) |
||||
|
for (let i = 0; i < res.tempFiles.length; i++) { |
||||
|
that.upLoadFile(res.tempFiles[i].tempFilePath) |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
checkSpec(type){ |
||||
|
this.$refs.addTypeDialog.open() |
||||
|
this.modalclassType = type |
||||
|
|
||||
|
this.NB.sendRequest("/dictData/getByCondition", { |
||||
|
name: "", |
||||
|
status: "", |
||||
|
pageNumber: 1, |
||||
|
pageSize: 100000, |
||||
|
sort: 'sortOrder', |
||||
|
order: 'asc', |
||||
|
dictId: '2026945661353725952' |
||||
|
}, false, 'GET', 'application/json').then((res) => { |
||||
|
if(res.code == 200){ |
||||
|
this.categoryData = res.result.content |
||||
|
for (var i = 0; i < this.categoryData.length; i++) { |
||||
|
if (i == this.categoryIndex) { |
||||
|
this.categoryData[i].parentId = true |
||||
|
} else { |
||||
|
this.categoryData[i].parentId = false |
||||
|
} |
||||
|
} |
||||
|
//如果是选择属性，需要拿一个分类名，保存成parent |
||||
|
this.typeToAttrName = res.result.content[this.categoryIndex].title |
||||
|
this.getCateGorySon(res.result.content[this.categoryIndex].id) |
||||
|
} |
||||
|
}).catch(() => {}); |
||||
|
}, |
||||
|
getCateGorySon(id){ |
||||
|
|
||||
|
this.NB.sendRequest("/dictData/getByCondition", { |
||||
|
name: "", |
||||
|
status: "", |
||||
|
pageNumber: 1, |
||||
|
pageSize: 100000, |
||||
|
sort: 'sortOrder', |
||||
|
order: 'asc', |
||||
|
dictId: id |
||||
|
}, false, 'GET', 'application/json').then((res) => { |
||||
|
if(res.code == 200){ |
||||
|
this.categorySonData = res.result.content |
||||
|
if(this.modalclassType == 'shuxing'){ |
||||
|
for (var i = 0; i < this.categorySonData.length; i++) { |
||||
|
if(this.attrValueArr.length>0){ |
||||
|
let index1 = false |
||||
|
for (var m = 0; m < this.attrValueArr.length; m++) { |
||||
|
if(this.attrValueArr[m].title == this.categorySonData[i].title){ |
||||
|
index1 = true |
||||
|
this.categorySonData[i].checked = true |
||||
|
} |
||||
|
} |
||||
|
if(index1){ |
||||
|
this.categorySonData[i].checked = true |
||||
|
} |
||||
|
}else{ |
||||
|
this.categorySonData[i].checked = false |
||||
|
} |
||||
|
} |
||||
|
}else{ |
||||
|
//guige |
||||
|
|
||||
|
|
||||
|
for (var i = 0; i < this.categorySonData.length; i++) { |
||||
|
if(this.specValueArr.length>0){ |
||||
|
for (var m = 0; m < this.specValueArr.length; m++) { |
||||
|
if(this.specValueArr[m].id == this.categorySonData[i].id){ |
||||
|
this.categorySonData[i].checked = true |
||||
|
} |
||||
|
} |
||||
|
}else{ |
||||
|
this.categorySonData[i].checked = false |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
}).catch(() => {}); |
||||
|
}, |
||||
|
deldantiaoguige(index){ |
||||
|
for (var m = 0; m < this.specValueArr.length; m++) { |
||||
|
if(this.specValueArr[m].id == this.formData.attributeListPrice[index].id){ |
||||
|
this.specValueArr.splice(m,1) |
||||
|
this.formData.attributeListPrice.splice(index,1) |
||||
|
console.log("11",this.formData.attributeListPrice) |
||||
|
if(this.formData.attributeListPrice.length == 1){ |
||||
|
this.formData.attributeListPrice = [] |
||||
|
this.formData.attributeListPrice.push({ |
||||
|
specName:"", |
||||
|
specPrice:'', |
||||
|
specNum:9999 |
||||
|
}) |
||||
|
this.specValueArr = [] |
||||
|
} |
||||
|
this.$forceUpdate() |
||||
|
return |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
delGroup(index){ |
||||
|
this.formData.productGroupBuyPrices.splice(index,1) |
||||
|
}, |
||||
|
changePrice(index){ |
||||
|
this.specValueArr[index].specPrice = this.formData.attributeListPrice[index].specPrice |
||||
|
}, |
||||
|
changeCount(index){ |
||||
|
this.specValueArr[index].specNum = this.formData.attributeListPrice[index].specNum |
||||
|
}, |
||||
|
addGroup(){ |
||||
|
let data = { |
||||
|
groupCount:'', |
||||
|
groupPrice:0 |
||||
|
} |
||||
|
this.formData.productGroupBuyPrices.push(data) |
||||
|
}, |
||||
|
async upLoadFile(path) { |
||||
|
let that = this; |
||||
|
let hiver_token = uni.getStorageSync("hiver_token") |
||||
|
await uni.uploadFile({ |
||||
|
url: getApp().globalData.mainurl + '/upload/file', |
||||
|
filePath: path, |
||||
|
name: 'file', |
||||
|
header: { |
||||
|
"content-type": "multipart/form-data", |
||||
|
'accessToken': hiver_token |
||||
|
}, |
||||
|
formData: {}, |
||||
|
success: (uploadFileRes) => { |
||||
|
let pathData = JSON.parse(uploadFileRes.data) |
||||
|
that.formData.productPicture = pathData.result |
||||
|
that.$forceUpdate() |
||||
|
}, |
||||
|
fail: (err) => { |
||||
|
uni.hideLoading(); |
||||
|
uni.showToast({ |
||||
|
title: JSON.stringify(err), |
||||
|
icon: 'none' |
||||
|
}) |
||||
|
} |
||||
|
}); |
||||
|
await setTimeout(res => { |
||||
|
uni.hideLoading(); |
||||
|
}, 1000) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
page { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
background: #F5F8F5; |
||||
|
color: #00231C; |
||||
|
} |
||||
|
|
||||
|
.page1 { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat; |
||||
|
width: 100%; |
||||
|
height: 13%; |
||||
|
} |
||||
|
|
||||
|
.title-sreach { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
height: 200rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.back-btn { |
||||
|
padding-top: 110rpx; |
||||
|
} |
||||
|
|
||||
|
.title-name { |
||||
|
padding-top: 110rpx; |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 700; |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.formBox { |
||||
|
padding: 10px 13px; |
||||
|
border-radius: 7px; |
||||
|
box-shadow: 0 1px 10px 2px #e2e2e2; |
||||
|
background-color: #fff; |
||||
|
overflow: scroll; |
||||
|
height: 85%; |
||||
|
} |
||||
|
|
||||
|
.upload-img { |
||||
|
width: 160rpx; |
||||
|
height: 160rpx; |
||||
|
} |
||||
|
|
||||
|
button { |
||||
|
height: 90rpx; |
||||
|
line-height: 90rpx; |
||||
|
font-size: 36rpx; |
||||
|
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1)); |
||||
|
border-radius: 20rpx; |
||||
|
font-weight: 700; |
||||
|
flex: 1; |
||||
|
} |
||||
|
|
||||
|
.content-input { |
||||
|
width: auto; |
||||
|
position: relative; |
||||
|
overflow: hidden; |
||||
|
flex: 1; |
||||
|
line-height: 1; |
||||
|
font-size: 28rpx; |
||||
|
height: 70rpx; |
||||
|
border: 4rpx solid #eee; |
||||
|
padding-left: 20rpx; |
||||
|
border-radius: 10rpx; |
||||
|
} |
||||
|
|
||||
|
.add-popup-content { |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
padding: 30rpx 30rpx 30rpx 0; |
||||
|
width: 600rpx; |
||||
|
height: 1050rpx; |
||||
|
background-color: #fff; |
||||
|
overflow: scroll; |
||||
|
border-radius: 20rpx; |
||||
|
} |
||||
|
.xiangxi-box{ |
||||
|
flex: 1; |
||||
|
border: 1px solid #eee; |
||||
|
border-radius: 20rpx; |
||||
|
} |
||||
|
.left-box { |
||||
|
width: 100%; |
||||
|
height: 100rpx; |
||||
|
font-size: 28rpx; |
||||
|
text-align: center; |
||||
|
line-height: 100rpx; |
||||
|
border-bottom: 1px solid #fff; |
||||
|
} |
||||
|
|
||||
|
.left-box-hover { |
||||
|
width: 100%; |
||||
|
height: 100rpx; |
||||
|
font-size: 28rpx; |
||||
|
text-align: center; |
||||
|
line-height: 50rpx; |
||||
|
border-bottom: 1px solid #fff; |
||||
|
background-color: #fff; |
||||
|
} |
||||
|
.content-left { |
||||
|
width: 160rpx; |
||||
|
background: #eee; |
||||
|
height: 900rpx; |
||||
|
overflow: scroll; |
||||
|
scrollbar-width: none; |
||||
|
} |
||||
|
.content-low{ |
||||
|
height: 60rpx; |
||||
|
padding: 0 10rpx; |
||||
|
border: 1px solid #eee; |
||||
|
display: inline-block; |
||||
|
margin: 10rpx; |
||||
|
font-weight: bold; |
||||
|
line-height: 60rpx; |
||||
|
} |
||||
|
.checked{ |
||||
|
background: #60F3FF; |
||||
|
color: #fff !important; |
||||
|
} |
||||
|
.uni-input{ |
||||
|
width: 200rpx; |
||||
|
height: 50rpx; |
||||
|
line-height: 50rpx; |
||||
|
border-radius: 10rpx; |
||||
|
border: 1px solid #eee; |
||||
|
text-align: center; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,381 @@ |
|||||
|
<template> |
||||
|
<!-- 分类管理 --> |
||||
|
<view class="page1"> |
||||
|
<view class="title"> |
||||
|
<view class="title-sreach"> |
||||
|
<view class="back-btn" @tap="back"> |
||||
|
<uni-icons type="left" size="28"></uni-icons> |
||||
|
</view> |
||||
|
<view class="title-name"> |
||||
|
分类管理 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="card-list"> |
||||
|
<ul> |
||||
|
<li @tap="clickList(item)" v-for="(item, index) in indexList" :key="index" style="height: 100rpx;line-height: 100rpx;border-bottom: 1px solid #eee;overflow: hidden;"> |
||||
|
<view class="name"> |
||||
|
<text>{{item.categoryName}}</text> |
||||
|
</view> |
||||
|
<button class="bj-btn" @tap.stop="inputDialogToggle('edit', item)">编辑</button> |
||||
|
</li> |
||||
|
</ul> |
||||
|
</view> |
||||
|
<view style="width: 100%;position: fixed;bottom:0;background: #fff;z-index: 99;height: 172rpx;"> |
||||
|
<view class="add-btn" @tap="inputDialogToggle('add')">添加分类</view> |
||||
|
</view> |
||||
|
<!-- 添加分类弹出层 --> |
||||
|
<uni-popup ref="addTypeDialog" background-color="#fff"> |
||||
|
<view class="add-popup-content"> |
||||
|
<view class="add-popup-title"> |
||||
|
<text>新增分类</text> |
||||
|
<uni-icons @tap='close' type="closeempty" color='red' size="16" |
||||
|
style="height:40rpx;line-height: 40rpx;position: absolute !important;bottom:0;right: 30rpx;"></uni-icons> |
||||
|
</view> |
||||
|
<view class="add-popup-container"> |
||||
|
<input type="text" v-model="typeText" class="add-input" placeholder="请输入分类名称"> |
||||
|
<input type="text" v-model="sortText" class="add-input" placeholder="可设置分类排序"> |
||||
|
<view class="add-popup-bottom"> |
||||
|
<view class="add-popup-btn" @tap="dialogInputConfirm">确认</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</uni-popup> |
||||
|
<!-- 编辑分类弹窗 --> |
||||
|
<uni-popup ref="delDialog" type="dialog"> |
||||
|
<view class="type-popup" |
||||
|
style="width:100%;margin-bottom: 0;border-radius: 0;height: 650rpx;border-radius: 20rpx;"> |
||||
|
<view style="height: 120rpx;font-size: 36rpx;font-weight: bold;line-height: 120rpx;text-align: center;"> |
||||
|
编辑分类 |
||||
|
</view> |
||||
|
<view style="height: 80rpx;font-size: 28rpx;line-height: 80rpx;text-align: center;"> |
||||
|
请在下方输入框中输入分类名 |
||||
|
</view> |
||||
|
<view style="width: 90%;margin: 40rpx auto 0;"> |
||||
|
分类名称： |
||||
|
<uni-easyinput type="text" v-model="inputVal" placeholder="请输入规格值" /> |
||||
|
</view> |
||||
|
<view style="width: 90%;margin: 40rpx auto 0;"> |
||||
|
排序：<uni-easyinput type="text" v-model="sortTextEdit" placeholder="可设置排序" /> |
||||
|
</view> |
||||
|
<view |
||||
|
style="width: 100%;height: 90rpx;line-height: 90rpx;text-align: center;border-radius: 0;color: #fff;display: flex;position: absolute;bottom: 0;"> |
||||
|
<view style="flex: 1;background: linear-gradient(90deg, #60F3FF, #088FEB);" @tap="delItem">删除 |
||||
|
</view> |
||||
|
<view style="flex: 1;background: linear-gradient(90deg, #FF9797, #FFC1E0);" |
||||
|
@tap="dialogInputConfirm">确认</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</uni-popup> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
show: false, |
||||
|
indexList: [], |
||||
|
inputVal: '', |
||||
|
multipleList:[], |
||||
|
sortText:'', |
||||
|
sortTextEdit:'', |
||||
|
typeText:'', |
||||
|
editItem: {}, |
||||
|
delItems: {}, |
||||
|
} |
||||
|
}, |
||||
|
filters: { |
||||
|
|
||||
|
}, |
||||
|
onShow() { |
||||
|
|
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
this.getGategoryList() |
||||
|
}, |
||||
|
methods: { |
||||
|
close(){ |
||||
|
this.$refs.addTypeDialog.close() |
||||
|
}, |
||||
|
//初始化获取分类列表 |
||||
|
getGategoryList() { |
||||
|
this.NB.sendRequest("/app/productCategory/list", { |
||||
|
shopId:uni.getStorageSync('shopId') |
||||
|
}, false, 'get', 'application/json').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
this.indexList = res.result; |
||||
|
} else { |
||||
|
this.tui.toast(res.message) |
||||
|
} |
||||
|
}).catch(() => {}); |
||||
|
}, |
||||
|
delItem(item, type) { |
||||
|
uni.showModal({ |
||||
|
title: '提示', |
||||
|
content: '确定删除该分类吗？', |
||||
|
success: function (res) { |
||||
|
if (res.confirm) { |
||||
|
this.delItemModal() |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
delItemModal() { |
||||
|
this.NB.sendRequest("/app/productCategory/delById", { |
||||
|
id: this.editItem.id, |
||||
|
}, false, 'POST', 'application/x-www-form-urlencoded').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
this.getGategoryList() |
||||
|
uni.showToast({ |
||||
|
title: "删除成功", |
||||
|
icon: 'none' |
||||
|
}) |
||||
|
this.$refs.carPopup.close() |
||||
|
this.$refs.delDialog.close() |
||||
|
|
||||
|
} else { |
||||
|
uni.showToast({ |
||||
|
title: "删除失败", |
||||
|
icon: 'none' |
||||
|
}) |
||||
|
} |
||||
|
}).catch(() => {}); |
||||
|
}, |
||||
|
//分类编辑（新增，修改） |
||||
|
dialogInputConfirm() { |
||||
|
let that = this; |
||||
|
switch (that.typeModel) { |
||||
|
case 'add': |
||||
|
for (let i = 0; i < that.indexList.length; i++) { |
||||
|
if (that.indexList[i].categoryName == that.typeText) { |
||||
|
uni.showToast({ |
||||
|
title: "请勿重复添加！", |
||||
|
icon: 'error' |
||||
|
}) |
||||
|
return |
||||
|
} |
||||
|
} |
||||
|
if(that.typeText == ''){ |
||||
|
that.tui.toast("请输入分类名") |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
this.NB.sendRequest("/app/productCategory/save", { |
||||
|
categoryName: that.typeText, |
||||
|
sort: that.sortText, |
||||
|
productAttributeOfAddVos:that.multipleList, |
||||
|
shopId:uni.getStorageSync('shopId') |
||||
|
}, false, 'POST', 'application/x-www-form-urlencoded').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
that.tui.toast("添加成功") |
||||
|
that.$refs.addTypeDialog.close() |
||||
|
that.sortText = '' |
||||
|
|
||||
|
that.getGategoryList() |
||||
|
} else { |
||||
|
that.tui.toast("添加失败") |
||||
|
} |
||||
|
}).catch(() => {}); |
||||
|
|
||||
|
that.typeText = '' |
||||
|
that.inputVal = '' |
||||
|
that.multipleList = [] |
||||
|
break; |
||||
|
case 'edit': |
||||
|
this.NB.sendRequest("/app/productCategory/edit", { |
||||
|
categoryName: this.inputVal, |
||||
|
sort: that.sortTextEdit, |
||||
|
id: that.editItem.id, |
||||
|
shopId:uni.getStorageSync('shopId') |
||||
|
}, false, 'POST', 'application/x-www-form-urlencoded').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
that.getGategoryList() |
||||
|
that.sortText = '' |
||||
|
uni.showToast({ |
||||
|
title: "修改成功", |
||||
|
icon: 'none' |
||||
|
}) |
||||
|
} else { |
||||
|
uni.showToast({ |
||||
|
title: "修改失败", |
||||
|
icon: 'none' |
||||
|
}) |
||||
|
} |
||||
|
}).catch(() => {}); |
||||
|
break; |
||||
|
default: |
||||
|
} |
||||
|
that.$refs.delDialog.close() |
||||
|
this.inputVal = "" |
||||
|
this.$forceUpdate() |
||||
|
}, |
||||
|
//判断需要打开哪个弹窗（删除弹窗、取消弹窗） |
||||
|
inputDialogToggle(type, item, parent) { |
||||
|
this.typeModel = type; |
||||
|
if (type == 'edit') { |
||||
|
this.inputVal = item.categoryName; |
||||
|
this.editItem = item; |
||||
|
this.sortTextEdit = (this.editItem.sort == null || this.editItem.sort == 'null') ? '' : this.editItem |
||||
|
.sort |
||||
|
this.$refs.delDialog.open('bottom') |
||||
|
} else if (type == 'add') { |
||||
|
this.inputVal = ''; |
||||
|
this.isOpenId = item; |
||||
|
this.dialogTit = '输入分类名' |
||||
|
this.$refs.addTypeDialog.open('bottom') |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
//点击选择列表，带参数 返回上一页 |
||||
|
clickList(item) { |
||||
|
let pages = getCurrentPages(); |
||||
|
let prevPage = pages[pages.length - 2]; |
||||
|
prevPage.$vm.typeItem = item |
||||
|
uni.navigateBack({ |
||||
|
delta: 1 |
||||
|
}) |
||||
|
}, |
||||
|
back() { |
||||
|
uni.navigateBack() |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
page { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
background: #F5F8F5; |
||||
|
color: #00231C; |
||||
|
} |
||||
|
|
||||
|
.page1 { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat; |
||||
|
width: 100%; |
||||
|
height: 20%; |
||||
|
} |
||||
|
|
||||
|
.title-sreach { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
height: 200rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.back-btn { |
||||
|
padding-top: 110rpx; |
||||
|
} |
||||
|
|
||||
|
.title-name { |
||||
|
padding-top: 110rpx; |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 700; |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.card-list { |
||||
|
width: 95%; |
||||
|
border-radius: 10upx; |
||||
|
background: #fff; |
||||
|
height: auto; |
||||
|
margin: -120rpx auto; |
||||
|
} |
||||
|
|
||||
|
.name { |
||||
|
width: 75%; |
||||
|
float: left; |
||||
|
display: flex; |
||||
|
} |
||||
|
|
||||
|
.bj-btn { |
||||
|
width: 88rpx; |
||||
|
height: 50rpx; |
||||
|
font-size: 24rpx; |
||||
|
padding: 0; |
||||
|
line-height: 50rpx; |
||||
|
border-radius: 50rpx; |
||||
|
border: none; |
||||
|
} |
||||
|
|
||||
|
.type-popup { |
||||
|
width: 500rpx; |
||||
|
height: auto; |
||||
|
background: #fff; |
||||
|
border-radius: 20rpx; |
||||
|
position: relative; |
||||
|
margin-bottom: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.add-btn { |
||||
|
width: 95%; |
||||
|
height: 100rpx; |
||||
|
margin: 20rpx auto 0; |
||||
|
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1)); |
||||
|
font-size: 32rpx; |
||||
|
font-weight: 700; |
||||
|
text-align: center; |
||||
|
line-height: 100rpx; |
||||
|
border-radius: 100rpx; |
||||
|
} |
||||
|
|
||||
|
.add-popup-content { |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
// padding: 30rpx; |
||||
|
width: 100%; |
||||
|
height: 400rpx; |
||||
|
background-color: #fff; |
||||
|
} |
||||
|
|
||||
|
.add-popup-title { |
||||
|
font-size: 36rpx; |
||||
|
font-weight: bold; |
||||
|
text-align: center; |
||||
|
position: relative; |
||||
|
width: 95%; |
||||
|
margin: 20rpx auto 0; |
||||
|
} |
||||
|
|
||||
|
.add-popup-container { |
||||
|
width: 95%; |
||||
|
margin: 20rpx auto 0; |
||||
|
} |
||||
|
|
||||
|
.add-popup-bottom { |
||||
|
display: flex; |
||||
|
height: 80rpx; |
||||
|
color: #fff; |
||||
|
line-height: 80rpx; |
||||
|
margin-top: 50rpx; |
||||
|
} |
||||
|
|
||||
|
.add-popup-btn { |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
background: rgba(0, 35, 28, 1); |
||||
|
border-radius: 80rpx; |
||||
|
color: rgba(166, 255, 234, 1); |
||||
|
} |
||||
|
.add-input{ |
||||
|
width: 95%; |
||||
|
border: 1px solid #eee; |
||||
|
height: 80rpx; |
||||
|
padding-left: 20rpx; |
||||
|
margin:20rpx auto 0; |
||||
|
font-size: 25rpx; |
||||
|
line-height: 80rpx; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,333 @@ |
|||||
|
<template> |
||||
|
<!-- 商家数据统计 --> |
||||
|
<view class="page1"> |
||||
|
<view class="title"> |
||||
|
<view class="title-sreach"> |
||||
|
<view class="back-btn" @tap="back"> |
||||
|
<uni-icons type="left" size="28"></uni-icons> |
||||
|
</view> |
||||
|
<view class="title-name"> |
||||
|
数据统计 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="margin-top: -120rpx;"> |
||||
|
<uni-datetime-picker style="margin-bottom:20rpx;" v-model="range" type="daterange" @change="searchList" /> |
||||
|
</view> |
||||
|
<view style="width: 100%;margin: 20rpx auto;background: #fff;"> |
||||
|
<view class="box"> |
||||
|
<view style="width: 69%;"> |
||||
|
<view style="width: 50rpx;height: 50rpx;float: left;margin-right: 20rpx;"> |
||||
|
<uni-icons type="cart" size="24" color="red"></uni-icons> |
||||
|
</view> |
||||
|
销售金额 |
||||
|
</view> |
||||
|
<view style="width: 30%;text-align: right;"> |
||||
|
<text style="display: inline-block;width: 150rpx;text-align: center;">{{shopInfo.totalAmount}}</text> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box"> |
||||
|
<view style="width: 69%;"> |
||||
|
<view style="width: 50rpx;height: 50rpx;float: left;margin-right: 20rpx;"> |
||||
|
<uni-icons type="cart" size="24" color="red"></uni-icons> |
||||
|
</view> |
||||
|
销量 |
||||
|
</view> |
||||
|
<view style="width: 30%;text-align: right;"> |
||||
|
<text style="display: inline-block;width: 150rpx;text-align: center;">{{shopInfo.totalJCount}}</text> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="width: 100%;height: 10rpx;background: #eee;"></view> |
||||
|
<view class="box"> |
||||
|
<view style="width: 69%;"> |
||||
|
<view style="width: 50rpx;height: 50rpx;float: left;margin-right: 20rpx;"> |
||||
|
<uni-icons type="wallet" size="24" color="red"></uni-icons> |
||||
|
</view> |
||||
|
销售利润 |
||||
|
</view> |
||||
|
<view style="width: 30%;text-align: right;"> |
||||
|
<text style="display: inline-block;width: 150rpx;text-align: center;">{{shopInfo.totalProfit==null?0:shopInfo.totalProfit}}</text> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="width: 100%;height: 10rpx;background: #eee;"></view> |
||||
|
<view class="box"> |
||||
|
<view style="width: 69%;"> |
||||
|
<view style="width: 50rpx;height: 50rpx;float: left;margin-right: 20rpx;"> |
||||
|
<uni-icons type="refreshempty" size="24" color="red"></uni-icons> |
||||
|
</view> |
||||
|
退货金额 |
||||
|
</view> |
||||
|
<view style="width: 30%;text-align: right;"> |
||||
|
<text style="display: inline-block;width: 150rpx;text-align: center;">{{shopInfo.returnTotalAmount}}</text> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box"> |
||||
|
<view style="width: 69%;"> |
||||
|
<view style="width: 50rpx;height: 50rpx;float: left;margin-right: 20rpx;"> |
||||
|
<uni-icons type="refreshempty" size="24" color="red"></uni-icons> |
||||
|
</view> |
||||
|
退货数 |
||||
|
</view> |
||||
|
<view style="width: 30%;text-align: right;"> |
||||
|
<text style="display: inline-block;width: 150rpx;text-align: center;">{{shopInfo.returnTotalCount}}</text> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="width: 100%;height: 10rpx;background: #eee;"></view> |
||||
|
|
||||
|
<view class="box"> |
||||
|
<view style="width: 69%;"> |
||||
|
<view style="width: 50rpx;height: 50rpx;float: left;margin-right: 20rpx;"> |
||||
|
<uni-icons type="staff" size="24" color="red"></uni-icons> |
||||
|
</view> |
||||
|
下单客户 |
||||
|
</view> |
||||
|
<view style="width: 30%;text-align: right;"> |
||||
|
<text style="display: inline-block;width: 150rpx;text-align: center;">{{shopInfo.totalCCount}}</text> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- <view class="box" @tap="goDetail('rexiao')"> |
||||
|
<view style="width: 69%;"> |
||||
|
<view style="width: 50rpx;height: 50rpx;float: left;margin-right: 20rpx;"> |
||||
|
<uni-icons type="fire" size="24" color="red"></uni-icons> |
||||
|
</view> |
||||
|
热销商品 |
||||
|
</view> |
||||
|
<view style="width: 30%;"> |
||||
|
<text style="display: inline-block;width: 150rpx;text-align: center;"></text> |
||||
|
<uni-icons type="right" size="24" color="#777"></uni-icons> |
||||
|
</view> |
||||
|
</view> --> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
range:[], |
||||
|
shopInfo:{ |
||||
|
totalProfit:0, |
||||
|
returnTotalAmount:0, |
||||
|
saleReturnCost:0 |
||||
|
} |
||||
|
}; |
||||
|
}, |
||||
|
onShow(){ |
||||
|
if(this.range ==''){ |
||||
|
this.getMonth(); |
||||
|
} |
||||
|
this.getSaleInfo(); |
||||
|
}, |
||||
|
methods: { |
||||
|
getSaleInfo() { |
||||
|
this.shopInfo = { |
||||
|
totalProfit:0, |
||||
|
returnTotalAmount:0, |
||||
|
saleReturnCost:0 |
||||
|
} |
||||
|
|
||||
|
this.NB.sendRequest("/app/sale/getShopAll", { |
||||
|
pageVo: { |
||||
|
pageSize: 5, |
||||
|
pageNumber: 1 |
||||
|
}, |
||||
|
shopId:uni.getStorageSync('shopId'), |
||||
|
startTime:this.range[0], |
||||
|
endTime:this.range[1] |
||||
|
}, false, 'POST', 'application/json').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
this.shopInfo = res.result |
||||
|
} else { |
||||
|
this.tui.toast(res.message) |
||||
|
} |
||||
|
|
||||
|
}) |
||||
|
}, |
||||
|
//获取当月1日到当前时间 |
||||
|
getMonth() { |
||||
|
let date = new Date() |
||||
|
let year = date.getFullYear().toString() //'年' |
||||
|
let month = date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1).toString():(date.getMonth()+1).toString() //'月' |
||||
|
let da = date.getDate() < 10 ? '0'+date.getDate().toString():date.getDate().toString() //'日' |
||||
|
let end = year + '-' + month + '-' + da //当天 |
||||
|
let beg = year + '-' + month + '-01' //当月第一天 |
||||
|
this.range = [beg,end] |
||||
|
}, |
||||
|
back() { |
||||
|
uni.navigateBack() |
||||
|
}, |
||||
|
searchList() { |
||||
|
this.priceList = []; |
||||
|
this.getSaleInfo() |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
page { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
background: #F5F8F5; |
||||
|
color: #00231C; |
||||
|
} |
||||
|
|
||||
|
.page1 { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat; |
||||
|
width: 100%; |
||||
|
height: 20%; |
||||
|
} |
||||
|
|
||||
|
.title-sreach { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
height: 200rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.back-btn { |
||||
|
padding-top: 110rpx; |
||||
|
} |
||||
|
|
||||
|
.title-name { |
||||
|
padding-top: 110rpx; |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 700; |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.contentPadding { |
||||
|
padding: 28rpx 20rpx; |
||||
|
background-color: #fff; |
||||
|
color: #909399; |
||||
|
|
||||
|
.title { |
||||
|
padding-left: 20rpx; |
||||
|
font-size: 32rpx; |
||||
|
color: #303133; |
||||
|
margin-bottom: 26rpx; |
||||
|
line-height: 66rpx; |
||||
|
|
||||
|
image { |
||||
|
display: inline-block; |
||||
|
width: 40rpx; |
||||
|
vertical-align: middle; |
||||
|
} |
||||
|
|
||||
|
.btn { |
||||
|
text-align: right; |
||||
|
width: 24%; |
||||
|
float: right; |
||||
|
font-size: 26rpx; |
||||
|
} |
||||
|
} |
||||
|
.grid-text { |
||||
|
font-size: 28rpx; |
||||
|
margin-bottom: 26rpx; |
||||
|
text-align: center; |
||||
|
} |
||||
|
} |
||||
|
.u-grid-item { |
||||
|
width: 30% !important; |
||||
|
height: 160rpx; |
||||
|
background: linear-gradient(#84C1FF, #C4E1FF) !important; |
||||
|
margin-left: 3%; |
||||
|
border-radius: 30rpx; |
||||
|
margin-top: 20rpx !important; |
||||
|
color: #fff !important; |
||||
|
|
||||
|
} |
||||
|
.cardText { |
||||
|
font-size: 24rpx; |
||||
|
} |
||||
|
|
||||
|
.priceText { |
||||
|
font-size: 28rpx; |
||||
|
} |
||||
|
.u-grid-item:nth-child(2) { |
||||
|
background: linear-gradient(#FFBB77, #FFDCB9) !important; |
||||
|
} |
||||
|
|
||||
|
.u-grid-item:nth-child(3) { |
||||
|
background: linear-gradient(#1AFD9C, #7AFEC6) !important; |
||||
|
} |
||||
|
|
||||
|
.u-grid-item:nth-child(4) { |
||||
|
background: linear-gradient(#1AFD9C, #7AFEC6) !important; |
||||
|
} |
||||
|
.u-grid-item:nth-child(5) { |
||||
|
background: linear-gradient(#FFBB77, #FFDCB9) !important; |
||||
|
} |
||||
|
.u-grid-item:nth-child(6) { |
||||
|
background: linear-gradient(#84C1FF, #C4E1FF) !important; |
||||
|
} |
||||
|
.u-count-num { |
||||
|
color: #FFF !important; |
||||
|
text-align:center; |
||||
|
} |
||||
|
.uni-date{ |
||||
|
background: #fff; |
||||
|
} |
||||
|
.uni-tooltip-popup{ |
||||
|
width: 180rpx; |
||||
|
} |
||||
|
.u-icon{ |
||||
|
padding: 0 0 0 16rpx !important; |
||||
|
} |
||||
|
.u-zidingyi{ |
||||
|
width: 22% !important; |
||||
|
height: 160rpx; |
||||
|
background: linear-gradient(#84C1FF, #C4E1FF) !important; |
||||
|
margin-left: 3%; |
||||
|
border-radius: 30rpx; |
||||
|
margin-top: 20rpx !important; |
||||
|
color: #fff !important; |
||||
|
text-align: center; |
||||
|
padding-top: 20rpx; |
||||
|
} |
||||
|
.u-zidingyi:nth-child(2) { |
||||
|
background: linear-gradient(#FFBB77, #C4E1FF) !important; |
||||
|
} |
||||
|
.u-zidingyi:nth-child(3) { |
||||
|
background: linear-gradient(#84C1FF, #7AFEC6) !important; |
||||
|
} |
||||
|
.u-zidingyi:nth-child(4) { |
||||
|
background: linear-gradient(#84C1FF, #C4E1FF) !important; |
||||
|
} |
||||
|
.box{ |
||||
|
width: 100%; |
||||
|
height: 100rpx; |
||||
|
padding-left: 20rpx; |
||||
|
display: flex; |
||||
|
line-height: 100rpx; |
||||
|
font-size: 34rpx; |
||||
|
border-bottom: 1px solid #eee; |
||||
|
} |
||||
|
.tan-lirun{ |
||||
|
margin-top: 20rpx; |
||||
|
width: 45%; |
||||
|
height: 120rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
text-align: center; |
||||
|
float: left; |
||||
|
background-image: linear-gradient(#84C1FF, #C4E1FF) !important; |
||||
|
color: #fff; |
||||
|
border-radius: 20rpx; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,570 @@ |
|||||
|
<template> |
||||
|
<!-- 商品列表 --> |
||||
|
<view class="page1"> |
||||
|
<view class="title" style="z-index: 81;"> |
||||
|
<view class="title-sreach"> |
||||
|
<view class="back-btn" @tap="back"> |
||||
|
<uni-icons type="left" size="28"></uni-icons> |
||||
|
</view> |
||||
|
<view class="title-search" @tap="goDetail('search')"> |
||||
|
<uni-icons type="search" size="18" style="margin: 9rpx;"></uni-icons> |
||||
|
<input type="text" placeholder="搜索" @input="search" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="width: 100%;display: flex;height: 100%;padding-bottom: 60rpx;padding-top: 28%;position: fixed;top: 0;z-index:80;"> |
||||
|
<view class="content-left"> |
||||
|
<view class="left-box" v-for="(item, index) in indexList" :key="index" |
||||
|
:class="item.parentId ? 'left-box-hover':''" @tap="clickLeftBtn(index)"> |
||||
|
<text style="width: 100%;height: 90rpx;line-height: 90rpx;display: inline-block;overflow: hidden;" |
||||
|
:class="item.parentId ? 'red' :''">{{item.categoryName}}</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="content-right" style="padding-bottom: 140rpx;margin-bottom: 200rpx;"> |
||||
|
<view class="right-box" v-for="(item,index) in shopList" :key="index"> |
||||
|
<view style="position: relative;display: flex;"> |
||||
|
<view class="box-left" @tap="largeImg(item)"> |
||||
|
<view v-if="(item.buyCountNew!= null && item.buyCountNew!= undefined)" style="position: absolute;left: 110rpx;color: #fff;background: red;width: 45rpx;height: 40rpx;font-size: 28rpx;text-align: center;line-height: 40rpx;border-radius: 10rpx;"> |
||||
|
{{item.buyCountNew}} |
||||
|
</view> |
||||
|
<img class="img-radius" :src="item.productPicture" alt="" v-if="item.productPicture"> |
||||
|
<view class="noPic" v-else>暂无图片</view> |
||||
|
</view> |
||||
|
<view class="box-right"> |
||||
|
<view class="box-right-name"> |
||||
|
{{item.productName == null ?'':item.productName}} |
||||
|
<text style="color: red;" v-if="item.delFlag == 0">(已下架)</text> |
||||
|
</view> |
||||
|
<view class="box-right-num"></view> |
||||
|
<view class="box-right-price"> |
||||
|
<view class="price-box"> |
||||
|
<text>{{item.lunchBox}}</text> |
||||
|
<text>餐盒费</text> |
||||
|
</view> |
||||
|
<view class="price-box"> |
||||
|
<text>{{item.startPayNum}}</text> |
||||
|
<text>起售数量</text> |
||||
|
</view> |
||||
|
<view class="price-box" @tap="changeShow(index,'shopList')" style="flex: 1;text-align: right;padding-top: 26rpx;"> |
||||
|
<uni-icons type="down" size="18"></uni-icons> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="show-box" v-show="item.isShow"> |
||||
|
<view class="show-text" @tap="goDetail('goods',item)" style="border-right: 1px solid #fff;"> |
||||
|
<uni-icons type="compose" size="18"></uni-icons> |
||||
|
编辑 |
||||
|
</view> |
||||
|
<view class="show-text" @tap="isPush('shopList',index,item,item.isPush==1?0:1)" style="border-right: 1px solid #fff;"> |
||||
|
<uni-icons type="hand-up" size="18"></uni-icons> |
||||
|
{{item.isPush == 0?'设为推荐':'取消推荐'}} |
||||
|
</view> |
||||
|
<view class="show-text" @tap="isMust('shopList',index,item,item.isMust==1?0:1)" style="border-right: 1px solid #fff;"> |
||||
|
<uni-icons type="star" size="18"></uni-icons> |
||||
|
{{item.isMust == 0?'设为必点':'取消必点'}} |
||||
|
</view> |
||||
|
<view class="show-text" @tap="upDown('shopList',index,item,item.delFlag==1?0:1)" style="border-right: 1px solid #fff;"> |
||||
|
<uni-icons type="upload" size="18"></uni-icons> |
||||
|
{{item.delFlag == 1?'下架':'上架'}} |
||||
|
</view> |
||||
|
<view class="show-text" @tap="remove(item)"> |
||||
|
<uni-icons type="trash" size="18"></uni-icons> |
||||
|
删除 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="right-box" v-for="(item,index) in shopList1" :key="index"> |
||||
|
<view style="position: relative;display: flex;"> |
||||
|
<view class="box-left" @tap="largeImg(item)"> |
||||
|
<view v-if="(item.buyCountNew!= null && item.buyCountNew!= undefined)" style="position: absolute;left: 110rpx;color: #fff;background: red;width: 45rpx;height: 40rpx;font-size: 28rpx;text-align: center;line-height: 40rpx;border-radius: 10rpx;"> |
||||
|
{{item.buyCountNew}} |
||||
|
</view> |
||||
|
<img class="img-radius" :src="item.productPicture" alt="" v-if="item.productPicture"> |
||||
|
<view class="noPic" v-else>暂无图片</view> |
||||
|
</view> |
||||
|
<view class="box-right"> |
||||
|
<view class="box-right-name"> |
||||
|
{{item.productName == null ?'':item.productName}} |
||||
|
</view> |
||||
|
<view class="box-right-num"></view> |
||||
|
<view class="box-right-price"> |
||||
|
<view class="price-box"> |
||||
|
<text>{{item.lunchBox}}</text> |
||||
|
<text>餐盒费</text> |
||||
|
</view> |
||||
|
<view class="price-box"> |
||||
|
<text>{{item.startPayNum}}</text> |
||||
|
<text>起售数量</text> |
||||
|
</view> |
||||
|
<view class="price-box" @tap="changeShow(index,'shopList1')" style="flex: 1;text-align: right;padding-top: 26rpx;"> |
||||
|
<uni-icons type="down" size="18"></uni-icons> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="show-box" v-show="item.isShow"> |
||||
|
<view class="show-text" @tap="goDetail('goods',item)" style="border-right: 1px solid #fff;"> |
||||
|
编辑 |
||||
|
</view> |
||||
|
<view class="show-text" @tap="isPush('shopList1',index,item,item.isPush==1?0:1)" style="border-right: 1px solid #fff;"> |
||||
|
<uni-icons type="hand-up" size="18"></uni-icons> |
||||
|
{{item.isPush == 0?'设为推荐':'取消推荐'}} |
||||
|
</view> |
||||
|
<view class="show-text" @tap="isMust('shopList1',index,item,item.isMust==1?0:1)" style="border-right: 1px solid #fff;"> |
||||
|
<uni-icons type="star" size="18"></uni-icons> |
||||
|
{{item.isMust == 0?'设为必点':'取消必点'}} |
||||
|
</view> |
||||
|
<view class="show-text" @tap="upDown('shopList1',index,item,item.delFlag==1?0:1)" style="border-right: 1px solid #fff;"> |
||||
|
<uni-icons type="upload" size="18"></uni-icons> |
||||
|
{{item.delFlag == 1?'下架':'上架'}} |
||||
|
</view> |
||||
|
<view class="show-text" @tap="remove(item)" style="border-right: 1px solid #fff;"> |
||||
|
<uni-icons type="trash" size="18"></uni-icons> |
||||
|
删除 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="bottom-box"> |
||||
|
<view class="bottom-btn" @tap="goDetail('goods')" style="background: rgba(0, 35, 28, 1);color: rgba(166, 255, 234, 1);">新增商品</view> |
||||
|
<view class="bottom-btn" @tap="goDetail('type')">新增分类</view> |
||||
|
</view> |
||||
|
<u-loadmore :status="status" /> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
indexList: [], |
||||
|
shopList: [], |
||||
|
shopList1: [], |
||||
|
pageNum: 1, |
||||
|
searchName: '', |
||||
|
shopId:'', |
||||
|
categoryId: '', |
||||
|
} |
||||
|
}, |
||||
|
filters: { |
||||
|
|
||||
|
}, |
||||
|
onShow() { |
||||
|
this.getGategoryList() |
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
this.shopId = uni.getStorageSync('shopId') |
||||
|
|
||||
|
}, |
||||
|
onReachBottom() { |
||||
|
if (this.pageNum >= this.pages) return; |
||||
|
// this.status = 'loading'; |
||||
|
this.pageNum++; |
||||
|
if(this.gateType == 'search'){ |
||||
|
this.getShareList('search'); |
||||
|
}else{ |
||||
|
this.getShareList(); |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
methods: { |
||||
|
back() { |
||||
|
uni.navigateBack() |
||||
|
}, |
||||
|
//顶部搜索框 |
||||
|
search(e) { |
||||
|
this.pageNum = 1 |
||||
|
this.shopList1 = [] |
||||
|
this.shopList = [] |
||||
|
if (e == '') { |
||||
|
this.searchName = "" |
||||
|
this.getShareList() |
||||
|
} else { |
||||
|
this.searchName = e |
||||
|
this.getShareList('search') |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
changeShow(index,type){ |
||||
|
console.log("1111",index) |
||||
|
console.log("1111",type) |
||||
|
if(type == 'shopList'){ |
||||
|
this.shopList[index].isShow = !this.shopList[index].isShow |
||||
|
console.log(this.shopList[index]) |
||||
|
}else{ |
||||
|
this.shopList1[index].isShow = !this.shopList1[index].isShow |
||||
|
console.log(this.shopList1[index]) |
||||
|
} |
||||
|
this.$forceUpdate() |
||||
|
}, |
||||
|
isPush(type,index,item,value) { |
||||
|
this.NB.sendRequest("/app/product/isPush", { |
||||
|
id: item.id, |
||||
|
isPush:value |
||||
|
}, false, 'POST', 'application/x-www-form-urlencoded').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
if(type == 'shopList'){ |
||||
|
this.shopList[index].isPush = value |
||||
|
}else{ |
||||
|
this.shopList1[index].isPush = value |
||||
|
} |
||||
|
this.tui.toast('设置成功') |
||||
|
} else { |
||||
|
this.tui.toast(res.message) |
||||
|
} |
||||
|
}).catch((res) => {}) |
||||
|
}, |
||||
|
remove(v) { |
||||
|
let that = this; |
||||
|
uni.showModal({ |
||||
|
title: '提示', |
||||
|
content: '确定要删除该商品吗？', |
||||
|
success: function (res) { |
||||
|
if (res.confirm) { |
||||
|
|
||||
|
that.NB.sendRequest("/app/product/delById", { |
||||
|
id: v.id |
||||
|
}, false, 'POST', 'application/x-www-form-urlencoded').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
that.getShareList() |
||||
|
that.tui.toast('删除成功') |
||||
|
} else { |
||||
|
that.tui.toast(res.message) |
||||
|
} |
||||
|
}).catch((res) => {}) |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
isMust(type,index,item,value) { |
||||
|
|
||||
|
this.NB.sendRequest("/app/product/isMust", { |
||||
|
id: item.id, |
||||
|
isMust:value |
||||
|
}, false, 'POST', 'application/x-www-form-urlencoded').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
if(type == 'shopList'){ |
||||
|
this.shopList[index].isMust = value |
||||
|
}else{ |
||||
|
this.shopList1[index].isMust = value |
||||
|
} |
||||
|
this.tui.toast('设置成功') |
||||
|
} else { |
||||
|
this.tui.toast(res.message) |
||||
|
} |
||||
|
}).catch((res) => {}) |
||||
|
}, |
||||
|
upDown(type,index,item,value) { |
||||
|
if(value == 0){ |
||||
|
|
||||
|
|
||||
|
this.NB.sendRequest("/app/product/down", { |
||||
|
id: item.id |
||||
|
}, false, 'POST', 'application/x-www-form-urlencoded').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
if(type == 'shopList'){ |
||||
|
this.shopList[index].delFlag = value |
||||
|
}else{ |
||||
|
this.shopList1[index].delFlag = value |
||||
|
} |
||||
|
this.tui.toast('设置成功') |
||||
|
} else { |
||||
|
this.tui.toast(res.message) |
||||
|
} |
||||
|
}).catch((res) => {}) |
||||
|
}else{ |
||||
|
|
||||
|
|
||||
|
this.NB.sendRequest("/app/product/up", { |
||||
|
id: item.id |
||||
|
}, false, 'POST', 'application/x-www-form-urlencoded').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
if(type == 'shopList'){ |
||||
|
this.shopList[index].delFlag = value |
||||
|
}else{ |
||||
|
this.shopList1[index].delFlag = value |
||||
|
} |
||||
|
this.tui.toast('设置成功') |
||||
|
} else { |
||||
|
this.tui.toast(res.message) |
||||
|
} |
||||
|
}).catch((res) => {}) |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
goDetail(type,item){ |
||||
|
let url="" |
||||
|
if(type == 'goods'){ |
||||
|
url = '/pages/shop/addGoods?dataList='+ JSON.stringify(item) |
||||
|
}else{ |
||||
|
url = '/pages/shop/addType' |
||||
|
} |
||||
|
uni.navigateTo({ |
||||
|
url:url |
||||
|
}) |
||||
|
}, |
||||
|
//点击分类获取商品列表 |
||||
|
getShareList(type) { |
||||
|
let data = {} |
||||
|
if (type == 'search') { |
||||
|
this.gateType = 'search' |
||||
|
data = { |
||||
|
categoryId: "", |
||||
|
searchStr: this.searchName, |
||||
|
pageNum: this.pageNum, |
||||
|
pageSize: '10' |
||||
|
} |
||||
|
} else { |
||||
|
this.gateType = '' |
||||
|
data = { |
||||
|
categoryId: this.categoryId, |
||||
|
searchStr: this.searchName, |
||||
|
pageNum: this.pageNum, |
||||
|
pageSize: '10' |
||||
|
} |
||||
|
} |
||||
|
let that = this |
||||
|
|
||||
|
|
||||
|
this.NB.sendRequest("/app/product/getShareList", data, false, 'POST', 'application/json').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
if (type == 'search') { |
||||
|
this.shopList = [] |
||||
|
this.status = 'nomore'; |
||||
|
if (this.pages == 1) { |
||||
|
this.shopList1 = res.result.records |
||||
|
} else { |
||||
|
this.shopList1 = [...this.shopList1, ...res.result.records] |
||||
|
} |
||||
|
for(let i=0;i<this.shopList1.length;i++){ |
||||
|
this.shopList1[i].isShow = false |
||||
|
} |
||||
|
this.pages = res.result.pages |
||||
|
} else { |
||||
|
this.shopList1 = [] |
||||
|
this.status = 'nomore'; |
||||
|
if (this.pages == 1) { |
||||
|
this.shopList = res.result.records |
||||
|
} else { |
||||
|
this.shopList = [...this.shopList, ...res.result.records] |
||||
|
} |
||||
|
for(let i=0;i<this.shopList.length;i++){ |
||||
|
this.shopList[i].isShow = false |
||||
|
} |
||||
|
this.pages = res.result.pages |
||||
|
} |
||||
|
} else { |
||||
|
this.tui.toast(res.message) |
||||
|
} |
||||
|
}).catch((res) => {}) |
||||
|
}, |
||||
|
//点击左侧菜单切换 |
||||
|
clickLeftBtn(index) { |
||||
|
for (var i = 0; i < this.indexList.length; i++) { |
||||
|
if (i == index) { |
||||
|
this.indexList[i].parentId = true |
||||
|
} else { |
||||
|
this.indexList[i].parentId = false |
||||
|
} |
||||
|
} |
||||
|
this.categoryId = this.indexList[index].id |
||||
|
this.pageNum = 1 |
||||
|
this.searchName = "" |
||||
|
this.shopList1 = [] |
||||
|
this.shopList = [] |
||||
|
this.getShareList() |
||||
|
}, |
||||
|
//初始化获取分类列表 |
||||
|
getGategoryList() { |
||||
|
|
||||
|
|
||||
|
this.NB.sendRequest("/app/productCategory/list", { |
||||
|
shopId:this.shopId |
||||
|
}, false, 'get', 'application/json').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
this.indexList = res.result; |
||||
|
for (var i = 0; i < this.indexList.length; i++) { |
||||
|
if (i == 0) { |
||||
|
this.indexList[i].parentId = true |
||||
|
} else { |
||||
|
this.indexList[i].parentId = false |
||||
|
} |
||||
|
} |
||||
|
this.categoryId = this.indexList[0].id |
||||
|
this.getShareList(); |
||||
|
} else { |
||||
|
this.tui.toast(res.message) |
||||
|
} |
||||
|
}).catch((res) => {}) |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
page { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
background: #F5F8F5; |
||||
|
color: #00231C; |
||||
|
} |
||||
|
|
||||
|
.page1 { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
position: relative; |
||||
|
|
||||
|
} |
||||
|
.title{ |
||||
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat; |
||||
|
width: 100%; |
||||
|
height: 13%; |
||||
|
position: fixed; |
||||
|
top: 0; |
||||
|
} |
||||
|
.title-sreach{ |
||||
|
width: 75%; |
||||
|
display: flex; |
||||
|
height: 200rpx; |
||||
|
} |
||||
|
.back-btn{ |
||||
|
padding-top: 110rpx; |
||||
|
} |
||||
|
.title-search{ |
||||
|
margin-top: 110rpx; |
||||
|
display: flex; |
||||
|
background: #fff; |
||||
|
height: 54rpx; |
||||
|
margin-left: 20rpx; |
||||
|
border-radius: 54rpx; |
||||
|
flex: 1; |
||||
|
input{ |
||||
|
height: 54rpx; |
||||
|
line-height: 54rpx; |
||||
|
} |
||||
|
} |
||||
|
.content-left { |
||||
|
width: 170rpx; |
||||
|
background: #eee; |
||||
|
overflow: scroll; |
||||
|
} |
||||
|
.left-box { |
||||
|
width: 100%; |
||||
|
height: 90rpx; |
||||
|
font-size: 30rpx; |
||||
|
text-align: center; |
||||
|
line-height: 90rpx; |
||||
|
border-bottom: 1px solid #fff; |
||||
|
} |
||||
|
.left-box-hover { |
||||
|
width: 100%; |
||||
|
height: 90rpx; |
||||
|
font-size: 30rpx; |
||||
|
text-align: center; |
||||
|
line-height: 90rpx; |
||||
|
border-bottom: 1px solid #fff; |
||||
|
background-color: #fff; |
||||
|
} |
||||
|
.red { |
||||
|
border-right: 6rpx solid red; |
||||
|
} |
||||
|
.content-right { |
||||
|
flex: 1; |
||||
|
overflow-y: scroll; |
||||
|
height: 100%; |
||||
|
background: #fff; |
||||
|
} |
||||
|
|
||||
|
.right-box { |
||||
|
width: 100%; |
||||
|
height: auto; |
||||
|
border-bottom: 1px solid #eee; |
||||
|
} |
||||
|
.box-left { |
||||
|
width: 130rpx; |
||||
|
height: 131rpx; |
||||
|
background-size: 100%; |
||||
|
margin: 25rpx 30rpx 35rpx 10rpx; |
||||
|
border-radius: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.box-left img { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.box-right { |
||||
|
margin-top: 17rpx; |
||||
|
flex: 1; |
||||
|
} |
||||
|
|
||||
|
.box-right-name { |
||||
|
font-size: 30rpx; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
|
||||
|
.box-right-num { |
||||
|
padding: 5rpx 0; |
||||
|
color: #777; |
||||
|
text-align: right; |
||||
|
padding-right: 20rpx; |
||||
|
height: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.box-right-price { |
||||
|
display: flex; |
||||
|
font-size: 25rpx; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.price-box { |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
margin-right: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.price-box text:first-child { |
||||
|
color: #ffa200 |
||||
|
} |
||||
|
.bottom-box { |
||||
|
width: 100%; |
||||
|
height: 140rpx; |
||||
|
display: flex; |
||||
|
background: #fff; |
||||
|
z-index: 98; |
||||
|
position: fixed; |
||||
|
bottom: 0; |
||||
|
display: flex; |
||||
|
padding-top: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.bottom-btn { |
||||
|
width: 50%; |
||||
|
height: 90rpx; |
||||
|
line-height: 90rpx; |
||||
|
border-radius: 90rpx; |
||||
|
font-size: 28rpx; |
||||
|
font-weight: 700; |
||||
|
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1)); |
||||
|
text-align: center; |
||||
|
margin: 0 20rpx; |
||||
|
} |
||||
|
.show-box{ |
||||
|
display: flex; |
||||
|
height: 100rpx; |
||||
|
background: #eee; |
||||
|
} |
||||
|
.show-text{ |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
text-align: center; |
||||
|
flex: 1; |
||||
|
padding-top: 14rpx; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,271 @@ |
|||||
|
<template> |
||||
|
<!-- 商家订单详情 --> |
||||
|
<view class="page1"> |
||||
|
<view class="title"> |
||||
|
<view class="title-sreach"> |
||||
|
<view class="back-btn" @tap="back"> |
||||
|
<uni-icons type="left" size="28"></uni-icons> |
||||
|
</view> |
||||
|
<view class="title-name"> |
||||
|
订单详情 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="content"> |
||||
|
<view class="box1" style="display: flex;font-size: 14px;font-weight: 700;"> |
||||
|
<text>{{'#'+data.numberCode}}</text> |
||||
|
<text style="margin: 0 10px;">期望送达</text> |
||||
|
<text>明天 06:30</text> |
||||
|
<text style="flex: 1;text-align: right;color: red;"> |
||||
|
{{data.status == 0?'待支付':data.status == 1?' 待成团':data.status == 2?'待消费':data.status == 3?'待接单':data.status == 4?'待取货':data.status == 5?'待送达':data.status == 6?'已完成':data.status == 7?'待退款':data.status == 8?'已退款':data.status == 9?'已取消':data.status == 11?'售后中':data.status == 12?'已售后':""}} |
||||
|
</text> |
||||
|
</view> |
||||
|
<view class="box1" style="display: flex;height: 50px;line-height: 50px;padding: 0 10px;"> |
||||
|
<view style="border: 1px solid #48D1CC;height: 25px;line-height: 25px;padding: 0 10px;border-radius: 10px;margin-top: auto;margin-bottom: auto;color: #48D1CC;font-weight: 700;"> |
||||
|
{{data.deliveryType == 2?'自取订单':'配送订单'}} |
||||
|
</view> |
||||
|
<view v-if="data.deliveryType == 1" style="display: flex;flex: 1;padding-left: 10px;"> |
||||
|
<text style="flex: 1;">配送员：{{data.deliveryInfo.workerName}}</text> |
||||
|
<view class=""> |
||||
|
<img @tap="makeCall(data.deliveryInfo.workerPhone)" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/869a7af6a1c24bf3a0d523c4a18b55c6.png" alt="" style="width: 30px;height: 30px;margin-top: 10px;" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box1" v-if="data.deliveryType == 1" style="display: flex;"> |
||||
|
<view style="flex: 1;"> |
||||
|
<view style="font-weight: 700;height: 25px;"> |
||||
|
收货人：{{data.deliveryInfo.receiverName}} |
||||
|
</view> |
||||
|
<view style="color: #777;height: 35px;"> |
||||
|
{{data.deliveryInfo.receiverAddress}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
<img @tap="makeCall(data.deliveryInfo.receiverPhone)" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/869a7af6a1c24bf3a0d523c4a18b55c6.png" alt="" style="width: 30px;height: 30px;margin-top: 14px;" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box1"> |
||||
|
<view style="border-bottom: 1px solid #eee;padding-bottom: 10px;"> |
||||
|
<view style="font-size: 16px;height: 30px;"> |
||||
|
商品 <text style="font-size: 14px;color: #777;">共{{data.goodsNum}}件</text> |
||||
|
</view> |
||||
|
<view v-for="(item,index) in data.goodsList" :key="index" style="display: flex;height: 20px;line-height: 20px;"> |
||||
|
<view style="flex: 1;"> |
||||
|
{{item.productName}} |
||||
|
</view> |
||||
|
<view style="width: 30px;"> |
||||
|
{{'x'+ item.quantity}} |
||||
|
</view> |
||||
|
<view style="width: 50px;text-align: right;"> |
||||
|
{{'￥'+ item.price}} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
<view style="display: flex;height: 30px;line-height: 30px;"> |
||||
|
<view style="flex: 1;"> |
||||
|
商品金额 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
{{'￥' + data.goodsAmount}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="display: flex;height: 30px;line-height: 30px;"> |
||||
|
<view style="flex: 1;"> |
||||
|
配送费 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
{{'￥' + data.deliveryFee}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="display: flex;height: 30px;line-height: 30px;"> |
||||
|
<view style="flex: 1;"> |
||||
|
客户实际支付 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
{{'￥'+ data.totalAmount}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="display: flex;height: 30px;line-height: 30px;"> |
||||
|
<view style="flex: 1;"> |
||||
|
平台服务费 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
￥12.00假的 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box1"> |
||||
|
<view class=""> |
||||
|
<view style="display: flex;height: 30px;line-height: 30px;"> |
||||
|
<view style="width: 70px;"> |
||||
|
订单编号 |
||||
|
</view> |
||||
|
<view style="flex: 1;text-align: right;"> |
||||
|
{{data.id}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="display: flex;height: 30px;line-height: 30px;"> |
||||
|
<view style="width: 70px;"> |
||||
|
下单时间 |
||||
|
</view> |
||||
|
<view style="flex: 1;text-align: right;"> |
||||
|
{{data.createTime | formatISOTime}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="display: flex;height: 30px;line-height: 30px;"> |
||||
|
<view style="width: 70px;"> |
||||
|
用户账号 |
||||
|
</view> |
||||
|
<view style="flex: 1;text-align: right;"> |
||||
|
13521030111假的 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box1 bottom"> |
||||
|
<view style="height: 30px;line-height: 30px;display: flex;border-bottom: 1px solid #eee;font-size: 14px;"> |
||||
|
<view style="flex: 1;"> |
||||
|
预计收入 |
||||
|
</view> |
||||
|
<view style="color: red;font-weight: 700;"> |
||||
|
￥10.32假的 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="margin-top: 10px;"> |
||||
|
<view class="btn"> |
||||
|
打印小票 |
||||
|
</view> |
||||
|
<view class="btn" style="background: rgba(0, 35, 28, 1);color: rgba(166, 255, 234, 1);"> |
||||
|
取消订单 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
data:{} |
||||
|
} |
||||
|
}, |
||||
|
filters:{ |
||||
|
formatISOTime(isoString) { |
||||
|
const date = new Date(isoString); |
||||
|
const year = date.getFullYear(); |
||||
|
const month = (date.getMonth() + 1).toString().padStart(2, '0'); |
||||
|
const day = date.getDate().toString().padStart(2, '0'); |
||||
|
const hours = date.getHours().toString().padStart(2, '0'); |
||||
|
const minutes = date.getMinutes().toString().padStart(2, '0'); |
||||
|
const seconds = date.getSeconds().toString().padStart(2, '0'); |
||||
|
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; |
||||
|
} |
||||
|
}, |
||||
|
onShow() { |
||||
|
|
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
this.shopId = option.id |
||||
|
this.getDetail() |
||||
|
}, |
||||
|
methods: { |
||||
|
getDetail(){ |
||||
|
let that = this |
||||
|
this.NB.sendRequest("/mall/order/detail/"+ this.shopId, {}, false, 'get', 'application/json').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
that.data = res.result |
||||
|
|
||||
|
that.data.goodsNum = 0 |
||||
|
for(let m=0;m<that.data.goodsList.length;m++){ |
||||
|
that.data.goodsNum += that.data.goodsList[m].quantity |
||||
|
} |
||||
|
that.$forceUpdate() |
||||
|
} else { |
||||
|
that.tui.toast(res.message); |
||||
|
return; |
||||
|
} |
||||
|
uni.hideLoading(); |
||||
|
}).catch((res) => {}); |
||||
|
}, |
||||
|
makeCall(phone){ |
||||
|
uni.makePhoneCall({ |
||||
|
phoneNumber: phone |
||||
|
}); |
||||
|
}, |
||||
|
back() { |
||||
|
uni.navigateBack() |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
page { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
background: #F5F8F5; |
||||
|
color: #00231C; |
||||
|
} |
||||
|
|
||||
|
.page1 { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat; |
||||
|
width: 100%; |
||||
|
height: 20%; |
||||
|
} |
||||
|
|
||||
|
.title-sreach { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
height: 200rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.back-btn { |
||||
|
padding-top: 110rpx; |
||||
|
} |
||||
|
|
||||
|
.title-name { |
||||
|
padding-top: 110rpx; |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 700; |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.content{ |
||||
|
margin: -140rpx auto; |
||||
|
} |
||||
|
.box1 { |
||||
|
width: 95%; |
||||
|
margin: 20rpx auto; |
||||
|
background: #fff; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 20rpx; |
||||
|
} |
||||
|
.bottom{ |
||||
|
position: fixed; |
||||
|
bottom: 0; |
||||
|
} |
||||
|
.btn{ |
||||
|
height: 25px; |
||||
|
width: 65px; |
||||
|
line-height: 25px; |
||||
|
background: linear-gradient(90deg, #e3ff96, #a6ffea); |
||||
|
text-align: center; |
||||
|
border-radius: 7px; |
||||
|
font-weight: 700; |
||||
|
float: right; |
||||
|
margin-left: 10px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,189 @@ |
|||||
|
<template> |
||||
|
<!-- 商家账单列表 --> |
||||
|
<view class="page1"> |
||||
|
<view class="title"> |
||||
|
<view class="title-sreach"> |
||||
|
<view class="back-btn" @tap="back"> |
||||
|
<uni-icons type="left" size="28"></uni-icons> |
||||
|
</view> |
||||
|
<view class="title-name"> |
||||
|
账单结算 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="margin: -120rpx auto 0;"> |
||||
|
<view class=""> |
||||
|
<view class="content11"> |
||||
|
2026 |
||||
|
</view> |
||||
|
<view class="box1" @tap="goDetail"> |
||||
|
<view class="content22"> |
||||
|
<view class=""> |
||||
|
10/25-10/25账单 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
共<text>0</text>单 |
||||
|
<uni-icons type="right" size="12"></uni-icons> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="border-bottom: 1px solid #eee;"> |
||||
|
<view class="content33"> |
||||
|
<view class="content44"> |
||||
|
商品金额 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
￥0.00 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="content33"> |
||||
|
<view class="content44"> |
||||
|
餐盒费 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
￥0.00 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="content33"> |
||||
|
<view class="content44"> |
||||
|
活动成本 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
￥0.00 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="content33"> |
||||
|
<view class="content44"> |
||||
|
平台服务费 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
￥0.00 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
<view class="content33"> |
||||
|
<view class="content44"> |
||||
|
结算金额 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
￥0.00 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="content33"> |
||||
|
<view class="content44"> |
||||
|
本期期初 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
￥0.00 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="content33"> |
||||
|
<view class="content44"> |
||||
|
实际打款金额 |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
￥0.00 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
} |
||||
|
}, |
||||
|
onShow() { |
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
|
||||
|
}, |
||||
|
methods: { |
||||
|
goDetail(){ |
||||
|
uni.navigateTo({ |
||||
|
url:'/pages/shop/shopSettlementDetail' |
||||
|
}) |
||||
|
}, |
||||
|
back() { |
||||
|
uni.navigateBack() |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
page { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
background: #F5F8F5; |
||||
|
color: #00231C; |
||||
|
} |
||||
|
|
||||
|
.page1 { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat; |
||||
|
width: 100%; |
||||
|
height: 20%; |
||||
|
} |
||||
|
|
||||
|
.title-sreach { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
height: 200rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.back-btn { |
||||
|
padding-top: 110rpx; |
||||
|
} |
||||
|
|
||||
|
.title-name { |
||||
|
padding-top: 110rpx; |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 700; |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.box1 { |
||||
|
width: 95%; |
||||
|
margin: 0 auto 20rpx; |
||||
|
background: #fff; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 20rpx; |
||||
|
} |
||||
|
.content11{ |
||||
|
height: 70rpx; |
||||
|
line-height: 70rpx; |
||||
|
padding-left: 40rpx; |
||||
|
font-size: 28rpx; |
||||
|
font-weight: 700; |
||||
|
} |
||||
|
.content22{ |
||||
|
display: flex; |
||||
|
height: 60rpx; |
||||
|
line-height: 44rpx; |
||||
|
border-bottom: 1px solid #eee; |
||||
|
font-size: 26rpx; |
||||
|
font-weight: 600; |
||||
|
} |
||||
|
.content33{ |
||||
|
height: 50rpx; |
||||
|
line-height: 50rpx; |
||||
|
display: flex; |
||||
|
} |
||||
|
.content44{ |
||||
|
flex: 1; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,434 @@ |
|||||
|
<template> |
||||
|
<view class="page1"> |
||||
|
<view class="title"> |
||||
|
<view class="title-sreach"> |
||||
|
<view class="back-btn" @tap="back"> |
||||
|
<uni-icons type="left" size="28"></uni-icons> |
||||
|
</view> |
||||
|
<view class="title-name"> |
||||
|
商家评价 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="content"> |
||||
|
<view class="shop-rate"> |
||||
|
<view class="rate-left"> |
||||
|
<view class="rate-num"> |
||||
|
{{shopItem.shopScore}} |
||||
|
</view> |
||||
|
<view class="rate-star"> |
||||
|
<uni-rate :disabled="true" size="20" disabledColor="rgba(255, 184, 84, 1)" :value="shopItem.shopScore" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
<view class="menu-list"> |
||||
|
<view class="menu1" @tap="checkTab(index)" v-for="(item,index) in menuList" :key="index" |
||||
|
:style="{'font-size':item.checked?'40rpx':'30rpx','color':item.checked?'rgba(0, 35, 28, 1)':'#777','width':index == 0?'160rpx':'180rpx'}"> |
||||
|
<view :style="{'width':index == 0?'160rpx':'180rpx'}" style="text-align: left;"> |
||||
|
{{item.name}} {{item.num}} |
||||
|
</view> |
||||
|
<img v-if="item.checked" class="checked-img" |
||||
|
src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/4bb5fc7725cb4a7a84d1d3a15f05b39c.png" |
||||
|
alt="" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="evaluate-list" v-for="(item,index) in shopComments" :key="index"> |
||||
|
<view class="eval-title"> |
||||
|
<view class="eval-icon"> |
||||
|
<img :src="item.createByIcon" |
||||
|
alt="" /> |
||||
|
</view> |
||||
|
<view class="eval-name"> |
||||
|
<view class="name1"> |
||||
|
{{item.createByName}} |
||||
|
</view> |
||||
|
<view class="eval-time"> |
||||
|
{{item.createTime}} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="eval-content"> |
||||
|
<view style="display: flex;height: 50rpx;line-height: 50rpx;font-size: 24rpx;"> |
||||
|
商品 |
||||
|
<view style="padding: 12rpx 0 0 10rpx;"> |
||||
|
<uni-rate v-model="item.score" size="12" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="eval-text"> |
||||
|
{{item.remark}} |
||||
|
</view> |
||||
|
<view class="eval-img"> |
||||
|
<img @tap="largeImg" :src="item.picture" alt=""> |
||||
|
</view> |
||||
|
<view class="reply-card" :class="{'expanded': isExpanded}" v-for="(item1,index1) in item.comments" :key="index1"> |
||||
|
<!-- 标题行：商家回复 + 展开/收起按钮 --> |
||||
|
<view class="reply-header"> |
||||
|
<!-- 回复内容区域（动态类控制展开/折叠） --> |
||||
|
<view class="reply-content" :class="{ collapsed: !isExpanded, expanded: isExpanded }"> |
||||
|
<text>{{item1.createByName}} : {{ item1.remark }}</text> |
||||
|
</view> |
||||
|
<view class="reply-expand-btn" @click="toggleReply"> |
||||
|
<text v-if="!isExpanded">展开</text> |
||||
|
<text v-else>收起</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 查看大图弹出层 --> |
||||
|
<uni-popup ref="imgPopup" background-color="#fff"> |
||||
|
<view class="img-popup-content"> |
||||
|
<img :src="bigImg" alt="" style="width: 100%;height: 100%;"> |
||||
|
</view> |
||||
|
</uni-popup> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
isExpanded: false, |
||||
|
bigImg: '', |
||||
|
shopItem:{}, |
||||
|
pageNum:1, |
||||
|
searchAll:true, |
||||
|
total:0, |
||||
|
shopComments:[], |
||||
|
searchForm:{ |
||||
|
shopId:'', |
||||
|
pageNum: 1, |
||||
|
score:0, |
||||
|
picture:0, |
||||
|
pageSize: '10' |
||||
|
}, |
||||
|
menuList: [{ |
||||
|
name: '全部', |
||||
|
num: "", |
||||
|
checked: true |
||||
|
}, { |
||||
|
name: '有图/视频', |
||||
|
num: '', |
||||
|
checked: false |
||||
|
}, { |
||||
|
name: '中差评', |
||||
|
num: '', |
||||
|
checked: false |
||||
|
}] |
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
|
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
this.shopItem = JSON.parse(uni.getStorageSync('area')).shop |
||||
|
console.log('shop',this.shopItem) |
||||
|
this.getshopComments(this.shopItem.shopId) |
||||
|
}, |
||||
|
onShow() { |
||||
|
|
||||
|
}, |
||||
|
methods: { |
||||
|
getshopComments(id){ |
||||
|
let that = this |
||||
|
this.searchForm.shopId = id |
||||
|
this.NB.sendRequest("/app/comment/getCommentList", this.searchForm, false, 'POST', 'application/json').then((res) => { |
||||
|
if (res.code == 200) { |
||||
|
if (that.pageNum == 1) { |
||||
|
that.shopComments = res.result.records |
||||
|
} else { |
||||
|
that.shopComments = [...that.shopComments, ...res.result.records] |
||||
|
} |
||||
|
that.$forceUpdate() |
||||
|
if(this.searchAll){ |
||||
|
that.menuList[0].num = res.result.total |
||||
|
} |
||||
|
} else { |
||||
|
that.tui.toast(res.message) |
||||
|
return |
||||
|
} |
||||
|
uni.hideLoading() |
||||
|
}).catch((res) => {}) |
||||
|
}, |
||||
|
toggleReply() { |
||||
|
this.isExpanded = !this.isExpanded; |
||||
|
}, |
||||
|
checkTab(index) { |
||||
|
for (let i = 0; i < this.menuList.length; i++) { |
||||
|
if (i == index) { |
||||
|
this.menuList[i].checked = true |
||||
|
} else { |
||||
|
this.menuList[i].checked = false |
||||
|
} |
||||
|
} |
||||
|
if(index == 0){ |
||||
|
this.searchForm.picture = 0 |
||||
|
this.searchForm.score = 0 |
||||
|
}else if(index ==1){ |
||||
|
this.searchAll = false |
||||
|
this.searchForm.picture = 1 |
||||
|
this.searchForm.score = 0 |
||||
|
}else{ |
||||
|
this.searchAll = false |
||||
|
this.searchForm.picture = 0 |
||||
|
this.searchForm.score = 1 |
||||
|
} |
||||
|
this.getshopComments(this.shopItem.id) |
||||
|
}, |
||||
|
//查看大图 |
||||
|
largeImg(img) { |
||||
|
this.bigImg = 'https://jewel-shop.oss-cn-beijing.aliyuncs.com/00b1f011787c4549bbea650d95a4eb39.png' |
||||
|
this.$refs.imgPopup.open() |
||||
|
}, |
||||
|
back() { |
||||
|
uni.navigateBack() |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
page { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
background: #F5F8F5; |
||||
|
color: #00231C; |
||||
|
} |
||||
|
|
||||
|
.page1 { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat; |
||||
|
width: 100%; |
||||
|
height: 54%; |
||||
|
} |
||||
|
|
||||
|
.title-sreach { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
height: 200rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.back-btn { |
||||
|
padding-top: 110rpx; |
||||
|
} |
||||
|
|
||||
|
.title-name { |
||||
|
padding-top: 110rpx; |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 700; |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.content { |
||||
|
position: absolute; |
||||
|
top: 200rpx; |
||||
|
width: 95%; |
||||
|
margin-left: 2.5%; |
||||
|
} |
||||
|
|
||||
|
.shop-rate { |
||||
|
display: flex; |
||||
|
padding-bottom: 30rpx; |
||||
|
} |
||||
|
|
||||
|
.rate-left { |
||||
|
display: flex; |
||||
|
flex: 1; |
||||
|
} |
||||
|
|
||||
|
.rate-num { |
||||
|
font-size: 86rpx; |
||||
|
font-weight: 700; |
||||
|
background: linear-gradient(90deg, rgba(255, 77, 0, 1), rgba(255, 184, 84, 1)); |
||||
|
background-clip: text; |
||||
|
color: transparent; |
||||
|
} |
||||
|
|
||||
|
.rate-right { |
||||
|
display: flex; |
||||
|
width: 160rpx; |
||||
|
height: 100rpx; |
||||
|
line-height: 40rpx; |
||||
|
font-size: 36rpx; |
||||
|
text-align: center; |
||||
|
font-weight: 700; |
||||
|
border-left: 1px solid #eee; |
||||
|
} |
||||
|
|
||||
|
.rate-star { |
||||
|
height: 100rpx; |
||||
|
padding: 32rpx 20rpx; |
||||
|
} |
||||
|
|
||||
|
.right1 { |
||||
|
margin: 20rpx 0 0 5%; |
||||
|
width: 45%; |
||||
|
} |
||||
|
|
||||
|
.menu-list { |
||||
|
height: 100rpx; |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
overflow-y: hidden; |
||||
|
padding-top: 30rpx; |
||||
|
border-top: 1px solid #eee; |
||||
|
} |
||||
|
|
||||
|
.checked-img { |
||||
|
width: 100%; |
||||
|
height: 20rpx; |
||||
|
position: absolute; |
||||
|
bottom: 0; |
||||
|
left: 0; |
||||
|
} |
||||
|
|
||||
|
.menu1 { |
||||
|
width: 180rpx; |
||||
|
height: 70rpx; |
||||
|
position: relative; |
||||
|
margin-right: 20rpx; |
||||
|
line-height: 70rpx; |
||||
|
flex: 1; |
||||
|
} |
||||
|
|
||||
|
.evaluate-list { |
||||
|
margin-top: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.eval-title { |
||||
|
width: 100%; |
||||
|
height: 80rpx; |
||||
|
display: flex; |
||||
|
} |
||||
|
|
||||
|
.eval-icon { |
||||
|
height: 80rpx; |
||||
|
width: 80rpx; |
||||
|
|
||||
|
img { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
background-size: 100%; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.eval-name { |
||||
|
margin-left: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.name1 { |
||||
|
font-size: 28rpx; |
||||
|
line-height: 50rpx; |
||||
|
font-weight: 700; |
||||
|
} |
||||
|
|
||||
|
.eval-rate { |
||||
|
display: flex; |
||||
|
margin: 20rpx 0 0 100rpx; |
||||
|
height: 48rpx; |
||||
|
line-height: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.eval-content { |
||||
|
margin-left: 100rpx; |
||||
|
font-size: 28rpx; |
||||
|
color: #777; |
||||
|
line-height: 48rpx; |
||||
|
} |
||||
|
|
||||
|
.eval-img { |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
overflow-x: scroll; |
||||
|
margin-top: 20rpx; |
||||
|
|
||||
|
img { |
||||
|
width: 100rpx; |
||||
|
height: 100rpx; |
||||
|
background-size: 100%; |
||||
|
margin-right: 20rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
/* 卡片整体样式（可根据需要调整外间距） */ |
||||
|
.reply-card { |
||||
|
border-radius: 12rpx; |
||||
|
background-color: #eee; |
||||
|
width: 100%; |
||||
|
box-sizing: border-box; |
||||
|
margin-top:20rpx; |
||||
|
} |
||||
|
|
||||
|
/* 标题行：左标签 + 右按钮 */ |
||||
|
.reply-header { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
margin-bottom: 16rpx; |
||||
|
} |
||||
|
|
||||
|
.reply-label { |
||||
|
font-size: 28rpx; |
||||
|
font-weight: 500; |
||||
|
color: #333; |
||||
|
} |
||||
|
|
||||
|
.reply-expand-btn { |
||||
|
font-size: 24rpx; |
||||
|
padding: 4rpx 12rpx; |
||||
|
} |
||||
|
|
||||
|
/* 回复内容基础样式 */ |
||||
|
.reply-content { |
||||
|
font-size: 26rpx; |
||||
|
color: #555; |
||||
|
padding: 12rpx; |
||||
|
transition: all 0.2s; |
||||
|
height: 70rpx; |
||||
|
flex: 1; |
||||
|
} |
||||
|
|
||||
|
/* 折叠状态：单行省略 */ |
||||
|
.reply-content.collapsed { |
||||
|
display: -webkit-box; |
||||
|
-webkit-line-clamp: 1; |
||||
|
-webkit-box-orient: vertical; |
||||
|
overflow: hidden; |
||||
|
text-overflow: ellipsis; |
||||
|
} |
||||
|
|
||||
|
/* 展开状态：固定高度100px，可滚动 */ |
||||
|
.reply-content.expanded { |
||||
|
display: block; |
||||
|
height: 200rpx; |
||||
|
/* 固定高度100px */ |
||||
|
overflow-y: auto; |
||||
|
/* 内容超长时滚动 */ |
||||
|
/* 重置折叠相关属性 */ |
||||
|
-webkit-line-clamp: unset; |
||||
|
-webkit-box-orient: unset; |
||||
|
text-overflow: clip; |
||||
|
} |
||||
|
|
||||
|
/* 滚动条美化（可选） */ |
||||
|
.reply-content.expanded::-webkit-scrollbar { |
||||
|
width: 12rpx; |
||||
|
} |
||||
|
|
||||
|
.reply-content.expanded::-webkit-scrollbar-thumb { |
||||
|
background-color: #ccc; |
||||
|
border-radius: 20rpx; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,330 @@ |
|||||
|
<template> |
||||
|
<!-- 商家订单列表 --> |
||||
|
<view class="page1"> |
||||
|
<view class="title"> |
||||
|
<view class="title-sreach"> |
||||
|
<view class="back-btn" @tap="back" :style="{'top': menuButtonInfo.top +'px'}"> |
||||
|
<uni-icons type="left" size="28"></uni-icons> |
||||
|
</view> |
||||
|
<view class="title-name" :style="{'padding-top': menuButtonInfo.top +'px'}"> |
||||
|
商家订单 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="title-tab"> |
||||
|
<scroll-view class="status-scroll-view" scroll-x enable-flex :show-scrollbar="false" |
||||
|
:scroll-with-animation="true"> |
||||
|
<view class="status-list"> |
||||
|
<view v-for="(item, index) in statusList" :key="index" class="status-item" |
||||
|
:class="{ 'active': currentIndex == item.value }" @click="handleStatusClick(item.value,item.value)"> |
||||
|
<text class="status-text">{{ item.name }}</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</scroll-view> |
||||
|
</view> |
||||
|
<view class="box1" @tap="goDetail(item.id)" v-for="(item,index) in orderList" :key="index"> |
||||
|
<view style="display: flex;height: 50rpx;border-bottom: 1px solid #eee;"> |
||||
|
<view> |
||||
|
{{'#' + item.numberCode}} |
||||
|
</view> |
||||
|
<view style="flex: 1;display: flex;padding-left: 20rpx;"> |
||||
|
{{item.createTime | formatISOTime}} |
||||
|
<!-- <text>已退款</text> --> |
||||
|
</view> |
||||
|
<view> |
||||
|
{{item.status == 0?'待支付':item.status == 1?' 待成团':item.status == 2?'待消费':item.status == 3?'待接单':item.status == 4?'待取货':item.status == 5?'待送达':item.status == 6?'已完成':item.status == 7?'待退款':item.status == 8?'已退款':item.status == 9?'已取消':item.status == 11?'售后中':item.status == 12?'已售后':""}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="height: 120rpx;padding-top: 20rpx;"> |
||||
|
<view style="height: 50rpx;line-height: 50rpx;font-size: 28rpx;font-weight: 700;display: flex;"> |
||||
|
商品 <text>共<text>{{item.goodsNum}}</text>件</text> <text style="color: red;flex: 1;text-align: right;">已出餐</text> |
||||
|
</view> |
||||
|
<view style="display: flex;" v-for="(item1,index1) in item.goodsList" :key="index"> |
||||
|
<view style="flex: 1;"> |
||||
|
{{item1.productName}} |
||||
|
</view> |
||||
|
<view style="width: 100rpx;"> |
||||
|
{{'X' + item1.quantity}} |
||||
|
</view> |
||||
|
<view> |
||||
|
{{'￥'+ item1.price}} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
loadStatus: 'more', |
||||
|
searchForm:{ |
||||
|
pageNum:1, |
||||
|
pageSize:10, |
||||
|
shopName:'', |
||||
|
searchStatus:10, |
||||
|
shopId:uni.getStorageSync('shopId'), |
||||
|
regionId:JSON.parse(uni.getStorageSync('shop')).shop.shopArea |
||||
|
}, |
||||
|
totalPages: 1, |
||||
|
orderList:[], |
||||
|
currentIndex: 10, |
||||
|
menuButtonInfo: {}, |
||||
|
statusList: [{ |
||||
|
name: '全部', |
||||
|
value: 10, |
||||
|
checked: true |
||||
|
},{ |
||||
|
name: '待支付', |
||||
|
value: 0, |
||||
|
checked: true |
||||
|
}, |
||||
|
{ |
||||
|
name: '待成团', |
||||
|
value: 1, |
||||
|
checked: false |
||||
|
}, |
||||
|
{ |
||||
|
name: '待消费', |
||||
|
value: 2, |
||||
|
checked: false |
||||
|
}, |
||||
|
{ |
||||
|
name: '待接单', |
||||
|
value: 3, |
||||
|
checked: false |
||||
|
}, |
||||
|
{ |
||||
|
name: '待取货', |
||||
|
value: 4, |
||||
|
checked: false |
||||
|
}, |
||||
|
{ |
||||
|
name: '待送达', |
||||
|
value: 5, |
||||
|
checked: false |
||||
|
}, |
||||
|
{ |
||||
|
name: '已完成', |
||||
|
value: 6, |
||||
|
checked: false |
||||
|
}, |
||||
|
{ |
||||
|
name: '待退款', |
||||
|
value: 7, |
||||
|
checked: false |
||||
|
}, |
||||
|
{ |
||||
|
name: '已退款', |
||||
|
value: 8, |
||||
|
checked: false |
||||
|
}, |
||||
|
{ |
||||
|
name: '已取消', |
||||
|
value: 9, |
||||
|
checked: false |
||||
|
}, |
||||
|
{ |
||||
|
name: '售后中', |
||||
|
value: 11, |
||||
|
checked: false |
||||
|
}, |
||||
|
{ |
||||
|
name: '已售后', |
||||
|
value: 12, |
||||
|
checked: false |
||||
|
} |
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
onReachBottom() { |
||||
|
if (this.searchForm.pageNum >= this.totalPages) return; |
||||
|
// this.status = 'loading'; |
||||
|
this.searchForm.pageNum++; |
||||
|
this.getOrderList(); |
||||
|
}, |
||||
|
filters:{ |
||||
|
formatISOTime(isoString) { |
||||
|
const date = new Date(isoString); |
||||
|
const year = date.getFullYear(); |
||||
|
const month = (date.getMonth() + 1).toString().padStart(2, '0'); |
||||
|
const day = date.getDate().toString().padStart(2, '0'); |
||||
|
const hours = date.getHours().toString().padStart(2, '0'); |
||||
|
const minutes = date.getMinutes().toString().padStart(2, '0'); |
||||
|
const seconds = date.getSeconds().toString().padStart(2, '0'); |
||||
|
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; |
||||
|
} |
||||
|
}, |
||||
|
onShow() { |
||||
|
this.menuButtonInfo = uni.getMenuButtonBoundingClientRect() |
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
if(option.index){ |
||||
|
this.searchForm.searchStatus = option.index |
||||
|
this.currentIndex = option.index |
||||
|
} |
||||
|
this.getList() |
||||
|
}, |
||||
|
methods: { |
||||
|
getList(){ |
||||
|
this.loadStatus = 'loading' |
||||
|
let that = this |
||||
|
that.tui.request("/mall/order/page", "POST", this.searchForm, false, false).then((res) => { |
||||
|
that.loadStatus = 'nomore'; |
||||
|
if (res.code == 200) { |
||||
|
if (that.searchForm.pageNum == 1) { |
||||
|
that.orderList = res.result.records; |
||||
|
} else { |
||||
|
that.orderList = [...that.orderList, ...res.result.records] |
||||
|
} |
||||
|
for(let i=0;i<that.orderList.length;i++){ |
||||
|
that.orderList[i].goodsNum = 0 |
||||
|
for(let m=0;m<that.orderList[i].goodsList.length;m++){ |
||||
|
that.orderList[i].goodsNum += that.orderList[i].goodsList[m].quantity |
||||
|
} |
||||
|
} |
||||
|
that.totalPages = res.result.pages; // pages = 总页数 |
||||
|
that.$forceUpdate(); |
||||
|
} else { |
||||
|
that.tui.toast(res.message); |
||||
|
return; |
||||
|
} |
||||
|
uni.hideLoading(); |
||||
|
}).catch((res) => {}); |
||||
|
}, |
||||
|
goDetail(id){ |
||||
|
uni.navigateTo({ |
||||
|
url:'/package2/shop/orderDetail?id=' + id |
||||
|
}) |
||||
|
}, |
||||
|
handleStatusClick(index,value) { |
||||
|
if (this.currentIndex === index) return; |
||||
|
this.currentIndex = index; |
||||
|
this.searchForm.searchStatus = value |
||||
|
this.getList() |
||||
|
}, |
||||
|
back() { |
||||
|
uni.navigateBack() |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
page { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
background: #F5F8F5; |
||||
|
color: #00231C; |
||||
|
} |
||||
|
|
||||
|
.page1 { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat; |
||||
|
width: 100%; |
||||
|
height: 20%; |
||||
|
} |
||||
|
|
||||
|
.title-sreach { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
height: 200rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.back-btn { |
||||
|
position: absolute; |
||||
|
bottom: 0; |
||||
|
left: 0; |
||||
|
} |
||||
|
|
||||
|
.title-name { |
||||
|
padding-top: 110rpx; |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 700; |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.title-tab { |
||||
|
display: flex; |
||||
|
margin: -120rpx auto 0; |
||||
|
} |
||||
|
|
||||
|
.status-scroll-view { |
||||
|
width: 100%; |
||||
|
white-space: nowrap; |
||||
|
/* 辅助滚动，与 flex 配合确保不换行 */ |
||||
|
height: auto; |
||||
|
} |
||||
|
|
||||
|
.status-list { |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
flex-wrap: nowrap; |
||||
|
align-items: center; |
||||
|
padding: 0 0; |
||||
|
/* 可根据设计添加左右留白，但会影响“一排5个”精准计算，故留白为0 */ |
||||
|
min-height: 88rpx; |
||||
|
/* 保证内部项撑开高度 */ |
||||
|
} |
||||
|
|
||||
|
/* 每个状态项：宽度为屏幕宽度的1/5，保证一行正好显示5个，超出滚动 */ |
||||
|
.status-item { |
||||
|
flex-shrink: 0; |
||||
|
width: 20vw; |
||||
|
/* 关键：屏幕宽度的1/5，正好一排5个 */ |
||||
|
text-align: center; |
||||
|
padding: 20rpx 0; |
||||
|
position: relative; |
||||
|
box-sizing: border-box; |
||||
|
transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94); |
||||
|
/* 点击反馈 */ |
||||
|
-webkit-tap-highlight-color: transparent; |
||||
|
} |
||||
|
|
||||
|
.status-text { |
||||
|
font-size: 28rpx; |
||||
|
color: #666666; |
||||
|
font-weight: normal; |
||||
|
line-height: 1.4; |
||||
|
transition: color 0.2s, font-weight 0.2s; |
||||
|
} |
||||
|
|
||||
|
/* 激活状态样式 */ |
||||
|
.status-item.active .status-text { |
||||
|
color: #ff6b35; |
||||
|
font-weight: 500; |
||||
|
} |
||||
|
|
||||
|
/* 激活指示条（下划线） */ |
||||
|
.status-item.active::after { |
||||
|
content: ''; |
||||
|
position: absolute; |
||||
|
bottom: 0; |
||||
|
left: 50%; |
||||
|
transform: translateX(-50%); |
||||
|
width: 40rpx; |
||||
|
height: 4rpx; |
||||
|
background-color: #ff6b35; |
||||
|
border-radius: 2rpx; |
||||
|
transition: width 0.2s ease; |
||||
|
} |
||||
|
|
||||
|
.box1 { |
||||
|
width: 95%; |
||||
|
margin: 20rpx auto; |
||||
|
background: #fff; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 20rpx; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,154 @@ |
|||||
|
<template> |
||||
|
<!-- 商家订单详情 --> |
||||
|
<view class="page1"> |
||||
|
<view class="title"> |
||||
|
<view class="title-sreach"> |
||||
|
<view class="back-btn" @tap="back"> |
||||
|
<uni-icons type="left" size="28"></uni-icons> |
||||
|
</view> |
||||
|
<view class="title-name"> |
||||
|
账单详情 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="content"> |
||||
|
<view class="box1"> |
||||
|
<view style="font-size: 14px;font-weight: 700;margin-bottom: 10px;"> |
||||
|
2026-04-09 |
||||
|
</view> |
||||
|
<view style="display: flex;font-weight: 700;"> |
||||
|
<view style="flex: 1;"> |
||||
|
结算金额：￥100.00 |
||||
|
</view> |
||||
|
<view style="flex: 1;"> |
||||
|
实际打款金额：￥100.00 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box1"> |
||||
|
<uni-table border stripe emptyText="暂无更多数据" > |
||||
|
<!-- 表头行 --> |
||||
|
<uni-tr> |
||||
|
<uni-th width="100" align="center">订单编号</uni-th> |
||||
|
<uni-th width="100" align="center">商品金额</uni-th> |
||||
|
<uni-th width="100" align="center">餐盒费</uni-th> |
||||
|
<uni-th width="100" align="center">平台抽佣</uni-th> |
||||
|
<uni-th width="100" align="center">结算金额</uni-th> |
||||
|
</uni-tr> |
||||
|
<!-- 表格数据行 --> |
||||
|
<uni-tr> |
||||
|
<uni-td align="center">5154564164654</uni-td> |
||||
|
<uni-td align="center">24</uni-td> |
||||
|
<uni-td align="center">1</uni-td> |
||||
|
<uni-td align="center">1</uni-td> |
||||
|
<uni-td align="center">22</uni-td> |
||||
|
</uni-tr> |
||||
|
<uni-tr> |
||||
|
<uni-td align="center">5154564164654</uni-td> |
||||
|
<uni-td align="center">24</uni-td> |
||||
|
<uni-td align="center">1</uni-td> |
||||
|
<uni-td align="center">1</uni-td> |
||||
|
<uni-td align="center">22</uni-td> |
||||
|
</uni-tr> |
||||
|
<uni-tr> |
||||
|
<uni-td align="center">5154564164654</uni-td> |
||||
|
<uni-td align="center">24</uni-td> |
||||
|
<uni-td align="center">1</uni-td> |
||||
|
<uni-td align="center">1</uni-td> |
||||
|
<uni-td align="center">22</uni-td> |
||||
|
</uni-tr> |
||||
|
<uni-tr> |
||||
|
<uni-td align="center">5154564164654</uni-td> |
||||
|
<uni-td align="center">24</uni-td> |
||||
|
<uni-td align="center">1</uni-td> |
||||
|
<uni-td align="center">1</uni-td> |
||||
|
<uni-td align="center">22</uni-td> |
||||
|
</uni-tr> |
||||
|
</uni-table> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
} |
||||
|
}, |
||||
|
filters:{ |
||||
|
formatISOTime(isoString) { |
||||
|
const date = new Date(isoString); |
||||
|
const year = date.getFullYear(); |
||||
|
const month = (date.getMonth() + 1).toString().padStart(2, '0'); |
||||
|
const day = date.getDate().toString().padStart(2, '0'); |
||||
|
const hours = date.getHours().toString().padStart(2, '0'); |
||||
|
const minutes = date.getMinutes().toString().padStart(2, '0'); |
||||
|
const seconds = date.getSeconds().toString().padStart(2, '0'); |
||||
|
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; |
||||
|
} |
||||
|
}, |
||||
|
onShow() { |
||||
|
|
||||
|
}, |
||||
|
onLoad() { |
||||
|
}, |
||||
|
methods: { |
||||
|
back() { |
||||
|
uni.navigateBack() |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
page { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
background: #F5F8F5; |
||||
|
color: #00231C; |
||||
|
} |
||||
|
|
||||
|
.page1 { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 24rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat; |
||||
|
width: 100%; |
||||
|
height: 20%; |
||||
|
} |
||||
|
|
||||
|
.title-sreach { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
height: 200rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.back-btn { |
||||
|
padding-top: 110rpx; |
||||
|
} |
||||
|
|
||||
|
.title-name { |
||||
|
padding-top: 110rpx; |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 700; |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.content{ |
||||
|
margin: -140rpx auto; |
||||
|
} |
||||
|
.box1 { |
||||
|
width: 95%; |
||||
|
margin: 20rpx auto; |
||||
|
background: #fff; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 20rpx; |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue