删除无用文件
This commit is contained in:
@@ -1,413 +0,0 @@
|
||||
<template>
|
||||
|
||||
<view class="page-content">
|
||||
<view style=" padding: 20rpx;">
|
||||
<nut-form>
|
||||
<nut-form-item label="名称">
|
||||
<nut-input v-model="form.goods_name" class="nut-input-text" placeholder="请输入名称" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="串号">
|
||||
<nut-input v-model="form.goods_no" class="nut-input-text" placeholder="请输入串号" type="text">
|
||||
<template #right>
|
||||
<nut-icon @click="onScan" name="scan2" size="30" custom-color="#000000" />
|
||||
</template>
|
||||
</nut-input>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="售价">
|
||||
<nut-input v-model="form.goods_price" class="nut-input-text" placeholder="请输入售价" type="nubmer" />
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<nut-form-item label="说明">
|
||||
<nut-textarea v-model="form.content" autosize placeholder="请输入说明" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="介绍">
|
||||
<nut-textarea v-model="form.details_content" autosize placeholder="请输入介绍" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<!-- <nut-form-item label="上架人">
|
||||
<nut-input v-model="form.add_person" class="nut-input-text" placeholder="请输入上架人" type="text" />
|
||||
</nut-form-item> -->
|
||||
<!-- <nut-form-item label="排序">
|
||||
<nut-input v-model="form.goods_sort" class="nut-input-text" placeholder="请输入排序" type="number" />
|
||||
</nut-form-item> -->
|
||||
|
||||
|
||||
|
||||
<nut-form-item label="状态">
|
||||
<nut-radio-group direction="horizontal" v-model="form.status">
|
||||
<nut-radio label="10">下架</nut-radio>
|
||||
<nut-radio label="20">上架</nut-radio>
|
||||
</nut-radio-group>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item>
|
||||
<template v-slot:label>成色</template>
|
||||
<template v-slot:default>
|
||||
<view style="color: black;" @click="show_degree_popup = true">
|
||||
<text>{{form.degree_name}}</text>
|
||||
</view>
|
||||
</template>
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<nut-form-item>
|
||||
<template v-slot:label>机型</template>
|
||||
<template v-slot:default>
|
||||
<view style="color: black;" @click="show_product_cascader = true">
|
||||
<text>{{form.type_name}},{{form.brand_name}},{{form.product_name}}</text>
|
||||
</view>
|
||||
</template>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item>
|
||||
<template v-slot:label>商品图片</template>
|
||||
<template v-slot:default>
|
||||
<shmily-drag-image v-model="form.images" :number=9 :add-image="addGoodsImg"
|
||||
keyName="file_path"></shmily-drag-image></template>
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<!-- <nut-form-item>
|
||||
<template v-slot:label>商品视频</template>
|
||||
<template v-slot:default>
|
||||
<nut-uploader :url="uploadVideoUrl" name="iFile" v-model:file-list="uploadVideoList"
|
||||
:source-type="['album','camera']" :media-type="['video']" maximum="1" :multiple="false"
|
||||
@success="onUploadSuccess" @fail="onUploadFail" @delete="onDeleteFile" :timeout="1000*60">
|
||||
</nut-uploader>
|
||||
</template>
|
||||
</nut-form-item> -->
|
||||
|
||||
|
||||
<view style="align-items: center;text-align: center; padding: 20rpx 60rpx;">
|
||||
<nut-button type="primary" block @click="onSubmit">
|
||||
新增商品
|
||||
</nut-button>
|
||||
</view>
|
||||
</nut-form>
|
||||
|
||||
</view>
|
||||
|
||||
<nut-popup v-model:visible="show_degree_popup" position="bottom" safe-area-inset-bottom>
|
||||
<nut-picker v-model="popup_degree_val" :columns="filter_params.degree_list"
|
||||
:field-names="{text:'degree_name',value:'degree_id'}" title="选择成色" @confirm="onConfirmDegree"
|
||||
@cancel="show_degree_popup = false">
|
||||
</nut-picker>
|
||||
</nut-popup>
|
||||
|
||||
<nut-cascader title="机型选择" v-model:visible="show_product_cascader" v-model="cascader_product_val"
|
||||
@change="onProductChange" @pathChange="onProcutPathChange" text-key="label" value-key="value"
|
||||
:title-ellipsis="false" children-key="children" :options="filter_params.drop_down_options"></nut-cascader>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onMounted,
|
||||
reactive,
|
||||
ref,
|
||||
toValue
|
||||
} from 'vue';
|
||||
import {
|
||||
fetchFilterParmas,
|
||||
fetchGoodsAdd,
|
||||
} from '@/api/goods';
|
||||
import {
|
||||
getUploadImageUrl,
|
||||
} from '@/api/request';
|
||||
|
||||
|
||||
// import {
|
||||
// fetchControlAddGoods,
|
||||
// } from '@/api/control';
|
||||
|
||||
|
||||
// const uploadVideoUrl = ref('')
|
||||
// uploadVideoUrl.value = getUploadVideoUrl()
|
||||
// const uploadVideoOk = ref('https://qnxsd.19year.cn/wechat_2025-08-12_130250_716.png')
|
||||
// const uploadVideoList = ref([])
|
||||
// const videoUrl = ref('')
|
||||
|
||||
// const onUploadSuccess = (res) => {
|
||||
// uploadVideoList.value[0].url = uploadVideoOk
|
||||
// let respStr = res.data.data
|
||||
// let resp = JSON.parse(respStr)
|
||||
// if (resp.code === 1) {
|
||||
// form.video_url = resp.data.url
|
||||
// uni.showToast({
|
||||
// title: '上传成功',
|
||||
// icon: 'success'
|
||||
// })
|
||||
// } else {
|
||||
// uni.showToast({
|
||||
// title: '上传失败',
|
||||
// icon: 'none'
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
|
||||
// const onDeleteFile = (files, fileList, index) => {
|
||||
// uploadVideoList.value = []
|
||||
// form.video_url = ""
|
||||
// console.log('uploadVideoList3', uploadVideoList)
|
||||
// console.log('form3', form)
|
||||
// }
|
||||
// const onUploadFail = (err) => {
|
||||
// console.error('上传失败:', err)
|
||||
// uni.showToast({
|
||||
// title: '上传失败',
|
||||
// icon: 'none'
|
||||
// })
|
||||
// }
|
||||
|
||||
|
||||
|
||||
// 扫码
|
||||
const onScan = () => {
|
||||
uni.scanCode({
|
||||
onlyFromCamera: true,
|
||||
success: (res) => {
|
||||
console.log(res);
|
||||
form.goods_no = res.result
|
||||
},
|
||||
fail: () => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '扫码失败'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
const filter_params = reactive({})
|
||||
|
||||
|
||||
|
||||
// const report_tags = reactive([])
|
||||
|
||||
// const all_report_tag_ids = ref([])
|
||||
|
||||
// 默认展开
|
||||
// const defaultExpandKeys = ref([0])
|
||||
|
||||
// 显示机型选择
|
||||
const show_product_cascader = ref(false)
|
||||
// 显示成色
|
||||
const show_degree_popup = ref(false)
|
||||
|
||||
// const show_disk_popup = ref(false)
|
||||
// 显示验机报告
|
||||
// const show_report_tags_popup = ref(false)
|
||||
|
||||
|
||||
const popup_degree_val = ref([])
|
||||
const cascader_product_val = ref([])
|
||||
|
||||
// const popup_disk_val = ref(["未选择"])
|
||||
|
||||
|
||||
|
||||
const form = reactive({
|
||||
// goods_id: 0,
|
||||
goods_name: '',
|
||||
goods_no: '',
|
||||
|
||||
|
||||
goods_price: '',
|
||||
goods_stock: '',
|
||||
content: '',
|
||||
details_content: '',
|
||||
status: '10',
|
||||
images: [],
|
||||
add_person: '',
|
||||
|
||||
// disk: '未选择',
|
||||
|
||||
degree_id: 0,
|
||||
degree_name: '未选择',
|
||||
type_id: 0,
|
||||
type_name: '未选择',
|
||||
brand_id: 0,
|
||||
brand_name: '未选择',
|
||||
product_id: 0,
|
||||
product_name: '未选择',
|
||||
|
||||
|
||||
|
||||
// video_url: ''
|
||||
|
||||
|
||||
// goods_no: '',
|
||||
|
||||
|
||||
// goods_status: '10',
|
||||
// goods_sort: 0,
|
||||
|
||||
|
||||
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const onProductChange = (...args) => {
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
const onSubmit = () => {
|
||||
console.log('form====>', form);
|
||||
fetchGoodsAdd(form).then(res => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '新增商品成功'
|
||||
})
|
||||
// setTimeout(() => {
|
||||
// uni.switchTab({
|
||||
// url: '/pages/mine/index'
|
||||
// });
|
||||
// }, 500)
|
||||
|
||||
setTimeout(() => {
|
||||
// uni.switchTab({
|
||||
// url: '/pages/mine/index'
|
||||
// });
|
||||
uni.navigateBack({
|
||||
delta: 1 // 返回上一页
|
||||
});
|
||||
}, 500)
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 选择机型
|
||||
const onProcutPathChange = (args) => {
|
||||
console.log(args);
|
||||
form.type_id = 0
|
||||
form.type_name = ''
|
||||
form.brand_id = 0
|
||||
form.brand_name = ''
|
||||
form.product_id = 0
|
||||
form.product_name = ''
|
||||
if (args.length >= 1 && args[0] !== null) {
|
||||
form.type_id = args[0].value
|
||||
form.type_name = args[0].text
|
||||
}
|
||||
if (args.length >= 2 && args[1] !== null) {
|
||||
form.brand_id = args[1].value
|
||||
form.brand_name = args[1].text
|
||||
}
|
||||
if (args.length >= 3 && args[2] !== null) {
|
||||
form.product_id = args[2].value
|
||||
form.product_name = args[2].text
|
||||
}
|
||||
}
|
||||
// 选择成色
|
||||
const onConfirmDegree = () => {
|
||||
form.degree_id = popup_degree_val.value[0]
|
||||
filter_params.degree_list.forEach(item => {
|
||||
if (item.degree_id === form.degree_id) {
|
||||
form.degree_name = item.degree_name
|
||||
}
|
||||
})
|
||||
show_degree_popup.value = false
|
||||
}
|
||||
// const onConfirmDisk = () => {
|
||||
// form.disk = popup_disk_val.value[0]
|
||||
// console.log('form.disk', form.disk);
|
||||
// console.log('popup_disk_val.value', popup_disk_val.value);
|
||||
// // filter_params.disk_list.forEach(item => {
|
||||
// // if (item.value === form.disk) {
|
||||
// // form.disk = item.value
|
||||
// // }
|
||||
// // })
|
||||
// show_disk_popup.value = false
|
||||
// }
|
||||
|
||||
onMounted(() => {
|
||||
fetchFilterParmas(1).then(res => {
|
||||
Object.assign(filter_params, res)
|
||||
filter_params.degree_list.unshift({
|
||||
degree_id: 0,
|
||||
degree_name: '未选择'
|
||||
})
|
||||
console.log('filter_params', filter_params)
|
||||
// console.log('filter_params.disk_list', filter_params.disk_list)
|
||||
|
||||
|
||||
// filter_params.disk_list.unshift({
|
||||
// // id: 0,
|
||||
// value: '未选择'
|
||||
// })
|
||||
|
||||
|
||||
})
|
||||
})
|
||||
|
||||
// 上传商品图片
|
||||
const addGoodsImg = () => {
|
||||
uni.chooseImage({
|
||||
count: 9 - (form.image?.length || 0),
|
||||
sourceType: ['album', 'camera'],
|
||||
success: res => {
|
||||
res.tempFiles.forEach(file => {
|
||||
uni.uploadFile({
|
||||
url: getUploadImageUrl(),
|
||||
filePath: file.path,
|
||||
name: 'iFile',
|
||||
formData: {
|
||||
group_id: 1,
|
||||
},
|
||||
success: (res) => {
|
||||
let data = JSON.parse(res.data).data
|
||||
form.images.push({
|
||||
id: parseInt(data.file_id),
|
||||
file_path: data.file_path,
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page-content {
|
||||
min-height: 100vh;
|
||||
background-color: #f2f3f5;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
background: #ffffff;
|
||||
align-items: center;
|
||||
max-height: 300rpx;
|
||||
overflow-y: scroll;
|
||||
padding: 10px;
|
||||
|
||||
.list-item {
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 20rpx 10rpx;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,341 +0,0 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
|
||||
|
||||
<nut-watermark v-if="detail.status?.value === 10" class="mark1" :z-index="1" content="此商品已下架"></nut-watermark>
|
||||
<nut-watermark v-if="detail.status?.value === 30" class="mark1" :z-index="1" content="此商品已锁定"></nut-watermark>
|
||||
<nut-watermark v-if="detail.status?.value === 40" class="mark1" :z-index="1" content="此商品已售出"></nut-watermark>
|
||||
|
||||
|
||||
<swiper class="swiper" circular indicator-dots autoplay>
|
||||
<swiper-item @click="showGoodsImages(idx)" v-for="(item,idx) in detail.image" :key="idx">
|
||||
<image :src="item.file_path" mode="aspectFill"></image>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
|
||||
|
||||
<view class='goods_info'>
|
||||
<nut-cell-group>
|
||||
<view class="price">
|
||||
<text class="unit">￥</text>
|
||||
<text class="value">{{detail.goods_price}}</text>
|
||||
</view>
|
||||
</nut-cell-group>
|
||||
<nut-cell-group>
|
||||
<view class="name">
|
||||
<view class="top">
|
||||
<view class="tag">
|
||||
<text>{{detail.degree?.degree_name}}</text>
|
||||
</view>
|
||||
<text class="title">{{detail.goods_name}}</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="info">{{detail.content}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</nut-cell-group>
|
||||
<view class="service">
|
||||
<view class="info">
|
||||
<text class="title">服务</text>
|
||||
<text class="value">{{serviceTxt}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
import {
|
||||
navigateTo,
|
||||
switchTab,
|
||||
goToLoginPage
|
||||
} from '@/utils/helper';
|
||||
import {
|
||||
onShareAppMessage,
|
||||
onShareTimeline,
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app'
|
||||
import {
|
||||
fetchGoodsDetail,
|
||||
} from '@/api/goods';
|
||||
|
||||
|
||||
import {
|
||||
fetchGetConfig,
|
||||
} from '@/api/config';
|
||||
|
||||
// 审核模式 默认开启 true
|
||||
// const audit = ref(true);
|
||||
const serviceTxt = ref('')
|
||||
|
||||
|
||||
|
||||
const id = ref(0)
|
||||
const detail = reactive({})
|
||||
|
||||
|
||||
onLoad(options => {
|
||||
console.log('init');
|
||||
// 获取配置
|
||||
getConfig()
|
||||
|
||||
// 获取商品详情
|
||||
id.value = options.id
|
||||
fetchGoodsDetail(id.value).then(res => {
|
||||
Object.assign(detail, res)
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// 获取配置
|
||||
const getConfig = () => {
|
||||
fetchGetConfig().then(res => {
|
||||
console.log('getConfig=====>', res)
|
||||
// audit.value = res.appConfig.is_audit == 1
|
||||
serviceTxt.value = res.appConfig.service_txt
|
||||
})
|
||||
}
|
||||
|
||||
// 分享给朋友圈
|
||||
onShareTimeline((res) => {
|
||||
return {
|
||||
title: detail.goods_name,
|
||||
path: '/pages/mall/detail?id=' + detail.goods_id,
|
||||
imageUrl: detail.image[0].file_path
|
||||
};
|
||||
})
|
||||
|
||||
|
||||
// 分享
|
||||
onShareAppMessage((res) => {
|
||||
return {
|
||||
title: detail.goods_name,
|
||||
path: '/pages/mall/detail?id=' + detail.goods_id,
|
||||
imageUrl: detail.image[0].file_path
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
|
||||
// 显示图片
|
||||
const showGoodsImages = (index) => {
|
||||
uni.previewImage({
|
||||
current: index, // 指定当前显示的图片索引
|
||||
urls: detail.image.map(e => {
|
||||
return e.file_path
|
||||
}),
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.bottom-action {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 50px;
|
||||
background: #fff;
|
||||
width: calc(100% - 20px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto;
|
||||
padding: 5px 10px;
|
||||
|
||||
.bottom-action-icon {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
.bottom-action-icon-item {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
text {
|
||||
color: rgba(0, 0, 0, .5);
|
||||
font-size: 11px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.bottom-action-btn {
|
||||
-ms-flex-align: center;
|
||||
-ms-flex-pack: end;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
-webkit-justify-content: flex-end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: calc(100vh - 50px); //100vh;
|
||||
/* align-items: center; */
|
||||
// justify-content: center;
|
||||
background-color: #f2f3f5;
|
||||
// height: calc(100% - 50px);
|
||||
--nut-cell-group-title-color: #000;
|
||||
--nut-collapse-item-padding: 10px 10px 10px 10px;
|
||||
--nut-collapse-wrapper-content-padding: 10px 10px 10px 10px;
|
||||
--nut-collapse-item-color: #000;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.report-inner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 5px;
|
||||
|
||||
.report-item {
|
||||
.report-item-name {
|
||||
color: rgba(0, 0, 0, .9);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.report-item-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.report-item-content-item {
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
width: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.count-item {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
width: 100%;
|
||||
height: 414px;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.goods_info {
|
||||
padding: 5px;
|
||||
color: #000;
|
||||
|
||||
.price {
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
background: #fff;
|
||||
|
||||
.unit {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.value {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.name {
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
background: #fff;
|
||||
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
flex-direction: column;
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
|
||||
.tag {
|
||||
background: #000;
|
||||
padding: 1px 2px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
border-radius: 2px;
|
||||
|
||||
text {
|
||||
font-size: 10px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.info {
|
||||
color: rgba(0, 0, 0, .7);
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.service {
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
background: #fff;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
gap: 5px;
|
||||
|
||||
.title {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.value {
|
||||
color: rgba(0, 0, 0, .7);
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.right_icon {
|
||||
background-color: currentColor;
|
||||
mask: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiMxQTFBMUEiIGQ9Ik0zNTMuODMgMTU4LjE3YTQyLjY3IDQyLjY3IDAgMSAxIDYwLjM0LTYwLjM0bDM4NCAzODRhNDIuNjcgNDIuNjcgMCAwIDEgMCA2MC4zNmwtMzg0IDM4NGE0Mi42NyA0Mi42NyAwIDEgMS02MC4zNC02MC4zNkw3MDcuNjcgNTEyeiIvPjwvc3ZnPg==') 0 0/100% 100% no-repeat;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.report {
|
||||
border-radius: 5px;
|
||||
padding: 1px;
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,339 +0,0 @@
|
||||
<template>
|
||||
|
||||
<view class="page-content">
|
||||
|
||||
<view v-if="is_show_edit" style=" padding: 20rpx;">
|
||||
|
||||
|
||||
<nut-form>
|
||||
<nut-form-item label="名称">
|
||||
<nut-input v-model="form.goods_name" class="nut-input-text" placeholder="请输入名称" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="串号">
|
||||
<nut-input v-model="form.goods_no" class="nut-input-text" placeholder="请输入串号" type="text">
|
||||
<template #right>
|
||||
<nut-icon @click="onScan" name="scan2" size="30" custom-color="#000000" />
|
||||
</template>
|
||||
</nut-input>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="售价">
|
||||
<nut-input v-model="form.goods_price" class="nut-input-text" placeholder="请输入售价" type="nubmer" />
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<nut-form-item label="说明">
|
||||
<nut-textarea v-model="form.content" autosize placeholder="请输入说明" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="介绍">
|
||||
<nut-textarea v-model="form.details_content" autosize placeholder="请输入介绍" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<!-- <nut-form-item label="上架人">
|
||||
<nut-input v-model="form.add_person" class="nut-input-text" placeholder="请输入上架人" type="text" />
|
||||
</nut-form-item> -->
|
||||
<!-- <nut-form-item label="排序">
|
||||
<nut-input v-model="form.goods_sort" class="nut-input-text" placeholder="请输入排序" type="number" />
|
||||
</nut-form-item> -->
|
||||
|
||||
|
||||
|
||||
<nut-form-item label="状态">
|
||||
<nut-radio-group direction="horizontal" v-model="form.status">
|
||||
<nut-radio label="10">下架</nut-radio>
|
||||
<nut-radio label="20">上架</nut-radio>
|
||||
</nut-radio-group>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item>
|
||||
<template v-slot:label>成色</template>
|
||||
<template v-slot:default>
|
||||
<view style="color: black;" @click="show_degree_popup = true">
|
||||
<text>{{form.degree_name}}</text>
|
||||
</view>
|
||||
</template>
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<nut-form-item>
|
||||
<template v-slot:label>机型</template>
|
||||
<template v-slot:default>
|
||||
<view style="color: black;" @click="show_product_cascader = true">
|
||||
<text>{{form.type_name}},{{form.brand_name}},{{form.product_name}}</text>
|
||||
</view>
|
||||
</template>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item>
|
||||
<template v-slot:label>商品图片</template>
|
||||
<template v-slot:default>
|
||||
<shmily-drag-image v-model="form.images" :number=9 :add-image="addGoodsImg"
|
||||
keyName="file_path"></shmily-drag-image></template>
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
|
||||
|
||||
<view style="align-items: center;text-align: center; padding: 20rpx 60rpx;">
|
||||
<nut-button type="primary" block @click="onSubmit">
|
||||
保存修改
|
||||
</nut-button>
|
||||
</view>
|
||||
</nut-form>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<nut-popup v-model:visible="show_degree_popup" position="bottom" safe-area-inset-bottom>
|
||||
<nut-picker v-model="popup_degree_val" :columns="filter_params.degree_list"
|
||||
:field-names="{text:'degree_name',value:'degree_id'}" title="选择成色" @confirm="onConfirmDegree"
|
||||
@cancel="show_degree_popup = false">
|
||||
</nut-picker>
|
||||
</nut-popup>
|
||||
|
||||
<nut-cascader title="机型选择" v-model:visible="show_product_cascader" v-model="cascader_product_val"
|
||||
@change="onProductChange" @pathChange="onProcutPathChange" text-key="label" value-key="value"
|
||||
:title-ellipsis="false" children-key="children" :options="filter_params.drop_down_options"></nut-cascader>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onMounted,
|
||||
reactive,
|
||||
ref,
|
||||
toValue,
|
||||
computed
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app'
|
||||
|
||||
|
||||
import {
|
||||
fetchFilterParmas,
|
||||
fetchGoodsEdit,
|
||||
fetchGoodsDetail,
|
||||
} from '@/api/goods';
|
||||
import {
|
||||
getUploadImageUrl,
|
||||
} from '@/api/request';
|
||||
|
||||
const id = ref(0)
|
||||
// 是否显示结果页
|
||||
const is_show_edit = ref(false);
|
||||
// 显示机型选择
|
||||
const show_product_cascader = ref(false)
|
||||
// 显示成色
|
||||
const show_degree_popup = ref(false)
|
||||
const popup_degree_val = ref([])
|
||||
const cascader_product_val = ref([])
|
||||
const filter_params = reactive({})
|
||||
const form = reactive({
|
||||
goods_id: 0,
|
||||
goods_name: '',
|
||||
goods_no: '',
|
||||
goods_price: '',
|
||||
goods_stock: '',
|
||||
content: '',
|
||||
details_content: '',
|
||||
status: '10',
|
||||
images: [],
|
||||
add_person: '',
|
||||
degree_id: 0,
|
||||
degree_name: '未选择',
|
||||
type_id: 0,
|
||||
type_name: '未选择',
|
||||
brand_id: 0,
|
||||
brand_name: '未选择',
|
||||
product_id: 0,
|
||||
product_name: '未选择',
|
||||
})
|
||||
|
||||
|
||||
|
||||
//
|
||||
onMounted(() => {
|
||||
fetchFilterParmas(1).then(res => {
|
||||
Object.assign(filter_params, res)
|
||||
filter_params.degree_list.unshift({
|
||||
degree_id: 0,
|
||||
degree_name: '未选择'
|
||||
})
|
||||
console.log('filter_params', filter_params)
|
||||
})
|
||||
})
|
||||
|
||||
onLoad(options => {
|
||||
console.log("goods_id===>", options.id);
|
||||
// 获取商品详情
|
||||
id.value = options.id
|
||||
is_show_edit.value = false;
|
||||
fetchGoodsDetail(id.value).then(res => {
|
||||
is_show_edit.value = true;
|
||||
console.log("====>", res);
|
||||
form.goods_id = res.goods_id
|
||||
form.goods_name = res.goods_name
|
||||
form.goods_no = res.goods_no
|
||||
form.goods_price = res.goods_price
|
||||
// form.goods_stock = res.goods_stock
|
||||
form.content = res.content
|
||||
form.details_content = res.details_content
|
||||
form.status = res.status.value.toString()
|
||||
|
||||
form.degree_id = res.degree?.degree_id ?? 0
|
||||
form.degree_name = res.degree?.degree_name ?? '未选择'
|
||||
form.type_id = res.type?.type_id ?? 0
|
||||
form.type_name = res.type?.name ?? '未选择'
|
||||
form.brand_id = res.brand?.brand_id ?? 0
|
||||
form.brand_name = res.brand?.name ?? '未选择'
|
||||
form.product_id = res.product?.product_id ?? 0
|
||||
form.product_name = res.product?.name ?? '未选择'
|
||||
popup_degree_val.value = [res.degree?.degree_id ?? 0]
|
||||
cascader_product_val.value = [res.type?.type_id ?? 0, res.brand?.brand_id ?? 0, res.product
|
||||
?.product_id ?? 0
|
||||
]
|
||||
form.images = []
|
||||
res.image?.forEach(item => {
|
||||
form.images.push({
|
||||
id: item.image_id,
|
||||
file_path: item.file_path,
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
const onProductChange = (...args) => {
|
||||
console.log(0, ...args)
|
||||
console.log(cascader_product_val)
|
||||
}
|
||||
|
||||
const onSubmit = () => {
|
||||
console.log('form===>', form);
|
||||
fetchGoodsEdit(form).then(res => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '编辑商品成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1 // 返回上一页
|
||||
});
|
||||
}, 500)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// 扫码
|
||||
const onScan = () => {
|
||||
uni.scanCode({
|
||||
onlyFromCamera: true,
|
||||
success: (res) => {
|
||||
console.log(res);
|
||||
form.goods_no = res.result
|
||||
},
|
||||
fail: () => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '扫码失败'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const onProcutPathChange = (args) => {
|
||||
console.log(args);
|
||||
form.type_id = 0
|
||||
form.type_name = ''
|
||||
form.brand_id = 0
|
||||
form.brand_name = ''
|
||||
form.product_id = 0
|
||||
form.product_name = ''
|
||||
if (args.length >= 1 && args[0] !== null) {
|
||||
form.type_id = args[0].value
|
||||
form.type_name = args[0].text
|
||||
}
|
||||
if (args.length >= 2 && args[1] !== null) {
|
||||
form.brand_id = args[1].value
|
||||
form.brand_name = args[1].text
|
||||
}
|
||||
if (args.length >= 3 && args[2] !== null) {
|
||||
form.product_id = args[2].value
|
||||
form.product_name = args[2].text
|
||||
}
|
||||
}
|
||||
const onConfirmDegree = () => {
|
||||
form.degree_id = popup_degree_val.value[0]
|
||||
filter_params.degree_list.forEach(item => {
|
||||
if (item.degree_id === form.degree_id) {
|
||||
form.degree_name = item.degree_name
|
||||
}
|
||||
})
|
||||
show_degree_popup.value = false
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 上传商品图片
|
||||
const addGoodsImg = () => {
|
||||
uni.chooseImage({
|
||||
count: 9 - (form.image?.length || 0),
|
||||
sourceType: ['album', 'camera'],
|
||||
success: res => {
|
||||
res.tempFiles.forEach(file => {
|
||||
uni.uploadFile({
|
||||
url: getUploadImageUrl(),
|
||||
filePath: file.path,
|
||||
name: 'iFile',
|
||||
formData: {
|
||||
group_id: 1,
|
||||
},
|
||||
success: (res) => {
|
||||
let data = JSON.parse(res.data).data
|
||||
form.images.push({
|
||||
id: parseInt(data.file_id),
|
||||
file_path: data.file_path,
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page-content {
|
||||
min-height: 100vh;
|
||||
background-color: #f2f3f5;
|
||||
--nut-searchbar-input-height: 40px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// .list {
|
||||
// display: flex;
|
||||
// justify-content: center;
|
||||
// flex-direction: column;
|
||||
// background: #ffffff;
|
||||
// align-items: center;
|
||||
// max-height: 300rpx;
|
||||
// overflow-y: scroll;
|
||||
// padding: 10px;
|
||||
|
||||
// .list-item {
|
||||
// border-bottom: 1px solid #eee;
|
||||
// padding: 20rpx 10rpx;
|
||||
|
||||
// }
|
||||
// }
|
||||
</style>
|
||||
@@ -1,705 +0,0 @@
|
||||
<template>
|
||||
<view class="page-content">
|
||||
<z-paging ref="paging" :refresher-enabled="false" :auto-clean-list-when-reload="false"
|
||||
:auto-scroll-to-top-when-reload="false" v-model="dataList" @query="queryList">
|
||||
<view style="z-index: 10000;position: sticky;" :style="'top:0px'">
|
||||
<view class="top-bar">
|
||||
<nut-button type="primary" block plain @click="navigateTo('/pages/config/goodsAdd')">
|
||||
新增订单
|
||||
</nut-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="goods-item" v-for="(item, index) in dataList" :key="index">
|
||||
<view class="goods-item-image">
|
||||
<!-- @click="showGoodsImages(item)" -->
|
||||
<image class="goods-item-image-img" :src="getImg(item)" @click="navigateTo('/pages/config/goodsDetail?id=' + item.goods_id)"
|
||||
mode="scaleToFill">
|
||||
</image>
|
||||
</view>
|
||||
<view class="goods-item-content">
|
||||
<!-- @click="navigateTo('/pages/control/goods/edit?id=' + item.goods_id)" -->
|
||||
<view class="goods-item-content-header">
|
||||
<nut-tag custom-color="#1a1a1a">{{ item.degree.degree_name }}</nut-tag>
|
||||
<view>{{item.goods_name}}</view>
|
||||
</view>
|
||||
<!-- @click="navigateTo('/pages/control/goods/edit?id=' + item.goods_id)" -->
|
||||
<view class="goods-item-content-body">
|
||||
<view class="goods-item-content-body-desc">
|
||||
{{item.content}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods-item-content-footer">
|
||||
<view style="font-size: 24rpx;color: red;">
|
||||
<text>¥{{item.goods_price}}</text>
|
||||
</view>
|
||||
<view style="font-size: 24rpx;">
|
||||
状态:<text>{{item.status.text}}</text>
|
||||
</view>
|
||||
<view class="goods-item-content-footer-btn">
|
||||
<nut-button size="small" type="primary"
|
||||
v-if="item.status.value == 10 || item.status.value == 20"
|
||||
@click="navigateTo('/pages/config/goodsEdit?id=' + item.goods_id)">
|
||||
编辑商品
|
||||
</nut-button>
|
||||
<nut-button size="small" type="primary" v-if="item.status.value == 40 "
|
||||
@click="navigateTo('/pages/config/goodsEdit?id=' + item.goods_id)">
|
||||
售后(重新上架)
|
||||
</nut-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</z-paging>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
onMounted,
|
||||
computed
|
||||
} from 'vue'
|
||||
|
||||
import {
|
||||
onLoad,
|
||||
onShow,
|
||||
} from '@dcloudio/uni-app'
|
||||
// import {
|
||||
|
||||
// fetchFilterParmas
|
||||
// } from '@/api/goods';
|
||||
import {
|
||||
fetchFilterParmas,
|
||||
fetchSysGoodsList
|
||||
} from '@/api/goods';
|
||||
|
||||
import {
|
||||
navigateTo,
|
||||
// switchTab,
|
||||
// goToOtherMiniProgram
|
||||
} from '@/utils/helper';
|
||||
|
||||
|
||||
// 显示商品图片
|
||||
const showGoodsImages = (goods) => {
|
||||
console.log(goods);
|
||||
uni.previewImage({
|
||||
// current: index, // 指定当前显示的图片索引
|
||||
urls: goods?.image.map(e => {
|
||||
return e.file_path
|
||||
}),
|
||||
});
|
||||
}
|
||||
|
||||
const getImg = (goods) => {
|
||||
const url = goods?.image?.[0]?.file_path
|
||||
return url ? url + '?imageView2/1/w/200/h/200' : ''
|
||||
}
|
||||
|
||||
|
||||
// zp
|
||||
const paging = ref(null);
|
||||
// 商品列表
|
||||
const dataList = ref([]);
|
||||
|
||||
// 价格排序
|
||||
const selectPriceSortRef = ref(null);
|
||||
// 成色选择
|
||||
const selectDegreeRef = ref(null);
|
||||
// 机型选择
|
||||
const selectProductRef = ref(null)
|
||||
|
||||
const state = reactive({
|
||||
type_params: [], // 产品类型
|
||||
drop_down_options: [], // 产品类型下的品牌列表
|
||||
o_drop_down_options: [],
|
||||
// 价格排序
|
||||
price_sort_params: [{
|
||||
text: '默认排序',
|
||||
value: ''
|
||||
},
|
||||
{
|
||||
text: '价格升序',
|
||||
value: 'ascend'
|
||||
},
|
||||
{
|
||||
text: '价格降序',
|
||||
value: 'descend'
|
||||
}
|
||||
],
|
||||
// 成色所有选项
|
||||
degree_params: [],
|
||||
price_sort: '',
|
||||
price_sort_name: "默认排序",
|
||||
degree_ids: [],
|
||||
degree_name: "成色",
|
||||
product_name: "机型",
|
||||
type_id: 1, // 产品类型id 默认 1 手机
|
||||
type_name: '手机',
|
||||
brand_id: 0, // 品牌id // 默认 0 全部
|
||||
brand_name: '全部',
|
||||
product_ids: [0], // 机型ids 默认 0 全部
|
||||
search_val: '', // 搜索
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// 搜索
|
||||
const onSearch = () => {
|
||||
console.log("搜索：", state.search_val);
|
||||
paging.value.reload();
|
||||
|
||||
}
|
||||
// 清空搜索框
|
||||
const onClear = () => {
|
||||
console.log("搜索：", state.search_val);
|
||||
paging.value.reload();
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 机型重置
|
||||
const onResetProduct = () => {
|
||||
console.log("重置产品");
|
||||
state.type_id = 1
|
||||
state.type_name = '手机'
|
||||
state.brand_id = 0
|
||||
state.brand_name = '全部'
|
||||
state.product_ids = [0]
|
||||
state.product_name = '机型'
|
||||
}
|
||||
// 机型确定
|
||||
const onConfirmProduct = () => {
|
||||
console.log("当前产品类型", {
|
||||
"type_id": state.type_id,
|
||||
"type_name": state.type_name,
|
||||
"brand_id": state.brand_id,
|
||||
"brand_name": state.brand_name,
|
||||
"product_ids": state.product_ids,
|
||||
});
|
||||
selectProductRef.value?.toggle(false);
|
||||
// 4. 刷新数据
|
||||
paging.value.reload();
|
||||
}
|
||||
|
||||
// 选择机型
|
||||
const selectProduct = (product) => {
|
||||
if (product.value === 0) {
|
||||
state.product_ids = [0]
|
||||
} else {
|
||||
state.product_ids = state.product_ids.filter(e => e != 0)
|
||||
// 判断是否存在
|
||||
const index = state.product_ids.indexOf(product.value);
|
||||
if (index > -1) {
|
||||
state.product_ids.splice(index, 1); // 存在则删除
|
||||
if (state.product_ids.length === 0) {
|
||||
state.product_ids = [0]
|
||||
}
|
||||
} else {
|
||||
state.product_ids.push(product.value); // 新增
|
||||
}
|
||||
}
|
||||
console.log(product);
|
||||
}
|
||||
|
||||
const productOptions = computed(() => {
|
||||
return state?.o_drop_down_options[state.type_id]?.children[state.brand_id].children
|
||||
})
|
||||
|
||||
|
||||
// 选择品牌
|
||||
const selectBrand = (brand) => {
|
||||
console.log(brand);
|
||||
// 选中的品牌id
|
||||
state.brand_id = brand.value;
|
||||
state.brand_name = brand.label
|
||||
// 品牌下的产品ids
|
||||
state.product_ids = [0];
|
||||
state.product_name = brand.label
|
||||
}
|
||||
// 选择type
|
||||
const selectType = (type) => {
|
||||
console.log(type);
|
||||
// 选中产品类型id
|
||||
state.type_id = type.type_id;
|
||||
state.type_name = type.name;
|
||||
// 选中的品牌id
|
||||
state.brand_id = 0;
|
||||
state.brand_name = '全部';
|
||||
// 品牌下的产品ids
|
||||
state.product_ids = [0];
|
||||
}
|
||||
|
||||
// 选择价格排序
|
||||
const selectPriceSort = (item) => {
|
||||
if (state.price_sort !== item.value) {
|
||||
state.price_sort = item.value
|
||||
state.price_sort_name = item.text
|
||||
} else {
|
||||
state.price_sort_name = '默认排序'
|
||||
state.price_sort = ''
|
||||
}
|
||||
selectPriceSortRef.value?.toggle(false);
|
||||
// 4. 刷新数据
|
||||
paging.value.reload();
|
||||
};
|
||||
|
||||
// 选择成色
|
||||
const selectDegree = (item) => {
|
||||
const index = state.degree_ids.indexOf(item.value);
|
||||
if (index > -1) {
|
||||
state.degree_ids.splice(index, 1);
|
||||
} else {
|
||||
state.degree_ids.push(item.value);
|
||||
}
|
||||
if (state.degree_ids.length > 0) {
|
||||
state.degree_name = '已选' + state.degree_ids.length.toString() + '项'
|
||||
} else {
|
||||
state.degree_name = '成色'
|
||||
}
|
||||
}
|
||||
|
||||
// 重置选择成色
|
||||
const onResetDegree = () => {
|
||||
state.degree_ids = [];
|
||||
state.degree_name = '成色'
|
||||
selectDegreeRef.value?.toggle(false);
|
||||
// 4. 刷新数据
|
||||
paging.value.reload();
|
||||
}
|
||||
// 确认选择成色
|
||||
const onConfirmDegree = () => {
|
||||
if (state.degree_ids.length > 0) {
|
||||
state.degree_name = '已选' + state.degree_ids.length.toString() + '项'
|
||||
} else {
|
||||
state.degree_name = '成色'
|
||||
}
|
||||
selectDegreeRef.value?.toggle(false);
|
||||
// 4. 刷新数据
|
||||
paging.value.reload();
|
||||
}
|
||||
|
||||
|
||||
// 获取列表
|
||||
const queryList = (pageNo, pageSize) => {
|
||||
const params = {
|
||||
pageSize,
|
||||
page: pageNo,
|
||||
price_sort: state.price_sort,
|
||||
degree_ids: state.degree_ids,
|
||||
type_id: state.type_id,
|
||||
brand_id: state.brand_id,
|
||||
product_ids: state.product_ids,
|
||||
search: state.search_val,
|
||||
}
|
||||
console.log(params);
|
||||
fetchSysGoodsList(params).then(res => {
|
||||
console.log('res=>', res.list);
|
||||
paging.value.complete(res.list);
|
||||
|
||||
}).catch(res => {
|
||||
paging.value.complete(false);
|
||||
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const init = () => {
|
||||
console.log('init111');
|
||||
// 加载默认筛选项内容
|
||||
fetchFilterParmas().then(res => {
|
||||
console.log(res);
|
||||
// 处理成色
|
||||
let degree_params = res.degree_list;
|
||||
state.degree_params = degree_params.reduce((it, cit) => {
|
||||
it.push({
|
||||
text: cit.degree_name,
|
||||
value: cit.degree_id
|
||||
});
|
||||
return it;
|
||||
}, state.degree_params) || [];
|
||||
// 产品类型
|
||||
state.type_params = res.type_list
|
||||
// 产品下品牌列表
|
||||
state.drop_down_options = res.drop_down_options
|
||||
state.o_drop_down_options = res.o_drop_down_options
|
||||
})
|
||||
}
|
||||
|
||||
onShow(() => {
|
||||
console.log("onshow---");
|
||||
console.log('paging.value', paging.value);
|
||||
if (paging.value) {
|
||||
// paging.value.pageNo = 1;
|
||||
paging.value.refresh();
|
||||
// paging.value.refreshToPage(1)
|
||||
// paging.value.reload();
|
||||
}
|
||||
|
||||
});
|
||||
onMounted(() => {
|
||||
init();
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.page-content {
|
||||
min-height: 100vh;
|
||||
background-color: #f2f3f5;
|
||||
--nut-menu-bar-box-shadow: none;
|
||||
--nut-menu-item-content-padding: 20rpx;
|
||||
--nut-menu-item-content-max-height: 900rpx;
|
||||
|
||||
|
||||
|
||||
// --nut-searchbar-input-padding:5px 0 5px 13px;
|
||||
--nut-searchbar-input-height: 40px;
|
||||
}
|
||||
|
||||
:deep(.titleClass) .nut-menu__title-text {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
// padding: 20rpx;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
padding: 20rpx 60rpx;
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
// border-top: 1px solid #eee;
|
||||
// position: sticky;
|
||||
// bottom: 0;
|
||||
// z-index: 999;
|
||||
}
|
||||
|
||||
|
||||
.goods-item {
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20rpx;
|
||||
background-color: #ffffff;
|
||||
// border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
gap: 20rpx;
|
||||
|
||||
.goods-item-image {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
|
||||
.goods-item-image-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.goods-item-content {
|
||||
// width: 100%;
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
/* 首尾贴边，中间均分 */
|
||||
|
||||
// gap: 15px;
|
||||
.goods-item-content-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 6rpx 0;
|
||||
gap: 20rpx;
|
||||
}
|
||||
|
||||
.goods-item-content-body {
|
||||
padding: 6rpx 0;
|
||||
|
||||
.goods-item-content-body-desc {
|
||||
color: #7c7c7c;
|
||||
font-size: 26rpx;
|
||||
/* 关键属性 */
|
||||
display: -webkit-box;
|
||||
/* 使用弹性盒子布局 */
|
||||
-webkit-box-orient: vertical;
|
||||
/* 垂直方向排列 */
|
||||
-webkit-line-clamp: 2;
|
||||
/* 限制显示两行 */
|
||||
overflow: hidden;
|
||||
/* 超出部分隐藏 */
|
||||
text-overflow: ellipsis;
|
||||
/* 超出时显示省略号 */
|
||||
}
|
||||
}
|
||||
|
||||
.goods-item-content-stock {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.goods-item-content-stock-desc {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.goods-item-content-status-desc {
|
||||
font-size: 26rpx;
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
|
||||
.goods-item-content-footer {
|
||||
padding: 6rpx 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
// width: 100%;
|
||||
// flex-direction: row;
|
||||
|
||||
.goods-item-content-footer-btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 10rpx;
|
||||
|
||||
.share-btn {
|
||||
border-radius: 50rpx;
|
||||
border: 2rpx solid red;
|
||||
font-size: 26rpx;
|
||||
align-items: center;
|
||||
height: 54rpx;
|
||||
color: red;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.filter-types {
|
||||
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
overflow: auto;
|
||||
gap: 10rpx;
|
||||
padding: 10rpx;
|
||||
// position: fixed;
|
||||
// top: 0;
|
||||
height: 60rpx;
|
||||
// z-index: 9999;
|
||||
background-color: #fff;
|
||||
border-bottom: 2rpx solid gainsboro;
|
||||
border-top: 2rpx solid gainsboro;
|
||||
|
||||
.filter-type-inner {
|
||||
align-items: center;
|
||||
background-color: rgba(0, 0, 0, .05);
|
||||
border-radius: 16rpx;
|
||||
box-sizing: border-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
flex: 0 0 auto;
|
||||
font-size: 28rpx;
|
||||
gap: 15rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
|
||||
// image {
|
||||
// height: 22px;
|
||||
// width: 22px;
|
||||
// }
|
||||
}
|
||||
|
||||
.filter-type-inner.active {
|
||||
background-color: rgba(250, 44, 25, .1);
|
||||
color: var(--nutui-color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-container {
|
||||
display: flex;
|
||||
|
||||
.tab-pane-inner {
|
||||
height: 600rpx;
|
||||
}
|
||||
|
||||
.tabs-inner {
|
||||
overflow-y: scroll;
|
||||
height: 600rpx;
|
||||
width: 160rpx;
|
||||
background-color: #F5F5F5;
|
||||
|
||||
.tab-inner {
|
||||
display: flex;
|
||||
height: 60rpx;
|
||||
padding: 10rpx;
|
||||
font-size: 28rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #F5F5F5;
|
||||
|
||||
text {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.tab-inner-active {
|
||||
// background: #FFF;
|
||||
background-color: rgba(250, 44, 25, .1);
|
||||
color: var(--nutui-color-primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.degree-inner {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-wrap: wrap;
|
||||
// gap: 20rpx;
|
||||
gap: 10rpx;
|
||||
// padding: 11px;
|
||||
width: 100%;
|
||||
margin-bottom: 60rpx;
|
||||
}
|
||||
|
||||
.degree-item {
|
||||
align-items: center;
|
||||
background-color: rgba(0, 0, 0, .05);
|
||||
border-radius: 10rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex: 0 0 auto;
|
||||
font-size: 26rpx;
|
||||
gap: 10rpx;
|
||||
justify-content: center;
|
||||
min-height: 80rpx;
|
||||
width: calc(50% - 10rpx);
|
||||
}
|
||||
|
||||
.degree-item.active {
|
||||
background-color: rgba(250, 44, 25, .1);
|
||||
color: var(--nutui-color-primary);
|
||||
}
|
||||
|
||||
.product-btns {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
padding: 20rpx 0;
|
||||
|
||||
// border-bottom: 2rpx solid gainsboro;
|
||||
// border-top: 2rpx solid gainsboro;
|
||||
|
||||
.reset {
|
||||
flex: 1;
|
||||
|
||||
}
|
||||
|
||||
.confirm {
|
||||
flex: 2;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.degree-btns {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
|
||||
.reset {
|
||||
flex: 1;
|
||||
/* 重置按钮占 1 份 */
|
||||
}
|
||||
|
||||
.confirm {
|
||||
flex: 2;
|
||||
/* 确认按钮占 2 份 */
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.main-nav-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.nav-button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 45%;
|
||||
height: 160rpx;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
|
||||
.phone-button {
|
||||
background: linear-gradient(135deg, #6a5ae0, #8d7bfb);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.parts-button {
|
||||
background: linear-gradient(135deg, #ff6b6b, #ee5253);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.nav-button-bg {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
width: 50%;
|
||||
opacity: 0.2;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.nav-button-icon {
|
||||
width: 90rpx;
|
||||
height: 90rpx;
|
||||
margin-right: 20rpx;
|
||||
// border-radius: 20rpx;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.nav-button-content {
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.nav-button-title {
|
||||
font-size: 34rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.nav-button-desc {
|
||||
font-size: 24rpx;
|
||||
opacity: 0.85;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,188 +0,0 @@
|
||||
<template>
|
||||
<view class="page-content">
|
||||
<nut-steps :current="detail.progress">
|
||||
<nut-step title="待付款">1</nut-step>
|
||||
<nut-step title="待发货">2</nut-step>
|
||||
<nut-step title="待收货">3</nut-step>
|
||||
<nut-step title="已完成">4</nut-step>
|
||||
</nut-steps>
|
||||
|
||||
<nut-cell-group>
|
||||
<nut-cell>
|
||||
<view class="address-inner" v-if="detail.address_info">
|
||||
<text>{{detail.address_info.user_name}} - {{detail.address_info.tel_number}}</text>
|
||||
<text>{{detail.address_info.province_name + detail.address_info.city_name + detail.address_info.county_name + detail.address_info.street_name + detail.address_info.detail_info_new}}</text>
|
||||
</view>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
|
||||
|
||||
<nut-cell-group>
|
||||
<nut-cell v-for="(goods,index) in detail.goods" :key="index" center
|
||||
@click="navigateTo('/pages/mall/detail?id=' + goods.goods_id)">
|
||||
<template #title>
|
||||
<view class="goods-info-row">
|
||||
<view class="left-text">
|
||||
<view class="goods-name">
|
||||
<nut-tag custom-color="#1a1a1a">{{goods.snapshot_info.degree.degree_name}}</nut-tag>
|
||||
<text style="margin-left: 10rpx;">{{goods.goods_name}}</text>
|
||||
</view>
|
||||
<text class="goods-no">串号：{{goods.goods_no}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template #link>
|
||||
<nut-price :price="goods.goods_price" size="small" :need-symbol="true" />
|
||||
</template>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
|
||||
|
||||
|
||||
<nut-cell-group>
|
||||
<nut-cell>
|
||||
<view class="total-price-inner">
|
||||
<text>商品总额</text>
|
||||
<nut-price :price="detail.pay_price" size="normal" :need-symbol="true" />
|
||||
</view>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
|
||||
<nut-cell-group>
|
||||
<nut-cell title="订单编号" :desc="detail.order_no" />
|
||||
<nut-cell title="下单时间" :desc="detail.create_time" />
|
||||
</nut-cell-group>
|
||||
|
||||
<nut-cell-group v-if="detail.progress >= 3">
|
||||
<nut-cell title="物流公司" :desc="detail.express_company" />
|
||||
<nut-cell title="物流单号" :desc="detail.express_no" />
|
||||
</nut-cell-group>
|
||||
|
||||
|
||||
<!-- <view v-if="detail.progress === 1 && !audit" class="wechat-img-inner">
|
||||
<nut-button type="primary" block @click="showPayImgs()">
|
||||
点我付款
|
||||
</nut-button>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onShow
|
||||
} from '@dcloudio/uni-app'
|
||||
import {
|
||||
fetchOrderDetail
|
||||
} from '@/api/order';
|
||||
import {
|
||||
navigateTo,
|
||||
} from '@/utils/helper';
|
||||
|
||||
|
||||
import {
|
||||
fetchGetConfig
|
||||
} from '@/api/config';
|
||||
|
||||
// 审核模式 默认开启 true
|
||||
const audit = ref(true);
|
||||
|
||||
// 订单ID
|
||||
const id = ref(0)
|
||||
// 订单详情
|
||||
const detail = reactive({})
|
||||
// 支付码
|
||||
const images = ref([]);
|
||||
|
||||
onLoad((options) => {
|
||||
id.value = options.id
|
||||
})
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* 页面显示生命周期钩子
|
||||
* 每次页面显示时都会执行
|
||||
*/
|
||||
onShow(() => {
|
||||
// 获取配置
|
||||
getConfig()
|
||||
// 获取订单详情
|
||||
fetchOrderDetail(id.value).then(res => {
|
||||
Object.assign(detail, res)
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
// 获取配置
|
||||
const getConfig = () => {
|
||||
fetchGetConfig().then(res => {
|
||||
console.log('getConfig=====>', res)
|
||||
audit.value = res.appConfig.is_audit == 1
|
||||
console.log(res.appConfig.pay_imgs);
|
||||
let pay_imgs = JSON.parse(res.appConfig.pay_imgs) || [];
|
||||
let wechat_imgs = JSON.parse(res.appConfig.wechat_imgs) || [];
|
||||
let pay_imgs_arr = pay_imgs.map(item => item.file_path) || [];
|
||||
let wechat_imgs_arr = wechat_imgs.map(item => item.file_path) || [];
|
||||
const merged_imgs_arr = pay_imgs_arr.concat(wechat_imgs_arr);
|
||||
images.value = merged_imgs_arr;
|
||||
})
|
||||
}
|
||||
|
||||
// // 显示支付码
|
||||
// const showPayImgs = () => {
|
||||
// if (images.value.length === 0) {
|
||||
// uni.showToast({
|
||||
// title: '暂无图片',
|
||||
// icon: 'none'
|
||||
// });
|
||||
// return;
|
||||
// }
|
||||
// console.log('preview images:', images);
|
||||
// uni.previewImage({
|
||||
// urls: images.value
|
||||
// });
|
||||
// }
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.page-content {
|
||||
min-height: 100vh;
|
||||
background-color: #f2f3f5;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.address-inner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.total-price-inner {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
// flex-direction: row;
|
||||
view:nth-child(2) {
|
||||
color: #fa2c19;
|
||||
}
|
||||
}
|
||||
|
||||
.wechat-img-inner {
|
||||
margin-top: 60rpx;
|
||||
padding: 0rpx 80rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
// gap: 5px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,632 +0,0 @@
|
||||
<template>
|
||||
<view class="page-content">
|
||||
<nut-dialog title="取消订单" content="确认取消吗?此操作不可恢复!" v-model:visible="visibleCancelOrderDialog"
|
||||
@cancel="visibleCancelOrderDialog = false" @ok="onClickCancelOrder" />
|
||||
|
||||
|
||||
<nut-dialog title="标记付款" content="确认标记吗?此操作不可恢复!" v-model:visible="visiblePayOrderDialog"
|
||||
@cancel="visiblePayOrderDialog = false" @ok="onClickPayOrder" />
|
||||
|
||||
|
||||
<nut-sticky>
|
||||
<nut-searchbar placeholder="请输入商品串号" clearable v-model="search_val" input-background="#eee"
|
||||
@search="onSearch" @clear="onClear">
|
||||
<template #rightout>
|
||||
<nut-button size="small" type="primary" @click="onSearch">搜索</nut-button>
|
||||
</template>
|
||||
</nut-searchbar>
|
||||
<nut-tabs v-model="current_tab_idx" background="#fff">
|
||||
<template #titles>
|
||||
<div class="title-list">
|
||||
<view v-for="(item,idx) in tabs_config" :key="idx" class="title-item"
|
||||
:class="{ 'tabs-active': idx === current_tab_idx }" @click="onChangeTab(item,idx)">
|
||||
<view class="nut-tabs__titles-item__text">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view class="item__line" />
|
||||
</view>
|
||||
</div>
|
||||
</template>
|
||||
</nut-tabs>
|
||||
</nut-sticky>
|
||||
|
||||
<z-paging ref="paging" :fixed="false" style="height: 88vh;" class="order-list" v-model="dataList"
|
||||
@query="apiFetchOrderList">
|
||||
|
||||
<view class="order-inner" v-for="(order,index) in dataList" :key="index">
|
||||
<view class="order-inner-header">
|
||||
<text>{{order.create_time}}</text>
|
||||
<nut-tag custom-color="#1a1a1a">{{getStatusText(order)}}</nut-tag>
|
||||
<!-- <text>{{order.order_no}}</text> -->
|
||||
</view>
|
||||
|
||||
<view class="goods-info-row" v-for="(goods,iidx) in order.goods" :key="iidx"
|
||||
@click="navigateToDetail(order.order_id)">
|
||||
<view class="left-text">
|
||||
<view class="goods-name">
|
||||
<nut-tag custom-color="#1a1a1a">{{goods.snapshot_info.degree.degree_name}}</nut-tag>
|
||||
<text style="margin-left: 10rpx;">{{goods.goods_name}}</text>
|
||||
</view>
|
||||
<text class="goods-no">串号：{{goods.goods_no}}</text>
|
||||
</view>
|
||||
<view class="price">
|
||||
<nut-price :price="goods.goods_price" size="small" :need-symbol="true" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="footer">
|
||||
<view class="order-inner-price">
|
||||
总计:<nut-price :price="order.total_price" size="normal" :need-symbol="true" />
|
||||
</view>
|
||||
<view class="order-inner-action" v-if="order.order_status.value === 10">
|
||||
<view style="margin-left:10rpx;">
|
||||
<!-- v-if="order.pay_status.value === 10 " -->
|
||||
<nut-button plain size="small" v-if="order.delivery_status.value !== 20 "
|
||||
@click="visibleCancelOrderDialog = true;current_cancel_order_id=order.order_id;">
|
||||
取消订单
|
||||
</nut-button>
|
||||
</view>
|
||||
|
||||
|
||||
<view style="margin-left:10rpx;">
|
||||
<nut-button type="primary" size="small"
|
||||
@click="visiblePayOrderDialog = true;current_pay_order_id=order.order_id;"
|
||||
v-if="order.pay_status.value === 10 && !audit">
|
||||
标记付款
|
||||
</nut-button>
|
||||
</view>
|
||||
|
||||
|
||||
<view style="margin-left:10rpx;">
|
||||
<nut-button type="primary" size="small" @click="onClickDeliveryOrder(order)"
|
||||
v-if="order.pay_status.value === 20 && order.delivery_status.value === 10">
|
||||
去发货
|
||||
</nut-button>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</z-paging>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- 弹出 -->
|
||||
<nut-popup :custom-style="{ height: '65%' }" v-model:visible="openDeliveryPopup" position="bottom"
|
||||
safe-area-inset-bottom @close="onCloseDeliveryPopup">
|
||||
<view>
|
||||
<view class="order-popup">
|
||||
<nut-cell-group>
|
||||
<nut-cell>
|
||||
<view class="address-inner" v-if="orderDetail.address_info">
|
||||
<text>
|
||||
{{orderDetail.address_info.user_name}} -
|
||||
{{orderDetail.address_info.tel_number}}
|
||||
</text>
|
||||
<text>
|
||||
{{orderDetail.address_info.province_name +
|
||||
orderDetail.address_info.city_name +
|
||||
orderDetail.address_info.county_name +
|
||||
orderDetail.address_info.street_name +
|
||||
orderDetail.address_info.detail_info_new}}
|
||||
</text>
|
||||
</view>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
<nut-cell-group>
|
||||
<nut-cell v-for="(goods,index) in orderDetail.goods" :key="index" center>
|
||||
<template #title>
|
||||
<view class="goods-info-row">
|
||||
<view class="left-text">
|
||||
<view class="goods-name">
|
||||
<nut-tag
|
||||
custom-color="#1a1a1a">{{goods.snapshot_info.degree.degree_name}}</nut-tag>
|
||||
<text style="margin-left: 10rpx;">{{goods.goods_name}}</text>
|
||||
</view>
|
||||
<text class="goods-no">串号：{{goods.goods_no}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template #link>
|
||||
<nut-price :price="goods.goods_price" size="small" :need-symbol="true" />
|
||||
</template>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
<nut-cell-group>
|
||||
<nut-cell>
|
||||
<view class="total-price-inner">
|
||||
<text>商品总额</text>
|
||||
<nut-price :price="orderDetail.pay_price" size="normal" :need-symbol="true" />
|
||||
</view>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
|
||||
<nut-cell-group>
|
||||
<nut-cell title="订单编号" :desc="orderDetail.order_no" />
|
||||
<nut-cell title="下单时间" :desc="orderDetail.create_time" />
|
||||
</nut-cell-group>
|
||||
|
||||
|
||||
<nut-form>
|
||||
<nut-form-item label="物流公司名称">
|
||||
<nut-input v-model="form.express_company" class="nut-input-text" placeholder="请输入物流公司"
|
||||
type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="物流单号">
|
||||
<nut-input v-model="form.express_no" class="nut-input-text" placeholder="请输入物流单号"
|
||||
type="text" />
|
||||
</nut-form-item>
|
||||
</nut-form>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="wechat-img-inner">
|
||||
<nut-button type="primary" block @click="deliveryOrder">
|
||||
确定发货
|
||||
</nut-button>
|
||||
</view>
|
||||
</view>
|
||||
</nut-popup>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onMounted,
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onShow
|
||||
} from '@dcloudio/uni-app';
|
||||
|
||||
|
||||
import {
|
||||
navigateTo,
|
||||
} from '@/utils/helper';
|
||||
import {
|
||||
fetchDeliveryOrder,
|
||||
fetchPayOrder,
|
||||
fetchCancelOrder,
|
||||
fetchOrderList,
|
||||
fetchReceiptOrder
|
||||
} from '@/api/order';
|
||||
|
||||
import {
|
||||
fetchGetConfig
|
||||
} from '@/api/config';
|
||||
|
||||
// 审核模式 默认开启 true
|
||||
const audit = ref(true);
|
||||
|
||||
// 支付码
|
||||
const images = ref([]);
|
||||
|
||||
|
||||
// 展示发货弹窗
|
||||
const openDeliveryPopup = ref(false)
|
||||
// 发货订单
|
||||
const orderDetail = reactive({})
|
||||
const form = reactive({
|
||||
order_id: 0,
|
||||
express_company: '',
|
||||
express_no: '',
|
||||
})
|
||||
|
||||
// 发货
|
||||
const deliveryOrder = () => {
|
||||
form.order_id = orderDetail.order_id
|
||||
console.log('form===>', form);
|
||||
fetchDeliveryOrder(form).then(res => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '发货成功'
|
||||
})
|
||||
onCloseDeliveryPopup()
|
||||
paging.value.reload();
|
||||
})
|
||||
}
|
||||
|
||||
// 打开发货弹窗
|
||||
const onClickDeliveryOrder = (order) => {
|
||||
console.log(order);
|
||||
Object.assign(orderDetail, order)
|
||||
openDeliveryPopup.value = true
|
||||
|
||||
}
|
||||
|
||||
// 关闭发货弹窗
|
||||
const onCloseDeliveryPopup = () => {
|
||||
// 重置 发货订单
|
||||
Object.assign(orderDetail, {})
|
||||
Object.assign(form, {
|
||||
order_id: 0,
|
||||
express_company: '',
|
||||
express_no: '',
|
||||
})
|
||||
openDeliveryPopup.value = false
|
||||
console.log("关闭");
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
// 默认tab
|
||||
const current_tab_idx = ref(0);
|
||||
// 定义tab切换
|
||||
const tabs_config = [{
|
||||
title: '进行中',
|
||||
status: 'all'
|
||||
},
|
||||
{
|
||||
title: '今日',
|
||||
status: 'payment'
|
||||
},
|
||||
{
|
||||
title: '昨日',
|
||||
status: 'delivery'
|
||||
},
|
||||
{
|
||||
title: '全部',
|
||||
status: 'received'
|
||||
},
|
||||
|
||||
]
|
||||
// 订单列表数据
|
||||
const dataList = ref([]);
|
||||
// zp
|
||||
const paging = ref(null);
|
||||
|
||||
|
||||
|
||||
|
||||
// 取消订单弹窗
|
||||
const visibleCancelOrderDialog = ref(false);
|
||||
// 被取消订单id
|
||||
const current_cancel_order_id = ref(0);
|
||||
|
||||
// 订单付款弹窗
|
||||
const visiblePayOrderDialog = ref(false);
|
||||
// 付款订单id
|
||||
const current_pay_order_id = ref(0);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// 搜索内容
|
||||
const search_val = ref('')
|
||||
// tab切换
|
||||
const onChangeTab = (item, idx) => {
|
||||
current_tab_idx.value = idx
|
||||
paging.value.reload();
|
||||
}
|
||||
|
||||
|
||||
// 获取配置
|
||||
const getConfig = () => {
|
||||
fetchGetConfig().then(res => {
|
||||
console.log('getConfig=====>', res)
|
||||
audit.value = res.appConfig.is_audit == 1
|
||||
console.log(res.appConfig.pay_imgs);
|
||||
let pay_imgs = JSON.parse(res.appConfig.pay_imgs) || [];
|
||||
let wechat_imgs = JSON.parse(res.appConfig.wechat_imgs) || [];
|
||||
let pay_imgs_arr = pay_imgs.map(item => item.file_path) || [];
|
||||
let wechat_imgs_arr = wechat_imgs.map(item => item.file_path) || [];
|
||||
const merged_imgs_arr = pay_imgs_arr.concat(wechat_imgs_arr);
|
||||
images.value = merged_imgs_arr;
|
||||
})
|
||||
}
|
||||
|
||||
// 显示支付码
|
||||
const showPayImgs = () => {
|
||||
if (images.value.length === 0) {
|
||||
uni.showToast({
|
||||
title: '暂无图片',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
console.log('preview images:', images);
|
||||
uni.previewImage({
|
||||
urls: images.value
|
||||
});
|
||||
}
|
||||
|
||||
// 跳转详情页面
|
||||
const navigateToDetail = (id) => {
|
||||
console.log(id);
|
||||
if (!id) {
|
||||
console.warn('导航ID不能为空')
|
||||
return
|
||||
}
|
||||
uni.navigateTo({
|
||||
url: `/pages/config/shopOrder/detail?id=${encodeURIComponent(id)}`
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 取消订单
|
||||
const onClickCancelOrder = () => {
|
||||
fetchCancelOrder(current_cancel_order_id.value).then(res => {
|
||||
uni.showToast({
|
||||
title: '取消成功',
|
||||
icon: 'none'
|
||||
})
|
||||
paging.value.reload();
|
||||
})
|
||||
}
|
||||
|
||||
// 标记付款
|
||||
const onClickPayOrder = () => {
|
||||
fetchPayOrder(current_pay_order_id.value).then(res => {
|
||||
uni.showToast({
|
||||
title: '标记付款成功',
|
||||
icon: 'none'
|
||||
})
|
||||
paging.value.reload();
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// 获取订单列表
|
||||
const apiFetchOrderList = (pageNo = 1, pageSize = 10) => {
|
||||
console.log(tabs_config[current_tab_idx.value]['status']);
|
||||
const params = {
|
||||
page: pageNo,
|
||||
pageSize: 10,
|
||||
status: tabs_config[current_tab_idx.value]['status'],
|
||||
goods_no: search_val.value,
|
||||
}
|
||||
fetchOrderList(params).then(res => {
|
||||
console.log(res);
|
||||
paging.value.complete(res.list);
|
||||
}).catch(res => {
|
||||
paging.value.complete(false);
|
||||
})
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
current_tab_idx.value = parseInt(options.tab)
|
||||
})
|
||||
|
||||
|
||||
/**
|
||||
* 页面显示生命周期钩子
|
||||
* 每次页面显示时都会执行
|
||||
*/
|
||||
onShow(() => {
|
||||
// 获取配置
|
||||
getConfig()
|
||||
if (paging.value) {
|
||||
// paging.value.pageNo = 1;
|
||||
paging.value.refresh();
|
||||
// paging.value.refreshToPage(1)
|
||||
// paging.value.reload();
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
// 搜索
|
||||
const onSearch = () => {
|
||||
console.log("搜索：", search_val.value);
|
||||
paging.value.reload();
|
||||
|
||||
}
|
||||
// 清空搜索框
|
||||
const onClear = () => {
|
||||
console.log("搜索：", search_val.value);
|
||||
paging.value.reload();
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 订单状态
|
||||
const getStatusText = (order) => {
|
||||
if (order.order_status.value == 20) {
|
||||
return order.order_status.text
|
||||
} else if (order.order_status.value == 30) {
|
||||
return order.order_status.text
|
||||
} else if (order.order_status.value == 10) {
|
||||
if (order.pay_status.value == 10) {
|
||||
return order.pay_status.text
|
||||
} else if (order.pay_status.value == 20) {
|
||||
if (order.delivery_status.value == 10) {
|
||||
return order.delivery_status.text
|
||||
} else if (order.delivery_status.value == 20) {
|
||||
return order.receipt_status.text
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style scoped lang="scss">
|
||||
.page-content {
|
||||
min-height: 100vh;
|
||||
background-color: #f2f3f5;
|
||||
}
|
||||
|
||||
.order-popup {
|
||||
|
||||
.address-inner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.total-price-inner {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
// flex-direction: row;
|
||||
view:nth-child(2) {
|
||||
color: #fa2c19;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.wechat-img-inner {
|
||||
margin-top: 60rpx;
|
||||
padding: 0rpx 80rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
// gap: 5px;
|
||||
}
|
||||
|
||||
|
||||
.order-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
||||
.order-inner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #fff;
|
||||
border-radius: 15rpx;
|
||||
overflow: hidden;
|
||||
margin: 20rpx;
|
||||
|
||||
.order-inner-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #dcdcdc;
|
||||
color: rgba(0, 0, 0, .5);
|
||||
font-size: 24rpx;
|
||||
justify-content: space-between;
|
||||
line-height: 45rpx;
|
||||
padding: 15rpx 20rpx;
|
||||
}
|
||||
|
||||
|
||||
/* 信息行布局 */
|
||||
.goods-info-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20rpx;
|
||||
border-bottom: 2rpx solid #f2f3f5;
|
||||
|
||||
/* 左侧文字样式 */
|
||||
.left-text {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.goods-name {
|
||||
font-size: 30rpx;
|
||||
color: #000000;
|
||||
display: block;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.goods-no {
|
||||
font-size: 26rpx;
|
||||
color: #000000;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* 右侧价格样式 */
|
||||
.price {
|
||||
margin-left: 20rpx;
|
||||
align-self: center;
|
||||
/* 垂直居中在两行文字之间 */
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.order-inner-price {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding-top: 10rpx;
|
||||
padding-right: 20rpx;
|
||||
padding-bottom: 20rpx;
|
||||
font-size: 24rpx;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.order-inner-action {
|
||||
display: flex;
|
||||
padding-top: 10rpx;
|
||||
padding-bottom: 30rpx;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.title-list {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
|
||||
.title-item {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.tabs-active {
|
||||
font-weight: bold;
|
||||
color: $tabs-titles-item-active-color;
|
||||
opacity: $tabs-titles-item-line-opacity;
|
||||
transition: width 0.3s ease;
|
||||
|
||||
.item__line {
|
||||
position: absolute;
|
||||
bottom: -10%;
|
||||
left: 50%;
|
||||
overflow: hidden;
|
||||
content: ' ';
|
||||
border-radius: $tabs-titles-item-line-border-radius;
|
||||
opacity: $tabs-titles-item-line-opacity;
|
||||
transition: width 0.3s ease;
|
||||
transform: translate(-50%, 0);
|
||||
width: $tabs-horizontal-titles-item-active-line-width;
|
||||
height: 3px;
|
||||
content: ' ';
|
||||
background: $tabs-horizontal-tab-line-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,318 +0,0 @@
|
||||
<template>
|
||||
|
||||
<view class="page-content">
|
||||
<view style=" padding: 20rpx;">
|
||||
|
||||
<nut-cell-group>
|
||||
<nut-cell v-if="!form.address_info?.address_id" title="收货地址" is-link @click="chooseAddress"></nut-cell>
|
||||
<nut-cell v-else :title="form.address_info.user_name + ' ' + form.address_info.tel_number" is-link
|
||||
:sub-title="
|
||||
form.address_info.province_name +
|
||||
form.address_info.city_name +
|
||||
form.address_info.county_name +
|
||||
form.address_info.street_name +
|
||||
form.address_info.detail_info_new
|
||||
" @click="chooseAddress"></nut-cell>
|
||||
</nut-cell-group>
|
||||
|
||||
|
||||
<view class="wechat-img-inner">
|
||||
<nut-button type="primary" block @click="saveAddress()">
|
||||
保存收货地址
|
||||
</nut-button>
|
||||
</view>
|
||||
|
||||
<nut-form>
|
||||
<nut-form-item label="商城名称">
|
||||
<nut-input v-model="form.shop_name" class="nut-input-text" placeholder="请输入店铺名称" type="text" />
|
||||
</nut-form-item>
|
||||
<nut-form-item label="商城介绍">
|
||||
<nut-textarea v-model="form.shop_desc" autosize placeholder="请输入店铺介绍" type="text" />
|
||||
</nut-form-item>
|
||||
<nut-form-item label="手机号码">
|
||||
<nut-input v-model="form.shop_phone" class="nut-input-text" placeholder="请输入手机号码" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<nut-form-item label="首页公告">
|
||||
<nut-textarea v-model="form.bulletin_txt" autosize placeholder="请输入首页公告" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="服务描述">
|
||||
<nut-textarea v-model="form.service_txt" autosize placeholder="请输入服务描述" type="text" />
|
||||
</nut-form-item>
|
||||
<nut-form-item label="是否审核模式">
|
||||
<nut-switch v-model="isAudit" @change="onIsAuditChange" />
|
||||
<!-- <nut-switch v-model:modelValue="isAudit" @change="onIsAuditChange" /> -->
|
||||
</nut-form-item>
|
||||
<nut-form-item v-if="isBucket">
|
||||
<template v-slot:label>收款二维码</template>
|
||||
<template v-slot:default>
|
||||
<shmily-drag-image v-model="form.pay_imgs" :number=9 :add-image="addPayImg"
|
||||
keyName="file_path"></shmily-drag-image></template>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item v-if="isBucket">
|
||||
<template v-slot:label>微信二维码</template>
|
||||
<template v-slot:default>
|
||||
<shmily-drag-image v-model="form.wechat_imgs" :number=9 :add-image="addWechatImg"
|
||||
keyName="file_path"></shmily-drag-image></template>
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<view style="align-items: center;text-align: center; padding: 20rpx 80rpx;">
|
||||
<nut-button type="primary" block @click="onSubmit">
|
||||
保存配置
|
||||
</nut-button>
|
||||
</view>
|
||||
</nut-form>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onMounted,
|
||||
reactive,
|
||||
ref,
|
||||
toValue
|
||||
} from 'vue';
|
||||
import {
|
||||
fetchGetConfig,
|
||||
fetchSetConfig,
|
||||
} from '@/api/config';
|
||||
import {
|
||||
getUploadImageUrl
|
||||
} from '@/api/request';
|
||||
|
||||
import {
|
||||
houseFetchUpdateAddress
|
||||
} from '@/api/house_order';
|
||||
|
||||
|
||||
|
||||
const isBucket = ref(false);
|
||||
// 是否开启审核模式
|
||||
const isAudit = ref(false)
|
||||
|
||||
const form = reactive({
|
||||
shop_name: '',
|
||||
shop_desc: '',
|
||||
shop_phone: '',
|
||||
is_audit: 0,
|
||||
bulletin_txt: '',
|
||||
service_txt: '',
|
||||
pay_imgs: [],
|
||||
wechat_imgs: [],
|
||||
address_info: {}
|
||||
})
|
||||
|
||||
|
||||
// 是否开启整仓调价
|
||||
const onIsAuditChange = (val) => {
|
||||
form.is_audit = Number(isAudit.value)
|
||||
console.log(form);
|
||||
}
|
||||
|
||||
|
||||
const chooseAddress = () => {
|
||||
uni.chooseAddress({
|
||||
success(res) {
|
||||
console.log(res);
|
||||
form.address_info = {
|
||||
address_id: res.addressID || 1,
|
||||
user_name: res.userName,
|
||||
tel_number: res.telNumber,
|
||||
city_name: res.cityName || '',
|
||||
county_name: res.countyName || '',
|
||||
detail_info: res.detailInfo || '',
|
||||
detail_info_new: res.detailInfoNew || '',
|
||||
national_code: res.nationalCode || '',
|
||||
national_code_full: res.nationalCodeFull || '',
|
||||
postal_code: res.postalCode || '',
|
||||
province_name: res.provinceName || '',
|
||||
street_name: res.streetName || '',
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
// 获取配置
|
||||
const getConfig = () => {
|
||||
fetchGetConfig().then(res => {
|
||||
console.log('res=====>', res)
|
||||
form.shop_name = res.appConfig.shop_name
|
||||
form.shop_desc = res.appConfig.shop_desc
|
||||
form.shop_phone = res.appConfig.shop_phone
|
||||
|
||||
form.bulletin_txt = res.appConfig.bulletin_txt
|
||||
form.service_txt = res.appConfig.service_txt
|
||||
|
||||
|
||||
form.address_info = res.appConfig.address_info
|
||||
|
||||
form.is_audit = res.appConfig.is_audit
|
||||
isAudit.value = res.appConfig.is_audit == 1
|
||||
|
||||
if (res.appConfig.bucket) {
|
||||
isBucket.value = true
|
||||
}
|
||||
let pay_imgs = JSON.parse(res.appConfig.pay_imgs)
|
||||
let wechat_imgs = JSON.parse(res.appConfig.wechat_imgs)
|
||||
pay_imgs.forEach(item => {
|
||||
form.pay_imgs.push({
|
||||
id: item.image_id,
|
||||
file_path: item.file_path,
|
||||
})
|
||||
})
|
||||
wechat_imgs.forEach(item => {
|
||||
form.wechat_imgs.push({
|
||||
id: item.image_id,
|
||||
file_path: item.file_path,
|
||||
})
|
||||
})
|
||||
console.log('form=====>', form)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
const onSubmit = () => {
|
||||
fetchSetConfig(form).then(res => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '更新商城配置成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.redirectTo({
|
||||
url: '/pages/config/store',
|
||||
success: res => {},
|
||||
fail: () => {},
|
||||
complete: () => {}
|
||||
});
|
||||
}, 500)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 保存收货地址
|
||||
const saveAddress = () => {
|
||||
houseFetchUpdateAddress({
|
||||
address: form.address_info,
|
||||
}).then(res => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '保存收货地址成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.redirectTo({
|
||||
url: '/pages/config/store',
|
||||
success: res => {},
|
||||
fail: () => {},
|
||||
complete: () => {}
|
||||
});
|
||||
}, 500)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
getConfig()
|
||||
})
|
||||
|
||||
// 上传支付图片
|
||||
const addPayImg = () => {
|
||||
uni.chooseImage({
|
||||
count: 9 - (form.pay_imgs.length || 0),
|
||||
sourceType: ['album', 'camera'],
|
||||
success: res => {
|
||||
res.tempFiles.forEach(file => {
|
||||
uni.uploadFile({
|
||||
url: getUploadImageUrl(),
|
||||
filePath: file.path,
|
||||
name: 'iFile',
|
||||
formData: {
|
||||
group_id: 1,
|
||||
},
|
||||
success: (res) => {
|
||||
let data = JSON.parse(res.data).data
|
||||
form.pay_imgs.push({
|
||||
id: parseInt(data.file_id),
|
||||
file_path: data.file_path,
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 上传微信图片
|
||||
const addWechatImg = () => {
|
||||
uni.chooseImage({
|
||||
count: 9 - (form.wechat_imgs.length || 0),
|
||||
sourceType: ['album', 'camera'],
|
||||
success: res => {
|
||||
res.tempFiles.forEach(file => {
|
||||
uni.uploadFile({
|
||||
url: getUploadImageUrl(),
|
||||
filePath: file.path,
|
||||
name: 'iFile',
|
||||
formData: {
|
||||
group_id: 1,
|
||||
},
|
||||
success: (res) => {
|
||||
let data = JSON.parse(res.data).data
|
||||
form.wechat_imgs.push({
|
||||
id: parseInt(data.file_id),
|
||||
file_path: data.file_path,
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page-content {
|
||||
min-height: 100vh;
|
||||
background-color: #f2f3f5;
|
||||
|
||||
}
|
||||
|
||||
.wechat-img-inner {
|
||||
// margin-top: 60rpx;
|
||||
padding: 0rpx 80rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
// gap: 5px;
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
background: #ffffff;
|
||||
align-items: center;
|
||||
max-height: 300rpx;
|
||||
overflow-y: scroll;
|
||||
padding: 10px;
|
||||
|
||||
.list-item {
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 20rpx 10rpx;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user