积分商城

This commit is contained in:
2024-03-28 09:43:43 +08:00
parent 8d314157fe
commit de92031284
11 changed files with 1301 additions and 156 deletions

View File

@@ -0,0 +1,49 @@
import request from '@/utils/request'
export default{
productByPage(data) { // 商品分页查询
return request({
url: `/oil-mall/mobile/productByPage`,
method: 'post',
data
})
},
getTopInfo() { // 获取头部信息
return request({
url: `/oil-mall/mobile/getTopInfo`,
method: 'get',
})
},
productStatus(data) { // 上下架接口
return request({
url: `/oil-mall/mobile/productStatus`,
method: 'post',
data
})
},
productAuditHistory(data) { // 审核信息接口
return request({
url: `/oil-mall/mobile/productAuditHistory`,
method: 'post',
data
})
},
classification() { // 商品分类-树形接口
return request({
url: `/oil-mall/mobile/classification`,
method: 'get',
})
},
getProductBrands() { // 品牌信息接口
return request({
url: `/oil-mall/mobile/getProductBrands`,
method: 'get',
})
},
getAttributesType() { // 属性类型接口
return request({
url: `/oil-mall/mobile/getAttributesType`,
method: 'get',
})
},
}

View File

@@ -19,7 +19,7 @@
pidkey: { default: 'pid' }, // 对应父id取值
placeholder: { default: '请选择' },
emitPath: { default: false, type: Boolean }, // 是否子父级关联 是的时候返回的是逗号分隔的父子code
level: { default: 3, type: Number } // 列数 2或者3
level: { default: 2, type: Number } // 列数 2或者3
},
data() {
return {
@@ -30,7 +30,6 @@
},
methods: {
handleColumnChange(e) {
let columnindex = e.detail.value; // 拖动列索引
switch (e.detail.column) {
case 0: //拖动第1列
@@ -75,7 +74,6 @@
}
let code = codeArr.join(',');
this.name = nameArr.join('/');
console.log('code1',code);
this.$emit('input', code)
}else {
@@ -89,7 +87,6 @@
this.name = curArr[multiIndex[1]][this.rangekey];
}
console.log('code2',code);
this.$emit('input', code)
}
},
@@ -151,15 +148,16 @@
list: {
immediate: true,
handler(val) {
console.log(val)
if(JSON.stringify(val) != '[]'){
this.dataInit();
this.initName();
}
}
},
value: {
// immediate: true,
handler(val) {
console.log(val)
this.initName();
}
},

View File

