dev
liudan
10 months ago
parent
73e6ca641d
commit
5ece2d6aad
@ -0,0 +1,262 @@ |
||||
<template> |
||||
<view> |
||||
<view style="width:100%;position: fixed;top:0;z-index:99"> |
||||
<view class="navBarContent"> |
||||
<u-icon name="arrow-left" style="position: absolute;top:50%;left:40upx;transform: translateY(-50%);" color="#000" size="24"></u-icon> |
||||
<text>加入分销</text> |
||||
</view> |
||||
|
||||
</view> |
||||
<image src="/static/news3/walletBg.png" mode="widthFix" class="bgImg"></image> |
||||
<view class="userInfo"> |
||||
<image src="/static/news3/join.png" mode="widthFix"></image> |
||||
<view class="userContent"> |
||||
<image src="/static/news/avater.png" mode="aspectFill" class="avatar"></image> |
||||
<view class="user"> |
||||
<view class="userTop"> |
||||
<text class="name">Deioio</text> |
||||
<view class="flag"> |
||||
分销商 |
||||
</view> |
||||
</view> |
||||
<view class="userBottom"> |
||||
<text>加入时间2024.01.21</text> |
||||
<view class="tixian"> |
||||
提现 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
</view> |
||||
<view class="yongjinContent"> |
||||
<view class="item"> |
||||
<text class="num"> |
||||
0.00 |
||||
</text> |
||||
<text class="text">已提现佣金</text> |
||||
</view> |
||||
<view class="item"> |
||||
<text class="num"> |
||||
0 |
||||
</text> |
||||
<text class="text">未结算佣金</text> |
||||
</view> |
||||
</view> |
||||
<view class="gridContent"> |
||||
<view class="gridItem"> |
||||
<image src="/static/news3/fx1.png" mode="widthFix"></image> |
||||
<text>分销佣金</text> |
||||
</view> |
||||
<view class="gridItem"> |
||||
<image src="/static/news3/fx2.png" mode="widthFix"></image> |
||||
<text>分销订单</text> |
||||
</view> |
||||
<view class="gridItem"> |
||||
<image src="/static/news3/fx3.png" mode="widthFix"></image> |
||||
<text>提现明细</text> |
||||
</view> |
||||
<view class="gridItem"> |
||||
<image src="/static/news3/fx4.png" mode="widthFix"></image> |
||||
<text>我的团队</text> |
||||
</view> |
||||
<view class="gridItem"> |
||||
<image src="/static/news3/fx5.png" mode="widthFix"></image> |
||||
<text>推广二维码</text> |
||||
</view> |
||||
</view> |
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
|
||||
}; |
||||
}, |
||||
methods:{ |
||||
/** |
||||
* 售后点击 |
||||
*/ |
||||
onApplyAftersales(){ |
||||
uni.navigateTo({ |
||||
url: '/pages/AfterSaleType/AfterSaleType', |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
page{ |
||||
background-color: #F7F8FA; |
||||
min-height: 100%; |
||||
padding-bottom: 140upx; |
||||
padding-top:200upx; |
||||
} |
||||
.bgImg{ |
||||
width:100%; |
||||
height:auto; |
||||
position:absolute; |
||||
top:0; |
||||
left:0; |
||||
z-index:1; |
||||
} |
||||
|
||||
.navBarContent{ |
||||
height:88upx; |
||||
line-height: 88upx; |
||||
text-align: center; |
||||
position: relative; |
||||
text{ |
||||
font-size: 32upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #000; |
||||
} |
||||
|
||||
} |
||||
.userInfo{ |
||||
position: relative; |
||||
z-index:3; |
||||
margin:0 30upx; |
||||
image{ |
||||
width:100%; |
||||
height:auto; |
||||
} |
||||
.userContent{ |
||||
position: absolute; |
||||
top:0; |
||||
left:0; |
||||
width:100%; |
||||
height:100%; |
||||
display: flex; |
||||
padding:52upx 30upx; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
|
||||
.avatar{ |
||||
width:114upx; |
||||
height:114upx; |
||||
} |
||||
.user{ |
||||
margin-left:30upx; |
||||
flex:1; |
||||
.userTop{ |
||||
display: flex; |
||||
align-items: center; |
||||
.name{ |
||||
|
||||
font-size: 36upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #785B45; |
||||
margin-right:20upx; |
||||
|
||||
} |
||||
.flag{ |
||||
height: 42upx; |
||||
background: rgba(255,255,255,0.71); |
||||
border-radius: 31px 31px 31px 31px; |
||||
opacity: 1; |
||||
|
||||
font-size: 24upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #785B45; |
||||
line-height: 42upx; |
||||
text-align: center; |
||||
padding:0 20upx; |
||||
} |
||||
} |
||||
.userBottom{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
margin-top:26upx; |
||||
text{ |
||||
font-size: 24upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #785B45; |
||||
} |
||||
.tixian{ |
||||
padding:12upx 36upx; |
||||
background: linear-gradient(180deg, #AF8D72 0%, #7D5C45 100%); |
||||
border-radius: 29px 29px 29px 29px; |
||||
opacity: 1; |
||||
font-size: 24upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #FFFFFF; |
||||
|
||||
} |
||||
} |
||||
} |
||||
|
||||
} |
||||
} |
||||
.yongjinContent{ |
||||
background: #FFFFFF; |
||||
border-radius: 6px 6px 6px 6px; |
||||
opacity: 1; |
||||
padding:42upx 0; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-around; |
||||
margin:20upx 30upx; |
||||
.item{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
flex-direction: column; |
||||
.num{ |
||||
|
||||
font-size: 40upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #414141; |
||||
|
||||
} |
||||
.text{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #616161; |
||||
margin-top:10upx; |
||||
|
||||
} |
||||
} |
||||
} |
||||
.gridContent{ |
||||
display: flex; |
||||
background-color: #fff; |
||||
flex-wrap: wrap; |
||||
margin:0upx 30upx; |
||||
padding:20upx 0; |
||||
.gridItem{ |
||||
width:33%; |
||||
margin:30upx 0; |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: center; |
||||
justify-content: center; |
||||
image{ |
||||
height:auto; |
||||
width:50upx; |
||||
} |
||||
text{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #616161; |
||||
margin-top:16upx; |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,139 @@ |
||||
<template> |
||||
<view> |
||||
<view style="width:100%;position: fixed;top:0;z-index:99"> |
||||
<view class="navBarContent"> |
||||
<u-icon name="arrow-left" style="position: absolute;top:50%;left:40upx;transform: translateY(-50%);" color="#000" size="24"></u-icon> |
||||
<text>物流查询</text> |
||||
</view> |
||||
|
||||
</view> |
||||
<image src="/static/news3/walletBg.png" mode="widthFix" class="bgImg"></image> |
||||
<view class="contentDes"> |
||||
<u-field |
||||
v-model="form.logisticsNum" |
||||
label="物流单号" |
||||
placeholder="请填写物流单号" |
||||
> |
||||
</u-field> |
||||
<view class="btnGroup"> |
||||
<view class="btnItem"> |
||||
<image src="/static/news3/scan.png" mode="widthFix"></image> |
||||
<text>扫码识别</text> |
||||
</view> |
||||
<view class="btnItem" style="margin-left:66upx;"> |
||||
<image src="/static/news3/copy.png" mode="widthFix"></image> |
||||
<text>粘贴单号</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="footerBtn"> |
||||
查快递 |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
form:{ |
||||
logisticsNum:'', |
||||
} |
||||
}; |
||||
}, |
||||
methods:{ |
||||
/** |
||||
* 售后点击 |
||||
*/ |
||||
onApplyAftersales(){ |
||||
uni.navigateTo({ |
||||
url: '/pages/AfterSaleType/AfterSaleType', |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
page{ |
||||
background-color: #F7F8FA; |
||||
min-height: 100%; |
||||
padding-bottom: 140upx; |
||||
padding-top:230upx; |
||||
} |
||||
.bgImg{ |
||||
width:100%; |
||||
height:auto; |
||||
position:absolute; |
||||
top:0; |
||||
left:0; |
||||
z-index:1; |
||||
} |
||||
.contentDes{ |
||||
position:relative; |
||||
z-index:2; |
||||
margin:0upx 26upx; |
||||
|
||||
background-color: #fff; |
||||
|
||||
background: #FFFFFF; |
||||
border-radius: 6px 6px 6px 6px; |
||||
opacity: 1; |
||||
padding:0 28upx; |
||||
|
||||
} |
||||
.navBarContent{ |
||||
height:88upx; |
||||
line-height: 88upx; |
||||
text-align: center; |
||||
position: relative; |
||||
text{ |
||||
font-size: 32upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #000; |
||||
} |
||||
|
||||
} |
||||
::v-deep .u-field{ |
||||
padding:30upx 10upx; |
||||
} |
||||
.btnGroup{ |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
padding:44upx 40upx; |
||||
.btnItem{ |
||||
display: flex; |
||||
align-items: center; |
||||
image{ |
||||
width:40upx; |
||||
height:auto; |
||||
} |
||||
text{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #3B3B3B; |
||||
margin-left:20upx; |
||||
|
||||
} |
||||
} |
||||
} |
||||
.footerBtn{ |
||||
width:80%; |
||||
|
||||
height: 100upx; |
||||
background: #FFAAA4; |
||||
border-radius: 6px 6px 6px 6px; |
||||
opacity: 1; |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
line-height: 100upx; |
||||
text-align: center; |
||||
margin:70upx auto; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,357 @@ |
||||
<template> |
||||
<view> |
||||
<view class="section"> |
||||
<u-field |
||||
v-model="form.config" |
||||
label="商品型号" |
||||
placeholder="请输入商品型号" |
||||
> |
||||
</u-field> |
||||
<u-field |
||||
v-model="form.shopNum" |
||||
label="商品数量" |
||||
placeholder="请输入商品数量" |
||||
> |
||||
</u-field> |
||||
</view> |
||||
<view class="section"> |
||||
<u-input class="realAddr" placeholder="请粘贴或输入文本，点击“识别”自动识别姓名、电话和地址" v-model="form.auto"></u-input> |
||||
<view class="btnContent"> |
||||
<view class="btn"> |
||||
识别 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="section"> |
||||
<u-field |
||||
v-model="form.getPeopleName" |
||||
label="收货人" |
||||
placeholder="请输入收货人姓名" |
||||
> |
||||
</u-field> |
||||
<u-field |
||||
v-model="form.getPeoplePhone" |
||||
label="手机号" |
||||
placeholder="请输入收货人手机号" |
||||
> |
||||
</u-field> |
||||
<u-field @click="cityShow=true" v-model="form.city" |
||||
:disabled="true" label="所属城市" placeholder="请选择" |
||||
right-icon="arrow-right" |
||||
> |
||||
</u-field> |
||||
<u-picker mode="region" v-model="cityShow"></u-picker> |
||||
<view class="addrDetail"> |
||||
<view class="addrTitle"> |
||||
详细地址 |
||||
</view> |
||||
<u-input type="textarea" v-model="form.address" placeholder="请输入详细地址"></u-input> |
||||
</view> |
||||
</view> |
||||
<view class="section"> |
||||
<u-field @click="modeShow=true" v-model="form.setGoodsMode" |
||||
:disabled="true" label="发货模式" placeholder="待选择" |
||||
right-icon="arrow-right" |
||||
> |
||||
</u-field> |
||||
<u-action-sheet :list="modeList" v-model="modeShow"></u-action-sheet> |
||||
<u-field |
||||
v-model="form.setGoodsCompany" |
||||
label="发货公司" |
||||
placeholder="请输入上游公司名字" |
||||
> |
||||
</u-field> |
||||
<u-field |
||||
v-model="form.setGoodsName" |
||||
label="发货人" |
||||
placeholder="请输入上游渠道商名字" |
||||
> |
||||
</u-field> |
||||
<u-field |
||||
v-model="form.setGoodsPhone" |
||||
label="发货人电话" |
||||
placeholder="请输入上游渠道商电话" |
||||
> |
||||
</u-field> |
||||
<u-field @click="goodsShow=true" v-model="form.wuliuCompany" |
||||
:disabled="true" label="物流公司" placeholder="请选择物流公司" |
||||
right-icon="arrow-right" |
||||
> |
||||
</u-field> |
||||
<u-action-sheet :list="kuaidiList" v-model="goodsShow"></u-action-sheet> |
||||
<u-field |
||||
v-model="form.orderNum" |
||||
label="物流单号" |
||||
placeholder="请输入物流单号" |
||||
> |
||||
</u-field> |
||||
</view> |
||||
<view class="recordList"> |
||||
<view class="recordItem"> |
||||
<view class="recordTitle"> |
||||
转账记录<text class="intro">最多上传5张</text> |
||||
</view> |
||||
<u-upload |
||||
:fileList="finishImageList" |
||||
:previewFullImage="true" |
||||
@afterRead="afterRead" |
||||
:maxCount="5" |
||||
@delete="deletePic" |
||||
name="1" |
||||
multiple |
||||
></u-upload> |
||||
</view> |
||||
<view class="recordItem"> |
||||
<view class="recordTitle"> |
||||
聊天记录<text class="intro">最多上传5张</text> |
||||
</view> |
||||
<u-upload |
||||
:fileList="chatList" |
||||
:previewFullImage="true" |
||||
@afterRead="afterRead" |
||||
:maxCount="5" |
||||
@delete="deletePic" |
||||
name="1" |
||||
multiple |
||||
></u-upload> |
||||
</view> |
||||
</view> |
||||
<view class="footerBtn"> |
||||
提交 |
||||
</view> |
||||
|
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return{ |
||||
form:{ |
||||
config:'', |
||||
shopNum:null, |
||||
auto:'', |
||||
getPeopleName:'', |
||||
getPeoplePhone:'', |
||||
city:null, |
||||
address:'', |
||||
setGoodsMode:null, |
||||
setGoodsCompany:'', |
||||
setGoodsName:'', |
||||
setGoodsPhone:'', |
||||
wuliuCompany:'', |
||||
orderNum:'', |
||||
}, |
||||
modeList:[ |
||||
{ |
||||
text: '店内现货', |
||||
} |
||||
], |
||||
kuaidiList:[ |
||||
{ |
||||
text: '顺丰快递', |
||||
} |
||||
], |
||||
cityShow:false, |
||||
modeShow:false, |
||||
goodsShow:false, |
||||
finishImageList:[], |
||||
chatList:[] |
||||
|
||||
} |
||||
}, |
||||
methods:{ |
||||
showAction(){ |
||||
this.modeShow = true; |
||||
}, |
||||
showgoodsAction(){ |
||||
this.goodsShow = true; |
||||
}, |
||||
// 新增图片 |
||||
async afterRead(event) { |
||||
// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式 |
||||
let lists = [].concat(event.file) |
||||
let fileListLen = this[`fileList${event.name}`].length |
||||
lists.map((item) => { |
||||
this[`fileList${event.name}`].push({ |
||||
...item, |
||||
status: 'uploading', |
||||
message: '上传中' |
||||
}) |
||||
}) |
||||
for (let i = 0; i < lists.length; i++) { |
||||
const result = await this.uploadFilePromise(lists[i].url) |
||||
|
||||
if(JSON.parse(result).code==1){ |
||||
let item = this[`fileList${event.name}`][fileListLen] |
||||
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, { |
||||
status: 'success', |
||||
message: '', |
||||
url: result |
||||
})) |
||||
fileListLen++ |
||||
}else{ |
||||
this[`fileList${event.name}`].splice(fileListLen, 1) |
||||
} |
||||
|
||||
} |
||||
|
||||
}, |
||||
//上传照片 |
||||
uploadFilePromise(url) { |
||||
return new Promise((resolve, reject) => { |
||||
let a = uni.uploadFile({ |
||||
url: this.baseUrl+'/api/common/upload', // 仅为示例，非真实的接口地址 |
||||
filePath: url, |
||||
name: 'file', |
||||
formData: { |
||||
user: 'test', |
||||
token:getToken() |
||||
}, |
||||
success: (res) => { |
||||
if(JSON.parse(res.data).code==1){ |
||||
setTimeout(() => { |
||||
this.finishImageList.push({url:JSON.parse(res.data).data.fullurl,path:JSON.parse(res.data).data.url}) |
||||
resolve(res.data) |
||||
}, 1000) |
||||
}else{ |
||||
uni.$u.toast(JSON.parse(res.data).msg) |
||||
|
||||
resolve(res.data) |
||||
} |
||||
}, |
||||
fail: (res) => { |
||||
console.log(res,"rrr") |
||||
} |
||||
}); |
||||
}) |
||||
}, |
||||
//删除图片 |
||||
deletePic(event) { |
||||
console.log(event) |
||||
// this[`fileList${event.name}`].splice(event.index, 1) |
||||
this.finishImageList.splice(event.index, 1) |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
page{ |
||||
min-height: 100%; |
||||
background-color: #F7F8FA; |
||||
padding-bottom: 96upx; |
||||
} |
||||
.section{ |
||||
background-color: #fff; |
||||
padding:0 26upx; |
||||
margin-top:16upx; |
||||
.realAddr{ |
||||
padding:40upx 0 !important; |
||||
::v-deep .uni-input-wrapper{ |
||||
text-align: left !important; |
||||
} |
||||
::v-deep .uni-input-placeholder{ |
||||
white-space: pre-wrap; |
||||
} |
||||
} |
||||
.btnContent{ |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
padding-bottom: 30upx; |
||||
} |
||||
.btn{ |
||||
width: 120upx; |
||||
height: 50upx; |
||||
background: #FFB8B3; |
||||
border-radius: 19px 19px 19px 19px; |
||||
opacity: 1; |
||||
line-height: 50upx; |
||||
text-align: center; |
||||
|
||||
font-size: 24upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
|
||||
} |
||||
.addrDetail{ |
||||
padding:0 10upx; |
||||
.addrTitle{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #303030; |
||||
margin-top:32upx; |
||||
} |
||||
} |
||||
} |
||||
.selectContent{ |
||||
border-top:1px solid transparent; |
||||
margin-top:6upx; |
||||
padding-bottom: 100upx; |
||||
} |
||||
|
||||
::v-deep .u-field{ |
||||
padding:30upx 10upx; |
||||
} |
||||
::v-deep .uni-input-wrapper{ |
||||
text-align: right; |
||||
} |
||||
.recordList{ |
||||
padding:30upx; |
||||
background-color: #fff; |
||||
margin-top:14upx; |
||||
.recordItem{ |
||||
.recordTitle{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #353535; |
||||
margin-bottom: 20upx; |
||||
.intro{ |
||||
|
||||
font-size: 24upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #9F9F9F; |
||||
margin-left:28upx; |
||||
} |
||||
|
||||
} |
||||
.picList{ |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
margin:12upx 0; |
||||
text-align: center; |
||||
image{ |
||||
width: 200upx; |
||||
height: 160upx; |
||||
|
||||
} |
||||
} |
||||
} |
||||
} |
||||
.footerBtn{ |
||||
width: 80%; |
||||
height: 88upx; |
||||
background: #FFAAA4; |
||||
border-radius: 36px 36px 36px 36px; |
||||
opacity: 1; |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
line-height: 88upx; |
||||
text-align: center; |
||||
margin:96upx auto 0 auto; |
||||
|
||||
} |
||||
|
||||
</style> |
||||
@ -0,0 +1,134 @@ |
||||
<template> |
||||
<view> |
||||
<u-popup v-model="afterSale" width="80%" border-radius="10" :closeable="true" mode="center"> |
||||
<view class="afterSales"> |
||||
<view class="filterTitle"> |
||||
请设置价格区间 |
||||
</view> |
||||
<view class="priceContainer"> |
||||
<u-input placeholder="最低" v-model="min"></u-input> |
||||
<text style="margin:0 30upx;">-</text> |
||||
<u-input placeholder="最高" v-model="max"></u-input> |
||||
</view> |
||||
<view class="btnGroup"> |
||||
<view class="reset"> |
||||
重置 |
||||
</view> |
||||
<view class="submit" style="margin-left:24upx;"> |
||||
确定 |
||||
</view> |
||||
</view> |
||||
<view class="setRule"> |
||||
<view class="ruleTitle"> |
||||
设置规则： |
||||
</view> |
||||
<view class="ruleText"> |
||||
A.当加价率生效后，会员价高于市场价，会员价统一自动按以下标准执行： （市场价-成本价）x_____% +成本价=会员价 _____%为此时的加价率。 利润低于_____元的商品不展示在商城里。 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</u-popup> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return{ |
||||
afterSale:false, |
||||
min:null, |
||||
max:null, |
||||
} |
||||
}, |
||||
methods:{ |
||||
|
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
|
||||
.afterSales{ |
||||
padding:32upx; |
||||
.filterTitle{ |
||||
font-size: 32upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #303030; |
||||
text-align: center; |
||||
} |
||||
.priceContainer{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
padding-top:56upx; |
||||
margin-top:34upx; |
||||
border-top:1px solid #EAEAEA; |
||||
::v-deep .u-input{ |
||||
height: 70upx; |
||||
background: #F3F3F3; |
||||
border-radius: 22px 22px 22px 22px; |
||||
opacity: 1; |
||||
text-align: center; |
||||
} |
||||
::v-deep .u-input__input{ |
||||
text-align: center; |
||||
} |
||||
} |
||||
.btnGroup{ |
||||
margin:60upx 0; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
.reset{ |
||||
width:216upx; |
||||
height: 70upx; |
||||
background: #E9E9E9; |
||||
border-radius: 22px 22px 22px 22px; |
||||
opacity: 1; |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #585858; |
||||
line-height: 70upx; |
||||
text-align: center; |
||||
} |
||||
.submit{ |
||||
width:216upx; |
||||
height: 70upx; |
||||
background: linear-gradient(180deg, #FD5D06 0%, #F3211A 100%); |
||||
border-radius: 50px 50px 50px 50px; |
||||
opacity: 1; |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
line-height: 70upx; |
||||
text-align: center; |
||||
|
||||
} |
||||
} |
||||
.setRule{ |
||||
.ruleTitle{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #303030; |
||||
|
||||
} |
||||
.ruleText{ |
||||
margin-top:24upx; |
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #8B8B8B; |
||||
line-height: 32px; |
||||
|
||||
} |
||||
} |
||||
|
||||
} |
||||
</style> |
||||
@ -0,0 +1,217 @@ |
||||
<template> |
||||
<view> |
||||
<view class="selectContent" style="border:none;background-color: #fff;"> |
||||
<!-- <view class="left"> |
||||
物流费用 |
||||
</view> |
||||
<view class="right"> |
||||
<view class="price"> |
||||
<text style="font-size: 26upx;">¥</text> |
||||
<text>288</text> |
||||
</view> |
||||
<u-icon name="arrow-right" color="#C3C3C3" size="28"></u-icon> |
||||
</view> --> |
||||
<u-field @click="showAction" v-model="form.mode" |
||||
:disabled="true" label="发货模式" placeholder="请选择" |
||||
right-icon="arrow-right" |
||||
> |
||||
</u-field> |
||||
<u-action-sheet :list="modeList" v-model="modeShow"></u-action-sheet> |
||||
<u-field |
||||
v-model="form.company" |
||||
label="发货公司" |
||||
placeholder="请输入" |
||||
> |
||||
</u-field> |
||||
<u-field |
||||
v-model="form.name" |
||||
label="发货人" |
||||
placeholder="请输入" |
||||
> |
||||
</u-field> |
||||
<u-field |
||||
v-model="form.phone" |
||||
label="发货人电话" |
||||
placeholder="请输入" |
||||
> |
||||
</u-field> |
||||
<u-field @click="showgoodsAction" v-model="form.kuaidi" |
||||
:disabled="true" label="快递" placeholder="请选择" |
||||
right-icon="arrow-right" |
||||
> |
||||
</u-field> |
||||
<u-action-sheet :list="kuaidiList" v-model="goodsShow"></u-action-sheet> |
||||
<view class="wuliu"> |
||||
<u-field |
||||
style="flex: 1;padding:30upx 0 30upx 30upx" |
||||
v-model="codeNum" |
||||
label="物流单号" |
||||
placeholder="请填写物流单号" |
||||
> |
||||
</u-field> |
||||
<view class="getWuliu"> |
||||
查看物流 |
||||
</view> |
||||
</view> |
||||
<view class="recordList"> |
||||
<view class="recordItem"> |
||||
<view class="recordTitle"> |
||||
转账记录 |
||||
</view> |
||||
<view class="picList"> |
||||
<image src="/static/news3/filter.png" mode="aspectFit"></image> |
||||
<image src="/static/news3/filter.png" mode="aspectFit"></image> |
||||
<image src="/static/news3/filter.png" mode="aspectFit"></image> |
||||
<image src="/static/news3/filter.png" mode="aspectFit"></image> |
||||
</view> |
||||
</view> |
||||
<view class="recordItem"> |
||||
<view class="recordTitle"> |
||||
聊天记录 |
||||
</view> |
||||
<view class="picList"> |
||||
<image src="/static/news3/filter.png" mode="aspectFit"></image> |
||||
<image src="/static/news3/filter.png" mode="aspectFit"></image> |
||||
<image src="/static/news3/filter.png" mode="aspectFit"></image> |
||||
<image src="/static/news3/filter.png" mode="aspectFit"></image> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="footerBtn"> |
||||
保存 |
||||
</view> |
||||
</view> |
||||
|
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return{ |
||||
form:{ |
||||
mode:'', |
||||
company:'', |
||||
name:'', |
||||
phone:'', |
||||
kuaidi:'', |
||||
|
||||
}, |
||||
modeList:[ |
||||
{ |
||||
text: '店内现货', |
||||
} |
||||
], |
||||
kuaidiList:[ |
||||
{ |
||||
text: '顺丰快递', |
||||
} |
||||
], |
||||
modeShow:false, |
||||
goodsShow:false, |
||||
// newPrice:null, |
||||
|
||||
|
||||
// wuliu:'', |
||||
// codeNum:'' |
||||
} |
||||
}, |
||||
methods:{ |
||||
showAction(){ |
||||
this.modeShow = true; |
||||
}, |
||||
showgoodsAction(){ |
||||
this.goodsShow = true; |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
page{ |
||||
min-height: 100%; |
||||
background-color: #F7F8FA; |
||||
|
||||
} |
||||
.selectContent{ |
||||
border-top:1px solid transparent; |
||||
margin-top:6upx; |
||||
padding-bottom: 100upx; |
||||
} |
||||
::v-deep .u-border-bottom:after{ |
||||
border:none; |
||||
} |
||||
::v-deep .u-field{ |
||||
padding:30upx; |
||||
} |
||||
::v-deep .uni-input-wrapper{ |
||||
text-align: right; |
||||
} |
||||
.wuliu{ |
||||
display: flex; |
||||
align-items: center; |
||||
.getWuliu{ |
||||
width: 130upx; |
||||
height: 56upx; |
||||
background: #FFFFFF; |
||||
border-radius: 19px 19px 19px 19px; |
||||
opacity: 1; |
||||
border: 1px solid #F55349; |
||||
|
||||
font-size: 24upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #F55349; |
||||
line-height: 52upx; |
||||
text-align: center; |
||||
margin-right:30upx; |
||||
|
||||
} |
||||
} |
||||
.recordList{ |
||||
padding:30upx; |
||||
.recordItem{ |
||||
.recordTitle{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #353535; |
||||
|
||||
} |
||||
.picList{ |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
margin:12upx 0; |
||||
text-align: center; |
||||
image{ |
||||
width: 200upx; |
||||
height: 160upx; |
||||
|
||||
} |
||||
} |
||||
} |
||||
} |
||||
.footerBtn{ |
||||
width: 80%; |
||||
|
||||
height: 100rpx; |
||||
background: #FFAAA4; |
||||
border-radius: 6px 6px 6px 6px; |
||||
opacity: 1; |
||||
margin:0 auto; |
||||
margin-top:40upx; |
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
text-align: center; |
||||
line-height: 100upx; |
||||
|
||||
} |
||||
|
||||
</style> |
||||
@ -0,0 +1,220 @@ |
||||
<template> |
||||
<view class="updatePrice"> |
||||
|
||||
<view class="dispatchContent"> |
||||
<view class="orderNum"> |
||||
订单号：7868867676878676876 |
||||
</view> |
||||
<view class="dispatchItem"> |
||||
<image src="/static/news3/filter.png" mode="aspectFill"></image> |
||||
<view class="right"> |
||||
<view class="title"> |
||||
联想小新笔记本电脑2023年新款 |
||||
</view> |
||||
<view class="subTitle"> |
||||
16GB，128GB |
||||
</view> |
||||
<view class="num"> |
||||
x1 |
||||
</view> |
||||
<view class="price"> |
||||
<text style="font-size: 26upx;">¥</text> |
||||
<text>288</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
</view> |
||||
<view class="selectContent" style="border:none;background-color: #fff;"> |
||||
<!-- <view class="left"> |
||||
物流费用 |
||||
</view> |
||||
<view class="right"> |
||||
<view class="price"> |
||||
<text style="font-size: 26upx;">¥</text> |
||||
<text>288</text> |
||||
</view> |
||||
<u-icon name="arrow-right" color="#C3C3C3" size="28"></u-icon> |
||||
</view> --> |
||||
<u-field @click="showAction" v-model="wuliu" |
||||
:disabled="true" label="物流公司" placeholder="请选择物流公司" |
||||
right-icon="arrow-down-fill" |
||||
> |
||||
</u-field> |
||||
<u-action-sheet :list="wlList" v-model="wuliuShow"></u-action-sheet> |
||||
<view class="scan"> |
||||
<u-field |
||||
style="flex: 1;padding:30upx 0 30upx 30upx" |
||||
v-model="codeNum" |
||||
label="物流单号" |
||||
placeholder="请填写物流单号" |
||||
> |
||||
</u-field> |
||||
<image src="/static/news3/scan.png" mode=""></image> |
||||
</view> |
||||
<view class="footerBtn"> |
||||
<view class="wuliuBtn"> |
||||
物流链接 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="btn"> |
||||
确认发货 |
||||
</view> |
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return{ |
||||
modifyInfo:false, |
||||
newPrice:null, |
||||
wuliuShow:false, |
||||
wlList:[ |
||||
{ |
||||
text: '物流', |
||||
} |
||||
], |
||||
wuliu:'', |
||||
codeNum:'' |
||||
} |
||||
}, |
||||
methods:{ |
||||
showAction(){ |
||||
this.wuliuShow = true; |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
page{ |
||||
min-height: 100%; |
||||
background-color: #F7F8FA; |
||||
} |
||||
.orderNum{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #707070; |
||||
margin:10upx 30upx; |
||||
|
||||
} |
||||
.dispatchContent{ |
||||
margin:20upx 0; |
||||
background: #FFFFFF; |
||||
// border-radius: 6px 6px 6px 6px; |
||||
opacity: 1; |
||||
padding:20upx 10upx; |
||||
} |
||||
.dispatchItem{ |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
image{ |
||||
width: 194upx; |
||||
height:194upx; |
||||
} |
||||
.right{ |
||||
flex:1; |
||||
margin-left:40upx; |
||||
position: relative; |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: space-around; |
||||
.title{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #3B3B3B; |
||||
|
||||
} |
||||
.subTitle{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #7C7C7C; |
||||
margin:14upx 0; |
||||
|
||||
} |
||||
.num{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #1E1E1E; |
||||
} |
||||
.price{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: flex-end; |
||||
font-size: 32upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #F21A1C; |
||||
position: absolute; |
||||
right:20upx; |
||||
bottom:0upx; |
||||
z-index:9; |
||||
|
||||
} |
||||
} |
||||
} |
||||
.scan{ |
||||
display: flex; |
||||
align-items: center; |
||||
image{ |
||||
width:40upx; |
||||
height:40upx; |
||||
margin-right:32upx; |
||||
} |
||||
} |
||||
::v-deep .u-field{ |
||||
padding:30upx; |
||||
} |
||||
::v-deep .uni-input-wrapper{ |
||||
text-align: right; |
||||
} |
||||
.footerBtn{ |
||||
padding:30upx; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: flex-end; |
||||
} |
||||
.wuliuBtn{ |
||||
// padding:8upx 46upx; |
||||
text-align: center; |
||||
height:60upx; |
||||
line-height: 60upx; |
||||
border:1px solid #F63116; |
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #F83F11; |
||||
border-radius:20px; |
||||
width:200upx; |
||||
} |
||||
|
||||
.btn{ |
||||
width: 80%; |
||||
height: 100upx; |
||||
background: #FFAAA4; |
||||
border-radius: 6px 6px 6px 6px; |
||||
opacity: 1; |
||||
line-height: 100upx; |
||||
text-align: center; |
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
margin:140upx auto; |
||||
|
||||
} |
||||
|
||||
</style> |
||||
@ -0,0 +1,242 @@ |
||||
<template> |
||||
<view class="updatePrice"> |
||||
<view class="head-info"> |
||||
<!-- 搜索 --> |
||||
<view class="searchContent"> |
||||
<u-input v-model="searchText" placeholder="商品名称/编码"/> |
||||
<u-icon name="search" class="search"></u-icon> |
||||
|
||||
</view> |
||||
</view> |
||||
<view class="bg"> |
||||
<image src="/static/news3/bg.png" mode="widthFix"></image> |
||||
<view class="text"> |
||||
只属于非商城订单 |
||||
</view> |
||||
</view> |
||||
<view class="dispatchContent"> |
||||
<view class="orderNum"> |
||||
订单号：7868867676878676876 |
||||
</view> |
||||
<view class="dispatchItem"> |
||||
<image src="/static/news3/filter.png" mode="aspectFill"></image> |
||||
<view class="right"> |
||||
<view class="title"> |
||||
联想小新笔记本电脑2023年新款 |
||||
</view> |
||||
<view class="subTitle"> |
||||
16GB，128GB |
||||
</view> |
||||
<view style="display: flex;align-items: center;justify-content: space-between;"> |
||||
<view class="num"> |
||||
x1 |
||||
</view> |
||||
<view class="price"> |
||||
<text style="font-size: 26upx;">¥</text> |
||||
<text>288</text> |
||||
</view> |
||||
</view> |
||||
|
||||
</view> |
||||
</view> |
||||
<view class="totalNum"> |
||||
<text>含运费¥5</text> |
||||
<text>共计：</text> |
||||
<text>¥2500</text> |
||||
</view> |
||||
<view class="footerBtn"> |
||||
<view class="wuliuBtn"> |
||||
调货记录 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return{ |
||||
searchText:'' |
||||
} |
||||
}, |
||||
methods:{ |
||||
|
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
page{ |
||||
min-height: 100%; |
||||
background-color: #F7F8FA; |
||||
padding:0 20upx; |
||||
} |
||||
.head-info{ |
||||
margin:22upx 20upx; |
||||
.searchContent{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
position: relative; |
||||
::v-deep .u-input{ |
||||
background: #FFFFFF; |
||||
border-radius: 30px 30px 30px 30px; |
||||
opacity: 1; |
||||
width:100%; |
||||
padding-left:90upx !important; |
||||
} |
||||
|
||||
.search{ |
||||
position: absolute; |
||||
top:20upx; |
||||
left:26upx; |
||||
z-index:9; |
||||
} |
||||
|
||||
|
||||
} |
||||
} |
||||
.bg{ |
||||
position: relative; |
||||
image{ |
||||
width:100%; |
||||
height:auto; |
||||
} |
||||
.text{ |
||||
height:100%; |
||||
width:100%; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
|
||||
font-size: 42upx; |
||||
font-family: YouSheBiaoTiHei, YouSheBiaoTiHei; |
||||
font-weight: 400; |
||||
color: #FFFFFF; |
||||
position: absolute; |
||||
left: 0; |
||||
top:0; |
||||
|
||||
} |
||||
} |
||||
.orderNum{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #707070; |
||||
margin:10upx 30upx; |
||||
|
||||
} |
||||
.dispatchContent{ |
||||
margin:20upx 0; |
||||
background: #FFFFFF; |
||||
// border-radius: 6px 6px 6px 6px; |
||||
opacity: 1; |
||||
padding:20upx 10upx; |
||||
} |
||||
.dispatchItem{ |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
image{ |
||||
width: 194upx; |
||||
height:194upx; |
||||
} |
||||
.right{ |
||||
flex:1; |
||||
margin-left:40upx; |
||||
position: relative; |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: space-around; |
||||
.title{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #3B3B3B; |
||||
|
||||
} |
||||
.subTitle{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #7C7C7C; |
||||
margin:14upx 0; |
||||
|
||||
} |
||||
.num{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #1E1E1E; |
||||
} |
||||
.price{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: flex-end; |
||||
font-size: 32upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #F21A1C; |
||||
|
||||
|
||||
} |
||||
} |
||||
} |
||||
.totalNum{ |
||||
text-align: right; |
||||
margin-top:70upx; |
||||
text:first-child{ |
||||
font-size: 24upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #B7B7B7; |
||||
|
||||
} |
||||
text:nth-child(2){ |
||||
font-size: 32upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #3B3B3B; |
||||
margin:0 10upx; |
||||
|
||||
} |
||||
text:nth-child(3){ |
||||
font-size: 32upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 600; |
||||
color: #F21A1C; |
||||
|
||||
} |
||||
} |
||||
|
||||
.footerBtn{ |
||||
padding:30upx; |
||||
display: flex; |
||||
align-items: center; |
||||
border-top:1px solid #F0F0F0; |
||||
justify-content: flex-end; |
||||
margin-top:30upx; |
||||
} |
||||
.wuliuBtn{ |
||||
// padding:8upx 46upx; |
||||
text-align: center; |
||||
height:70upx; |
||||
line-height: 66upx; |
||||
border:1px solid #F63116; |
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #F83F11; |
||||
border-radius:20px; |
||||
width:200upx; |
||||
} |
||||
|
||||
</style> |
||||
@ -0,0 +1,92 @@ |
||||
<template> |
||||
<view> |
||||
<view class="top"> |
||||
<u-field |
||||
v-model="name" |
||||
label="收货人" |
||||
placeholder="请填写" |
||||
> |
||||
</u-field> |
||||
<u-field |
||||
v-model="mobile" |
||||
label="手机号" |
||||
placeholder="请填写" |
||||
> |
||||
</u-field> |
||||
<u-field @click="showAction" v-model="address" |
||||
:disabled="true" label="所属城市" placeholder="请选择" |
||||
right-icon="arrow-down-fill" |
||||
></u-field> |
||||
<u-picker mode="region" v-model="show"></u-picker> |
||||
</view> |
||||
<view class="bottom"> |
||||
<view class="title"> |
||||
详细地址 |
||||
</view> |
||||
<u-input v-model="realAddr" placeholder="XX街道XX 小区1栋1单元101" type="textarea"></u-input> |
||||
</view> |
||||
<view class="footerBtn"> |
||||
保存修改 |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return{ |
||||
name:'', |
||||
mobile:'', |
||||
show:false, |
||||
address:'', |
||||
} |
||||
}, |
||||
methods:{ |
||||
showAction(){ |
||||
this.show = true; |
||||
}, |
||||
}, |
||||
mounted(){ |
||||
|
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
page{ |
||||
min-height:100%; |
||||
background-color: #F7F8FA; |
||||
} |
||||
.top{ |
||||
background-color: #fff; |
||||
padding:0 40upx; |
||||
margin-top:12upx; |
||||
} |
||||
.bottom{ |
||||
background-color: #fff; |
||||
margin-top:8upx; |
||||
padding:26upx 40upx; |
||||
.title{ |
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #3B3B3B; |
||||
margin-bottom: 30upx; |
||||
|
||||
} |
||||
} |
||||
.footerBtn{ |
||||
width:80%; |
||||
height: 100upx; |
||||
line-height: 100upx; |
||||
background: #FFAAA4; |
||||
border-radius: 6px 6px 6px 6px; |
||||
opacity: 1; |
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
text-align: center; |
||||
margin:64upx auto; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,209 @@ |
||||
<template> |
||||
<view class="vipInfo"> |
||||
<view class="msg"> |
||||
<text>价格区间(元)</text> |
||||
<text>会员加价率</text> |
||||
<text>利润空间(元</text> |
||||
</view> |
||||
<view class="classifyContainer"> |
||||
<view class="classifyItem" v-for="(item,index) in list" :key="index"> |
||||
<view class="classTitle"> |
||||
<text>{{item.name}}</text> |
||||
<u-icon name="arrow-right" color="#292929" size="28"></u-icon> |
||||
|
||||
</view> |
||||
<view class="priceRange"> |
||||
<view class="rangeItem" v-for="(p,i) in item.children" :key="i"> |
||||
<u-input placeholder="请设置" disabled v-model="p.priceRange"></u-input> |
||||
<u-input placeholder="请设置" disabled style="margin:0 60upx" v-model="p.rate"></u-input> |
||||
<u-input class="profit" disabled v-model="p.profit"></u-input> |
||||
|
||||
</view> |
||||
</view> |
||||
<view class="rangeBtn"> |
||||
<view class="rangeHandle" @click="addHandle(item)"> |
||||
<view class="addFlag">+</view> |
||||
<text>新增价格区间</text> |
||||
</view> |
||||
<view class="rangeHandle" @click="delHandle(item)" style="border-left:1px solid #E2E2E2;"> |
||||
<view class="delBtn">-</view> |
||||
<text>删除价格区间</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<setRange ref="setRange"></setRange> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import setRange from './components/setRange.vue' |
||||
export default{ |
||||
components:{setRange}, |
||||
data(){ |
||||
return{ |
||||
value:null, |
||||
value1:null, |
||||
list:[ |
||||
{ |
||||
name:'一级分类名称', |
||||
children:[ |
||||
{ |
||||
priceRange:'1', |
||||
rate:'1', |
||||
profit:'1' |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
name:'二级分类名称', |
||||
children:[ |
||||
{ |
||||
priceRange:'', |
||||
rate:'', |
||||
profit:'' |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
name:'三级分类名称', |
||||
children:[ |
||||
{ |
||||
priceRange:'', |
||||
rate:'', |
||||
profit:'' |
||||
} |
||||
] |
||||
}, |
||||
] |
||||
} |
||||
}, |
||||
methods:{ |
||||
addHandle(item){ |
||||
item.children.push({ |
||||
priceRange:'', |
||||
rate:'', |
||||
profit:'' |
||||
}) |
||||
this.$refs.setRange.afterSale = true; |
||||
}, |
||||
|
||||
delHandle(item){ |
||||
if(item.children.length>1){ |
||||
item.children.pop() |
||||
} |
||||
|
||||
|
||||
}, |
||||
|
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
page{ |
||||
min-height:100%; |
||||
padding-bottom:60upx; |
||||
} |
||||
|
||||
.vipInfo{ |
||||
.msg{ |
||||
background: #FFE7E7; |
||||
border-radius: 0px 0px 0px 0px; |
||||
opacity: 1; |
||||
padding:36upx 56upx; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
text{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #3B3B3B; |
||||
|
||||
} |
||||
} |
||||
.classifyContainer{ |
||||
.classifyItem{ |
||||
padding:36upx 56upx; |
||||
background-color: #fff; |
||||
margin-bottom:14upx; |
||||
.classTitle{ |
||||
|
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #292929; |
||||
|
||||
} |
||||
.priceRange{ |
||||
margin-top:40upx; |
||||
.rangeItem{ |
||||
margin:13upx 0; |
||||
display: flex; |
||||
} |
||||
|
||||
::v-deep .u-input{ |
||||
|
||||
// height: 64upx; |
||||
background: #FFFFFF; |
||||
border-radius: 2px 2px 2px 2px; |
||||
opacity: 1; |
||||
border: 1px solid #DADADA; |
||||
text-align: center !important; |
||||
|
||||
} |
||||
.profit{ |
||||
border:none !important; |
||||
background: transparent !important; |
||||
::v-deep .uni-input-placeholder{ |
||||
display: none; |
||||
} |
||||
} |
||||
} |
||||
.rangeBtn{ |
||||
display: flex; |
||||
margin-top:30upx; |
||||
border-top:1px solid #E6E6E6; |
||||
.rangeHandle{ |
||||
flex:1; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
margin-top:34rpx; |
||||
.addFlag{ |
||||
width: 30upx; |
||||
height: 30upx; |
||||
background: #FF6551; |
||||
border-radius:50%; |
||||
color:#fff; |
||||
line-height: 26upx; |
||||
text-align: center; |
||||
opacity: 1; |
||||
} |
||||
.delBtn{ |
||||
width: 30upx; |
||||
height: 30upx; |
||||
line-height: 26upx; |
||||
text-align: center; |
||||
background: #BDBDBD; |
||||
border-radius:50%; |
||||
color:#fff; |
||||
opacity: 1; |
||||
|
||||
} |
||||
text{ |
||||
|
||||
font-size: 24upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 400; |
||||
color: #3B3B3B; |
||||
margin-left:50upx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 492 B |
|
After Width: | Height: | Size: 8.4 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 5.9 KiB |
|
After Width: | Height: | Size: 6.3 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 15 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
Loading…
Reference in new issue