@@ -5,39 +5,44 @@
<block slot="content">新增商品</block>
</cu-custom>
<view id="chooseType" :class="currentBoxId == 'chooseType' ? 'show' : 'hidden'">
<uni-forms ref="productForm" :modelValue="productDate" label-width="200rpx">
<uni-forms ref="productForm" :modelValue="productDate" :rules="rules" label-width="200rpx">
<uni-forms-item label="商品分类:" name="name">
<mulpicker
v-model="productDate.demandRegion"
:list="productList"
rangekey="name"
rangekey="categoryName"
code="id"
pidkey="pid"
childkey="city"
pidkey="id"
childkey="classificationTwoList"
:emitPath="true"
:level="2"
:placeholder="'选择商品分类'"
/>
<uni-icons color="#666666" type="right" size="22" style="position: absolute;right: 0;top: 10rpx;"></uni-icons>
</uni-forms-item>
<uni-forms-item label="商品名称:" name="age">
<input type="text" v-model="productDate.age" placeholder="请输入" />
<uni-forms-item label="商品名称:" name="productName">
<input type="text" v-model="productDate.productName" placeholder="请输入商品名称" />
</uni-forms-item>
<uni-forms-item label="关键词:" name="age">
<input type="text" v-model="productDate.age" placeholder="请输入" />
<uni-forms-item label="关键词:" name="keyword">
<input type="text" v-model="productDate.keyword" placeholder="请输入关键词(空格分隔)" />
</uni-forms-item>
<uni-forms-item label="商品品牌:" name="age">
<input type="text" v-model="productDate.age" placeholder="请输入" />
<uni-forms-item label="商品品牌:" name="brandId">
<!-- <input type="text" v-model="productDate.brandId" placeholder="请输入商品品牌" /> -->
<uni-data-select
v-model="productDate.brandId"
:localdata="brandIdList"
placeholder="请选择商品品牌"
></uni-data-select>
</uni-forms-item>
<uni-forms-item label="商品售价:" name="age">
<input type="text" v-model="productDate.age" placeholder="请输入" />
<uni-forms-item label="商品售价:" name="price">
<input type="text" v-model="productDate.price" placeholder="请输入商品售价" />
</uni-forms-item>
<uni-forms-item label="商品上架:" name="age">
<switch color="#FE0606" checked style="transform:scale(0.7)" />
<uni-forms-item label="商品上架:" name="productStatus">
<switch v-model="productDate.productStatus" color="#FE0606" checked style="transform:scale(0.7)" />
</uni-forms-item>
<uni-forms-item label="商品推荐:" name="age">
<view class='checkbox-con'>
<radio-group @change="checkboxChange">
<radio-group>
<label :class="item.checked?'checkbox checked':'checkbox'" @click="checkbox(index)" v-for="(item, index) in radioItem" :key="item.value">
<checkbox :value="item.value" :checked="item.checked"/>{{item.name}}
</label>
@@ -53,7 +58,75 @@
<view id="instruction" :class="currentBoxId == 'instruction' ? 'show' : 'hidden'">
<productAddStep2 />
<!-- <productAddStep2 /> -->
<uni-forms :modelValue="productDate" label-width="200rpx">
<uni-forms-item label="属性类别:" >
<uni-data-select
v-model="productDate.attributesTypeId"
:localdata="attributesTypeList"
placeholder="请选择商品品牌"
@change="attributesData"
></uni-data-select>
</uni-forms-item>
<view class="content" v-show="productDate.attributesTypeId">
<view>商品类型</view>
<view>
<uni-section type="line">
<view class="uni-px-5" v-for="(item,index) in attributesList">
<view style="display: inline-block;">{{item.attributeName}}</view>
<view style="display: inline-block;">
<uni-data-checkbox v-if="index==0" mode="tag" v-model="radioAttributes" :localdata="item.attributesList"></uni-data-checkbox>
<uni-data-checkbox v-else-if="index!=0" mode="tag" multiple v-model="checkboxAttributes" :localdata="hobby"></uni-data-checkbox>
</view>
</view>
</uni-section>
</view>
</view>
<view>
<view>批量填充<text style="color: #999999;">批量填充填入信息后可以批量将内容填写到SKU 信息里</text></view>
<view class="tagButton" v-for="item in bottonList">{{item.label}}</view>
<view class="redButton">确定</view>
</view>
<view v-if="productDate.attributesTypeId&&checkboxAttributes.length>0" v-for="(items,index) in checkboxAttributes">
<view>
<text style="color: red;">*</text>
<text>规格</text>
<text>{{radioAttributes}}+{{items}}</text>
</view>
<view class="tagButton" v-for="items in bottonList">{{item.label}}</view>
<view style="display: inline-block;" @click="deleteCheckAll(index)">删除</view>
</view>
<view v-if="productDate.attributesTypeId&&radioAttributes" >
<view>
<text style="color: red;">*</text>
<text>规格</text>
<text>{{radioAttributes}}</text>
</view>
<view class="tagButton" v-for="item in bottonList">{{item.label}}</view>
<view style="display: inline-block;" @click="deleteRadio">删除</view>
</view>
<view>
<view>
<text style="color: red;">*</text>
商品图片<text style="color: #999999;">最多可上传10张图片</text></view>
<view>
<view class="imageBlack">商品主图</view>
<view class="imageBlack">设为主图</view>
<view class="imageBlack" @tap="srcFileImage">
<view style="cameraImage">
<uni-icons type="camera-filled" size="30"></uni-icons>
</view>
</view>
</view>
</view>
<view>
<view>详情图片<text style="color: #999999;">最多可上传10张图片</text></view>
<view></view>
</view>
</uni-forms>
<view class="buttons">
<view id="previous" @click="changeBox">上一步</view>
<view @click="addCompleted">完成</view>
@@ -67,7 +140,8 @@
</template>
<script>
import serve from '@/api/packageIntegral/orderList.js'
import utils from '@/utils/encode'
import serve from '@/api/packageIntegral/productList.js'
import mulpicker from '@/packageIntegral/components/mulpicker.vue'
import productAddStep2 from '@/packageIntegral/productAddition/productAddStep2.vue'
export default {
@@ -80,60 +154,88 @@
currentBoxId: 'instruction', //当前显示的view的id
isBoxShow: false,
productDate:{},
productList:[{
"name": "北京市",
'id':'0',
"city": [{
'name':"东城区",
'id':'1',
},{
'name':"西城区",
'id':'2',
},{
'name':"崇文区",
'id':'3',
},{
'name':"宣武区",
'id':'4',
},{
'name':"朝阳区",
'id':'5',
}
]
}],
productList:[],
brandIdList:[],
radioItem:[{
name: '新品',
checked: true
}, {
name: '推荐',
checked: false
}]
}],
rules:{
name:{rules:[{required: true,errorMessage: '请选择商品分类'}]},
productName:{rules:[{required: true,errorMessage: '请输入商品名称'}]},
brandId:{rules:[{required: true,errorMessage: '请输入商品品牌'}]},
price:{rules:[{required: true,errorMessage: '请输入商品售价'}]},
},
attributesTypeList:[],
attributesList:[],
bottonList:[
{label:'市场价格',value:'marketPrice'},
{label:'销售价格',value:'sellPrice'},
{label:'商品库存',value:'stock'},
{label:'兑换积分',value:'integral'}
],
radioAttributes:'',
checkboxAttributes:[]
}
},
onLoad(options) {
// this.get(options.orderId)
this.classfication()
this.getProductBrands()
this.getAttributesType()
},
watch:{
'productDate.demandRegion'(val){
if(val){
this.productDate.categoryOneId = val.split(',')[0]
this.productDate.categoryTwoId = val.split(',')[1]
}
}
},
methods: {
classfication(){
serve.classification().then(res=>{
this.productList = res.data
})
},
getProductBrands(){
this.brandIdList = []
serve.getProductBrands().then(res=>{
console.log(res)
res.data.forEach(tab=>{
this.brandIdList.push({value:tab.id,text:tab.brandName})
})
})
},
checkbox (e) {
console.log(e)
var index = e;//获取当前点击的下标
var checkboxArr = this.radioItem;//选项集合
if (checkboxArr[index].checked) return;//如果点击的当前已选中则返回
checkboxArr.forEach(item => {
item.checked = false
})
// if (checkboxArr[index].checked) return;//如果点击的当前已选中则返回
// checkboxArr.forEach(item => {
// item.checked = false
// })
if(checkboxArr[index].checked ==false){
checkboxArr[index].checked = true; //改变当前选中的checked值
// this.setData({
// checkboxArr: checkboxArr
// });
},
checkboxChange (e) {
var checkValue = e.detail.value;
// this.setData({
// checkValue: checkValue
// });
}else {
checkboxArr[index].checked = false; //改变当前选中的checked值
}
if(checkboxArr[0].checked ==true){
this.productDate.newMark = 1
}else{
this.productDate.newMark = 2
}
if(checkboxArr[1].checked ==true){
this.productDate.recommend = 1
}else{
this.productDate.recommend = 2
}
},
changeBox(e){
let currentFlag = e.currentTarget.id;
@@ -148,6 +250,153 @@
this.currentBoxId = 'viewInstruction'
break;
}
if(currentFlag == 'next'){
this.getAttributesType()
}
},
getAttributesType(){
this.attributesTypeList = []
serve.getAttributesType().then(res=>{
res.data.forEach(tab=>{
this.attributesTypeList.push({
value:tab.id,
text:tab.name,
number:tab.number,
attributesList:tab.attributesList
})
})
})
},
attributesData(){
if(this.productDate.attributesTypeId){
this.attributesTypeList.forEach(tab=>{
if(tab.id = this.productDate.attributesTypeId){
this.attributesList = tab.attributesList
this.attributesList.forEach(tab=>{
tab.attributesList = []
tab.attributeContent.split(',').forEach(item=>{
tab.attributesList.push({value:item,text:item})
})
})
}
})
}else{
this.attributesList = []
}
},
deleteCheckAll(i){
if(this.checkboxAttributes.length>1){
this.checkboxAttributes.splice(i,1)
}else{
this.checkboxAttributes.splice(i,1)
this.radioAttributes = ''
}
},
deleteRadio(){
this.radioAttributes = ''
},
// 调用系统相机
takePhoto() {
// 先检查权限
let _that = this
uni.getSetting({
success(res) {
if (!res.authSetting['scope.camera']) {
// 请求权限
uni.authorize({
scope: 'scope.camera',
success() {
// 权限已经获取,可以调用相机
_that.srcFileImage()
},
fail() {
// 用户拒绝授权,需引导用户开启权限
uni.showModal({
title: '提示',
content: '需要相机权限才能使用相机功能,请在设置中打开',
success: (modalRes) => {
if (modalRes.confirm) {
// 引导用户去设置中打开权限
wx.openSetting({
success(res) {
if (res.authSetting['scope.camera']) {
re()
// 授权成功,重新定位
} else {
// 没有允许定位权限
wx.showToast({
title: '您拒绝了相机权限,将无法使用相机功能',
icon: 'none'
});
rj('拒绝了相机权限')
}
},
fail() {
rj('openSetting调用失败')
}
})
}
},
});
},
});
} else {
// 权限已经获取,可以直接调用相机
_that.srcFileImage()
}
},
fail(err) {
// 获取设置失败
console.error(err);
},
});
},
//调起上传图片
srcFileImage() {
let _that = this
uni.chooseImage({
count: 10, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: ['album'], //从相册选择
success: function(res) {
console.log(res)
console.log('进入1')
const JSESSIONID = utils.uuid()
uni.uploadFile({
url: 'http://uat.xingoil.com/adminapi/oil-oss/obejct/uploadFile',
filePath: res.tempFilePaths[0],
formData: {
ossKey: 'xingyou',
pathKey: 'publicxingyou',
encrypt: 'PUBLIC',
},
name: 'file',
header: {
"Content-Type": "multipart/form-data",
"Authorization": uni.getStorageSync('Authorization'),
'dataSources': 'MP',
"imei": uni.getStorageSync('unionid'),
"openId": uni.getStorageSync('openid'),
'JSESSIONID': JSESSIONID,
'token': utils.md5Salt(JSESSIONID)
},
success(e) {
console.log('进入2')
console.log(e)
let obj = JSON.parse(e.data),
url = obj.data.publicUrl
console.log(obj.data.publicUrl)
},
fail(err) {
console.log(err)
}
})
},fail() {
console.log('相机调用失败')
}
})
},
picker2(e){
console.log(e.detail.value)
@@ -181,6 +430,12 @@
/deep/ .uni-forms{
width: 100%;
}
.content{
font-size: 28rpx;
font-weight: bold;
}
/deep/ .uni-forms-item{
width: 100%;
}
@@ -208,6 +463,68 @@
content: '';
}
}
#instruction{
padding: 30rpx;
mulpicker{
height: 72rpx;
line-height: 72rpx;
}
/deep/ .uni-forms{
width: 100%;
}
/deep/ .uni-forms-item{
width: 100%;
}
/deep/ .uni-forms-item__label{
color: #333 !important;
font-size: 30rpx;
font-weight: 700;
}
/deep/ .uni-forms-item__content{
width: 100%;
input{
height: 72rpx;
line-height: 72rpx;
}
}
.tagButton{
display: inline-block;
width: 133rpx;
height: 58rpx;
background: #f5f5f5;
color: #666666;
border-radius: 8rpx;
line-height: 58rpx;
text-align: center;
margin: 8rpx;
}
.redButton{
display: inline-block;
width: 84rpx;
height: 58rpx;
background: red;
color: #fff;
border-radius: 10rpx;
line-height: 58rpx;
text-align: center;
}
.imageBlack{
display: inline-block;
width: 140rpx;
height: 140rpx;
line-height: 140rpx;
// position: relative;
.cameraImage{
// position: absolute;
// left: 70rpx;
// top: 70rpx;
}
}
}
.checkbox-con{
margin-top: 40rpx;
text-align: center;

View File

@@ -3,14 +3,50 @@
<view class="body">
<view class="bodyContent">
<view class="bodyLabel">属性类型</view>
<view class="bodyItem">
<uni-data-select
v-model="value"
:localdata="range"
@change="change"
></uni-data-select>
<uni-collapse ref="collapse">
<uni-collapse-item title="属性类型:" style="width: 700rpx;">
<view class="content">
<view>商品类型</view>
<view>
<uni-section type="line">
<view class="uni-px-5">
<view style="display: inline-block;">尺码</view>
<uni-data-checkbox mode="tag" v-model="radio" :localdata="range"></uni-data-checkbox>
</view>
<view class="uni-px-5 uni-pb-5">
<view style="display: inline-block;">颜色</view>
<uni-data-checkbox mode="tag" multiple v-model="checkbox" :localdata="hobby"></uni-data-checkbox>
</view>
</uni-section>
</view>
</view>
</uni-collapse-item>
</uni-collapse>
</view>
<view>
<view>批量填充<text style="color: #999999;">批量填充填入信息后可以批量将内容填写到SKU 信息里</text></view>
<view class="tagButton" v-for="item in bottonList">{{item.label}}</view>
<view class="redButton">确定</view>
</view>
<view>
<view>
<text style="color: red;">*</text>
<text>规格</text>
<text>M+红色</text>
</view>
<view class="tagButton" v-for="item in bottonList">{{item.label}}</view>
<view style="display: inline-block;">删除</view>
</view>
<view>
<text style="color: red;">*</text>
<text>商品图片</text>
<text>最多可上传10张图片</text>
<view></view>
</view>
<view>
<text>详情图片</text>
<text>最多可上传10张图片</text>
<view></view>
</view>
</view>
@@ -21,18 +57,46 @@
export default{
data(){
return{
value: 1,
radio: 0,
range: [
{ value: 0, text: "篮球" },
{ value: 1, text: "足球" },
{ value: 2, text: "游泳" },
{
text: 'M',
value: 0
}, {
text: 'X',
value: 1
}, {
text: 'XL',
value: 2
}, {
text: '2XL',
value: 3
},
],
checkbox:[0],
hobby: [{
text: '黑色',
value: 0
}, {
text: '红色',
value: 1
}, {
text: '白色',
value: 2
}, {
text: '蓝色',
value: 3
}],
bottonList:[
{label:'市场价格'},
{label:'销售价格'},
{label:'商品库存'},
{label:'兑换积分'}
]
}
},
methods:{
change(e) {
console.log("e:", e);
},
}
}
</script>
@@ -41,15 +105,33 @@
.container{
.body{
padding: 30rpx;
width: 100%;
}
}
.bodyContent{
position: relative;
// padding-left:150rpx;
.bodyLabel{
display: inline-block;
width: 150rpx;
width: 100%;
}
.tagButton{
display: inline-block;
width: 133rpx;
height: 58rpx;
background: #f5f5f5;
color: #666666;
border-radius: 10rpx;
line-height: 58rpx;
text-align: center;
margin: 10rpx;
}
.redButton{
display: inline-block;
width: 84rpx;
height: 58rpx;
background: red;
color: #fff;
border-radius: 10rpx;
line-height: 58rpx;
text-align: center;
}
</style>

View File

@@ -9,29 +9,31 @@
<view v-for="item,index in optionsList" :key="index" :class="index == currentIndex ? 'active':''"
@click="selectOptions(index)">{{item.text}}<text>({{item.count}})</text></view>
</view>
<view class="search">
<uni-easyinput prefixIcon="search" v-model="paramter.customerphone" placeholder="请输入手机号后四位"
@confirm="search" maxlength="4" />
<uni-easyinput prefixIcon="search" borderColor="#DCDFE6" v-model="paramter.params.productName" placeholder="请输入商品名称"
@confirm="search" @clear="search" />
</view>
<scroll-view v-if="dataList.length" class="list" :scroll-y="true" @scrolltolower="lower">
<view class="item" v-for="item,index in dataList" :key="index">
<view class="header" @click="toDetails(item)">
<view class="identifying" :style="{background:identifying[1].background,opacity:identifying[1].opacity}">已上架</view>
<view class="identifying"
:style="{background:identifying[item.productStatus].background,
opacity:identifying[item.productStatus].opacity}">{{item.productStatus =='1'?'已上架':'未上架'}}</view>
</view>
<view class="introduce" @click="toDetails(item)">
<image :src="item.oderDetailImg"></image>
<image :src="item.url"></image>
<view>{{item.productName}}</view>
<view>规格默认</view>
<view>{{item.marketPrice}} X{{item.orderNum}}</view>
<view>库存{{item.orderNum}}</view>
<view>库存{{item.totalStock}}</view>
</view>
<view class="examine" @click="examineDetail" :style="{background:statusEnum[1].color}" >{{statusEnum[1].value}}</view>
<view class="examine" @click="examineDetail(item)"
:style="{background:statusEnum[item.auditStatus].color}" >{{statusEnum[item.auditStatus].value}}</view>
<view class="footer">
<view class="button" @click="orderDelete">删除</view>
<view class="button">编辑</view>
<view class="button" @click="upDownFrame">上架</view>
<view class="button" @click="upDownFrame(item)">{{item.productStatus =='1'?'上架':'下架'}}</view>
</view>
</view>
<view style="height: 30rpx; background: #fff;"></view>
@@ -50,13 +52,13 @@
<view class="header">审核时间</view>
<view>{{item.createTime}}</view>
</view>
<view>
<view class="status">
<view class="header">审核结果</view>
<view>{{item.status}}</view>
<view>{{statusEnum[item.auditStatus].value}}</view>
</view>
<view>
<view class="header">反馈详情</view>
<view>{{item.dateil}}</view>
<view>{{item.remark}}</view>
</view>
</view>
<view class="buttons">
@@ -77,10 +79,10 @@
<uni-popup ref="popup">
<view class="determine-frame">
<view class="title">是否上架/下架该商品</view>
<view class="title">是否{{productData.productStatus =='1'?'下架':'上架'}}该商品</view>
<view class="buttons">
<view @click="$refs.popup.close()">取消</view>
<view>确认</view>
<view @click="submitProduct">确认</view>
</view>
</view>
</uni-popup>
@@ -89,7 +91,7 @@
</template>
<script>
import serve from '@/api/packageIntegral/orderList.js'
import serve from '@/api/packageIntegral/productList.js'
export default {
options: {
@@ -106,11 +108,9 @@
paramter: {
currentPage: 1,
pagesize: 20,
params: {
customerphone: ''
params: {},
},
},
dataList: [{},{},{}],
dataList: [],
optionsList: [{
text: '全部',
count: 0,
@@ -129,22 +129,18 @@
value: ''
}],
identifying:{
0: {
1: {
background: '#F83D3D',
opacity: 1,
value: "已上架"
},
1: {
2: {
background: '#F83D3D',
opacity: 0.5,
value: "待上架"
}
},
statusEnum: {
'-1': {
color: '#F83D3D',
value: "已驳回"
},
1: {
color: '#8D38FC',
value: "待审核"
@@ -153,34 +149,38 @@
color: '#FCB438',
value: "已审核"
},
3: {
color: '#F83D3D',
value: "已驳回"
},
examineDetailList:[
{
createTime:'2023.11.22',
status:'1',
dateil:'未审核'
},
{
createTime:'2023.11.23',
status:'2',
dateil:'已审核'
},
{
createTime:'2023.11.24',
status:'已驳回',
dateil:'图片不清晰,请重新上传图片'
}
]
examineDetailList:[],
productData:{}
}
},
onLoad() {
// this.getByPageCloudMini()
this.productByPage()
this.getTopInfo()
},
methods: {
selectOptions(index) {
this.currentIndex = index
console.log(index,'index')
if(index == 0){
this.paramter.params ={}
}else if(index ==1){
this.paramter.params ={}
this.paramter.params.productStatus = 1
}else if(index ==2){
this.paramter.params ={}
this.paramter.params.productStatus = 2
}else if(index ==3){
this.paramter.params ={}
this.paramter.params.auditStatus = 1
}
this.productByPage()
},
handler(json) {
json = json.replace(/'/g, '"')
@@ -197,12 +197,23 @@
url: `../orderDetails/index?orderId=${item.orderId}`
})
},
getTopInfo(){
serve.getTopInfo(this.paramter).then(res => {
if (res.code === 20000) {
this.optionsList[0].count = res.data.count
this.optionsList[1].count = res.data.availableCount
this.optionsList[2].count = res.data.noAvailableCount
this.optionsList[3].count = res.data.auditCount
}
})
},
search() {
this.paramter.currentPage = 1
this.getByPageCloudMini()
this.productByPage()
this.getTopInfo()
},
getByPageCloudMini() {
serve.getByPageCloudMini(this.paramter).then(res => {
productByPage() {
serve.productByPage(this.paramter).then(res => {
if (res.code === 20000) {
if (!res.data.list.length) {
uni.showToast({
@@ -220,17 +231,41 @@
},
lower() {
this.paramter.currentPage += 1
this.getByPageCloudMini()
this.productByPage()
},
examineDetail(){
examineDetail(item){
serve.productAuditHistory({id:item.id}).then(res=>{
this.examineDetailList = res.data
})
this.$refs.detail.open('center')
},
orderDelete(){
this.$refs.delete.open('center')
},
upDownFrame() {
upDownFrame(item) {
this.productData = item
this.$refs.popup.open('center')
},
submitProduct(){
let data = {}
data.id = this.productData.id
if(this.productData.productStatus ==1){
data.productStatus = 2
}else if(this.productData.productStatus ==2){
data.productStatus = 1
}
serve.productStatus(data).then(res=>{
uni.showToast({
title: res.msg,
icon: 'none'
})
if (res.code !== 20000) return
this.$refs.popup.close()
this.productByPage()
this.getTopInfo()
})
},
confirm() {
this.controlWindows.code = false
}
@@ -249,6 +284,13 @@
flex-direction: column;
background: #fff;
>.search {
margin: 50rpx auto 0;
width: 689rpx;
height: 74rpx;
background: #FFF;
}
>.options-frame {
display: flex;
justify-content: space-between;
@@ -280,13 +322,6 @@
}
}
>.search {
margin: 50rpx auto 0;
width: 689rpx;
height: 74rpx;
background: #F7F7F7;
}
>.list {
margin-top: 35rpx;
@@ -439,9 +474,16 @@
color: #666;
padding: 10rpx;
view{
width: 200rpx;
width: 240rpx;
line-height: 46rpx;
}
>.status{
width: 160rpx;
>view{
width: 160rpx;
}
}
.header{
font-size: 32rpx;
color: #000;

View File

@@ -132,7 +132,7 @@
icon: 'none'
});
this.$refs.popup.close();
this;getByPageCloudMini()
this.getByPageCloudMini()
uni.navigateTo({
url: `../orderDetails/index?orderId=${this.dataList[0].orderId}`
})

View File

@@ -0,0 +1,37 @@
## 1.0.72024-01-20
- 修复 长文本回显超过容器的bug超过容器部分显示省略号
## 1.0.62023-04-12
- 修复 微信小程序点击时会改变背景颜色的 bug
## 1.0.52023-02-03
- 修复 禁用时会显示清空按钮
## 1.0.42023-02-02
- 优化 查询条件短期内多次变更只查询最后一次变更后的结果
- 调整 内部缓存键名调整为 uni-data-select-lastSelectedValue
## 1.0.32023-01-16
- 修复 不关联服务空间报错的问题
## 1.0.22023-01-14
- 新增 属性 `format` 可用于格式化显示选项内容
## 1.0.12022-12-06
- 修复 当where变化时数据不会自动更新的问题
## 0.1.92022-09-05
- 修复 微信小程序下拉框出现后选择会点击到蒙板后面的输入框
## 0.1.82022-08-29
- 修复 点击的位置不准确
## 0.1.72022-08-12
- 新增 支持 disabled 属性
## 0.1.62022-07-06
- 修复 pc端宽度异常的bug
## 0.1.5
- 修复 pc端宽度异常的bug
## 0.1.42022-07-05
- 优化 显示样式
## 0.1.32022-06-02
- 修复 localdata 赋值不生效的 bug
- 新增 支持 uni.scss 修改颜色
- 新增 支持选项禁用(数据选项设置 disabled: true 即禁用)
## 0.1.22022-05-08
- 修复 当 value 为 0 时选择不生效的 bug
## 0.1.12022-05-07
- 新增 记住上次的选项(仅 collection 存在时有效)
## 0.1.02022-04-22
- 初始化

View File

@@ -0,0 +1,527 @@
<template>
<view class="uni-stat__select">
<span v-if="label" class="uni-label-text hide-on-phone">{{label + ''}}</span>
<view class="uni-stat-box" :class="{'uni-stat__actived': current}">
<view class="uni-select" :class="{'uni-select--disabled':disabled}">
<view class="uni-select__input-box" @click="toggleSelector">
<view v-if="current" class="uni-select__input-text">{{textShow}}</view>
<view v-else class="uni-select__input-text uni-select__input-placeholder">{{typePlaceholder}}</view>
<view v-if="current && clear && !disabled" @click.stop="clearVal" >
<uni-icons type="clear" color="#c0c4cc" size="24"/>
</view>
<view v-else>
<uni-icons :type="showSelector? 'top' : 'bottom'" size="14" color="#999" />
</view>
</view>
<view class="uni-select--mask" v-if="showSelector" @click="toggleSelector" />
<view class="uni-select__selector" v-if="showSelector">
<view class="uni-popper__arrow"></view>
<scroll-view scroll-y="true" class="uni-select__selector-scroll">
<view class="uni-select__selector-empty" v-if="mixinDatacomResData.length === 0">
<text>{{emptyTips}}</text>
</view>
<view v-else class="uni-select__selector-item" v-for="(item,index) in mixinDatacomResData" :key="index"
@click="change(item)">
<text :class="{'uni-select__selector__disabled': item.disable}">{{formatItemName(item)}}</text>
</view>
</scroll-view>
</view>
</view>
</view>
</view>
</template>
<script>
/**
* DataChecklist 数据选择器
* @description 通过数据渲染的下拉框组件
* @tutorial https://uniapp.dcloud.io/component/uniui/uni-data-select
* @property {String} value 默认值
* @property {Array} localdata 本地数据 ,格式 [{text:'',value:''}]
* @property {Boolean} clear 是否可以清空已选项
* @property {Boolean} emptyText 没有数据时显示的文字 ,本地数据无效
* @property {String} label 左侧标题
* @property {String} placeholder 输入框的提示文字
* @property {Boolean} disabled 是否禁用
* @event {Function} change 选中发生变化触发
*/
export default {
name: "uni-data-select",
mixins: [uniCloud.mixinDatacom || {}],
props: {
localdata: {
type: Array,
default () {
return []
}
},
value: {
type: [String, Number],
default: ''
},
modelValue: {
type: [String, Number],
default: ''
},
label: {
type: String,
default: ''
},
placeholder: {
type: String,
default: '请选择'
},
emptyTips: {
type: String,
default: '无选项'
},
clear: {
type: Boolean,
default: true
},
defItem: {
type: Number,
default: 0
},
disabled: {
type: Boolean,
default: false
},
// 格式化输出 用法 field="_id as value, version as text, uni_platform as label" format="{label} - {text}"
format: {
type: String,
default: ''
},
},
data() {
return {
showSelector: false,
current: '',
mixinDatacomResData: [],
apps: [],
channels: [],
cacheKey: "uni-data-select-lastSelectedValue",
};
},
created() {
this.debounceGet = this.debounce(() => {
this.query();
}, 300);
if (this.collection && !this.localdata.length) {
this.debounceGet();
}
},
computed: {
typePlaceholder() {
const text = {
'opendb-stat-app-versions': '版本',
'opendb-app-channels': '渠道',
'opendb-app-list': '应用'
}
const common = this.placeholder
const placeholder = text[this.collection]
return placeholder ?
common + placeholder :
common
},
valueCom(){
// #ifdef VUE3
return this.modelValue;
// #endif
// #ifndef VUE3
return this.value;
// #endif
},
textShow(){
// 长文本显示
let text = this.current;
if (text.length > 10) {
return text.slice(0, 25) + '...';
}
return text;
}
},
watch: {
localdata: {
immediate: true,
handler(val, old) {
if (Array.isArray(val) && old !== val) {
this.mixinDatacomResData = val
}
}
},
valueCom(val, old) {
this.initDefVal()
},
mixinDatacomResData: {
immediate: true,
handler(val) {
if (val.length) {
this.initDefVal()
}
}
},
},
methods: {
debounce(fn, time = 100){
let timer = null
return function(...args) {
if (timer) clearTimeout(timer)
timer = setTimeout(() => {
fn.apply(this, args)
}, time)
}
},
// 执行数据库查询
query(){
this.mixinDatacomEasyGet();
},
// 监听查询条件变更事件
onMixinDatacomPropsChange(){
if (this.collection) {
this.debounceGet();
}
},
initDefVal() {
let defValue = ''
if ((this.valueCom || this.valueCom === 0) && !this.isDisabled(this.valueCom)) {
defValue = this.valueCom
} else {
let strogeValue
if (this.collection) {
strogeValue = this.getCache()
}
if (strogeValue || strogeValue === 0) {
defValue = strogeValue
} else {
let defItem = ''
if (this.defItem > 0 && this.defItem <= this.mixinDatacomResData.length) {
defItem = this.mixinDatacomResData[this.defItem - 1].value
}
defValue = defItem
}
if (defValue || defValue === 0) {
this.emit(defValue)
}
}
const def = this.mixinDatacomResData.find(item => item.value === defValue)
this.current = def ? this.formatItemName(def) : ''
},
/**
* @param {[String, Number]} value
* 判断用户给的 value 是否同时为禁用状态
*/
isDisabled(value) {
let isDisabled = false;
this.mixinDatacomResData.forEach(item => {
if (item.value === value) {
isDisabled = item.disable
}
})
return isDisabled;
},
clearVal() {
this.emit('')
if (this.collection) {
this.removeCache()
}
},
change(item) {
if (!item.disable) {
this.showSelector = false
this.current = this.formatItemName(item)
this.emit(item.value)
}
},
emit(val) {
this.$emit('input', val)
this.$emit('update:modelValue', val)
this.$emit('change', val)
if (this.collection) {
this.setCache(val);
}
},
toggleSelector() {
if (this.disabled) {
return
}
this.showSelector = !this.showSelector
},
formatItemName(item) {
let {
text,
value,
channel_code
} = item
channel_code = channel_code ? `(${channel_code})` : ''
if (this.format) {
// 格式化输出
let str = "";
str = this.format;
for (let key in item) {
str = str.replace(new RegExp(`{${key}}`,"g"),item[key]);
}
return str;
} else {
return this.collection.indexOf('app-list') > 0 ?
`${text}(${value})` :
(
text ?
text :
`未命名${channel_code}`
)
}
},
// 获取当前加载的数据
getLoadData(){
return this.mixinDatacomResData;
},
// 获取当前缓存key
getCurrentCacheKey(){
return this.collection;
},
// 获取缓存
getCache(name=this.getCurrentCacheKey()){
let cacheData = uni.getStorageSync(this.cacheKey) || {};
return cacheData[name];
},
// 设置缓存
setCache(value, name=this.getCurrentCacheKey()){
let cacheData = uni.getStorageSync(this.cacheKey) || {};
cacheData[name] = value;
uni.setStorageSync(this.cacheKey, cacheData);
},
// 删除缓存
removeCache(name=this.getCurrentCacheKey()){
let cacheData = uni.getStorageSync(this.cacheKey) || {};
delete cacheData[name];
uni.setStorageSync(this.cacheKey, cacheData);
},
}
}
</script>
<style lang="scss">
$uni-base-color: #6a6a6a !default;
$uni-main-color: #333 !default;
$uni-secondary-color: #909399 !default;
$uni-border-3: #e5e5e5;
/* #ifndef APP-NVUE */
@media screen and (max-width: 500px) {
.hide-on-phone {
display: none;
}
}
/* #endif */
.uni-stat__select {
display: flex;
align-items: center;
// padding: 15px;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
width: 100%;
flex: 1;
box-sizing: border-box;
}
.uni-stat-box {
width: 100%;
flex: 1;
}
.uni-stat__actived {
width: 100%;
flex: 1;
// outline: 1px solid #2979ff;
}
.uni-label-text {
font-size: 14px;
font-weight: bold;
color: $uni-base-color;
margin: auto 0;
margin-right: 5px;
}
.uni-select {
font-size: 14px;
border: 1px solid $uni-border-3;
box-sizing: border-box;
border-radius: 4px;
padding: 0 5px;
padding-left: 10px;
position: relative;
/* #ifndef APP-NVUE */
display: flex;
user-select: none;
/* #endif */
flex-direction: row;
align-items: center;
border-bottom: solid 1px $uni-border-3;
width: 100%;
flex: 1;
height: 35px;
&--disabled {
background-color: #f5f7fa;
cursor: not-allowed;
}
}
.uni-select__label {
font-size: 16px;
// line-height: 22px;
height: 35px;
padding-right: 10px;
color: $uni-secondary-color;
}
.uni-select__input-box {
height: 35px;
position: relative;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex: 1;
flex-direction: row;
align-items: center;
}
.uni-select__input {
flex: 1;
font-size: 14px;
height: 22px;
line-height: 22px;
}
.uni-select__input-plac {
font-size: 14px;
color: $uni-secondary-color;
}
.uni-select__selector {
/* #ifndef APP-NVUE */
box-sizing: border-box;
/* #endif */
position: absolute;
top: calc(100% + 12px);
left: 0;
width: 100%;
background-color: #FFFFFF;
border: 1px solid #EBEEF5;
border-radius: 6px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
z-index: 3;
padding: 4px 0;
}
.uni-select__selector-scroll {
/* #ifndef APP-NVUE */
max-height: 200px;
box-sizing: border-box;
/* #endif */
}
/* #ifdef H5 */
@media (min-width: 768px) {
.uni-select__selector-scroll {
max-height: 600px;
}
}
/* #endif */
.uni-select__selector-empty,
.uni-select__selector-item {
/* #ifndef APP-NVUE */
display: flex;
cursor: pointer;
/* #endif */
line-height: 35px;
font-size: 14px;
text-align: center;
/* border-bottom: solid 1px $uni-border-3; */
padding: 0px 10px;
}
.uni-select__selector-item:hover {
background-color: #f9f9f9;
}
.uni-select__selector-empty:last-child,
.uni-select__selector-item:last-child {
/* #ifndef APP-NVUE */
border-bottom: none;
/* #endif */
}
.uni-select__selector__disabled {
opacity: 0.4;
cursor: default;
}
/* picker 弹出层通用的指示小三角 */
.uni-popper__arrow,
.uni-popper__arrow::after {
position: absolute;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 6px;
}
.uni-popper__arrow {
filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
top: -6px;
left: 10%;
margin-right: 3px;
border-top-width: 0;
border-bottom-color: #EBEEF5;
}
.uni-popper__arrow::after {
content: " ";
top: 1px;
margin-left: -6px;
border-top-width: 0;
border-bottom-color: #fff;
}
.uni-select__input-text {
// width: 280px;
width: 100%;
color: $uni-main-color;
white-space: nowrap;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
overflow: hidden;
}
.uni-select__input-placeholder {
color: $uni-base-color;
font-size: 12px;
}
.uni-select--mask {
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 0;
z-index: 2;
}
</style>

View File

@@ -0,0 +1,85 @@
{
"id": "uni-data-select",
"displayName": "uni-data-select 下拉框选择器",
"version": "1.0.7",
"description": "通过数据驱动的下拉框选择器",
"keywords": [
"uni-ui",
"select",
"uni-data-select",
"下拉框",
"下拉选"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": "^3.1.1"
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": ["uni-load-more"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "u",
"app-nvue": "n"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "u",
"百度": "u",
"字节跳动": "u",
"QQ": "u",
"京东": "u"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

View File

@@ -0,0 +1,8 @@
## DataSelect 下拉框选择器
> **组件名uni-data-select**
> 代码块: `uDataSelect`
当选项过多时,使用下拉菜单展示并选择内容
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-data-select)
#### 如使用过程中有任何问题或者您对uni-ui有一些好的建议欢迎加入 uni-ui 交流群871950839