Compare commits
5 Commits
huipay-h5
...
ymt-groupS
| Author | SHA1 | Date |
|---|---|---|
 游梦婷
|
094c46e762 | 12 months ago |
|
游梦婷
|
89a7fa337c | 12 months ago |
|
游梦婷
|
d464e32946 | 12 months ago |
|
游梦婷
|
432f7667f5 | 12 months ago |
|
游梦婷
|
c3839f37ef | 12 months ago |
@ -1,22 +1,265 @@ |
||||
<template> |
||||
<view> |
||||
========={{key}}======== |
||||
</view> |
||||
<view class="all-container backcor9 pd-main font15"> |
||||
<view v-if="detailData"> |
||||
<view class="border-8r backcorfff marb10 pd-main border-box " > |
||||
<view class="bgLight border-8r paddbotm15 fcorfff"> |
||||
<view class="pd10 "> |
||||
<view class="font22 fontwig6 fontspec">{{detailData.name}}</view> |
||||
<view class=" dis-flex margle font18 mart10 "> |
||||
<view class=" dis-flex fontspec">现价:¥<view class="font18 fontwig6 ">{{detailData.price}}</view> |
||||
</view> |
||||
<view class="corf6 dis-flex fontspec margle text-lt font13" v-if="detailData.originalPrice">原价:¥<view>{{detailData.originalPrice}}</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class=" width100 circle pr"> |
||||
<view class="border-dash width100"></view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class=" paddtop10"> |
||||
<view class="dis-flex marb5" > |
||||
<view class="flex-s0 fcor333 paddtright10 fontwig6">限制</view> |
||||
<view class="dis-flex flex-1"> |
||||
{{detailData.astrict}} |
||||
</view> |
||||
</view> |
||||
<view class="dis-flex marb5" > |
||||
<view class="flex-s0 fcor333 paddtright10 fontwig6">须知</view> |
||||
<view class="dis-flex flex-1"> |
||||
<text>{{detailData.serviceTime}}</text> |
||||
<text class="icon-ymt to-right font13 fontColor "></text> |
||||
</view> |
||||
</view> |
||||
<!-- <view class="dis-flex marb5" > |
||||
<view class="flex-s0 fcor333 paddtright10 fontwig6">保障</view> |
||||
<view class="dis-flex flex-1"> |
||||
<text>随时退</text> |
||||
</view> |
||||
</view> --> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class=" font16 fontwig6 paddtop10 paddbotm10 "> |
||||
团购 |
||||
</view> |
||||
<view class="border-8r backcorfff marb10 font14 pd-main border-box " v-if="detailData.groupDetails"> |
||||
<view :class=" 'paddbotm5 '+(index<detailData.groupDetails.length-1?'border-b-666':'') " |
||||
v-for="(item,index) in detailData.groupDetails" :key="index"> |
||||
<view class="dis-flex paddtop5 "> |
||||
<view class="dot bgb2"></view> |
||||
<view class="fontwig6"> |
||||
{{item.name}} |
||||
</view> |
||||
</view> |
||||
<view class=" dis-flex flex-sp " v-for="(item2,index2) in item.list" :key="item2.id"> |
||||
<view class="flex-1 fc333 paddleft10 dis-flex "> |
||||
<view class="dot bg33"></view> |
||||
<view class="dis-flex flex-1 flex-sp"> |
||||
<view>{{item2.productName}}</view> |
||||
<view>({{item2.count}}份)</view> |
||||
</view> |
||||
</view> |
||||
<!-- <view class="flex-s0 paddleft10"> |
||||
￥{{item2.price}} |
||||
</view> --> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class=" font16 fontwig6 paddtop10 paddbotm10 "> |
||||
购买须知 |
||||
</view> |
||||
<view class="border-8r backcorfff marb10 font14 pd-main border-box "> |
||||
<view class=" paddbotm5 border-b-666 "> |
||||
<view class=" paddtop5 fontwig6">有效期</view> |
||||
<view class=" dis-flex paddleft10"> |
||||
<view class="dot bgb2"></view> |
||||
<view> |
||||
{{detailData.validity.replace(',','至') || ''}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class=" paddbotm5 border-b-666 "> |
||||
<view class=" paddtop5 fontwig6">使用时间</view> |
||||
<view class=" dis-flex paddleft10"> |
||||
<view class="dot bgb2"></view> |
||||
<view> |
||||
{{detailData.serviceTime || ''}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class=" paddbotm5 " v-if="detailData.storeGroupServeRule"> |
||||
<view class=" paddtop5 fontwig6">使用规则</view> |
||||
<view class=" dis-flex paddleft10"> |
||||
<view class="dot bgb2"></view> |
||||
<view> |
||||
{{detailData.storeGroupServeRule.content || ''}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="btn92 mart10 marb10" @click="comfirmVerify()"> |
||||
立即核销 |
||||
</view> |
||||
</view> |
||||
|
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data(){ |
||||
return{ |
||||
key:'', |
||||
import {getGroupContentByCode,gorOrderNotify} from '@/Utils/groupBuying.js'; |
||||
|
||||
const app = getApp(); |
||||
export default { |
||||
data(){ |
||||
return{ |
||||
groupCode:'', |
||||
detailData:null,//详情信息 |
||||
imgUrl: app.globalData.imgUrl, //图片访问地址 |
||||
instructionList:[],//使用须知 |
||||
|
||||
} |
||||
}, |
||||
onLoad(option){ |
||||
if(option.orderKey){ |
||||
this.groupCode = option.orderKey; |
||||
this.getGroupContentByCode();//查询信息 |
||||
} |
||||
|
||||
}, |
||||
methods:{ |
||||
getGroupContentByCode(){ |
||||
let params={ |
||||
groupCode:this.groupCode |
||||
} |
||||
uni.showLoading({ |
||||
title:"加载中...", |
||||
mask:true, |
||||
}) |
||||
getGroupContentByCode(params).then(res=>{ |
||||
uni.hideLoading(); |
||||
if (res.return_code == '000000') { |
||||
this.detailData = res.return_data; |
||||
|
||||
} else { |
||||
uni.showToast({ |
||||
title: res.return_msg, |
||||
icon: 'none', |
||||
duration: 2000 |
||||
}) |
||||
} |
||||
}) |
||||
}, |
||||
/* 立即核销 */ |
||||
comfirmVerify(){ |
||||
uni.showLoading({ |
||||
title:"核销中...", |
||||
mask:true, |
||||
}) |
||||
let params={ |
||||
groupCode:this.groupCode, |
||||
storeId:app.globalData.userInfo.store.id |
||||
} |
||||
gorOrderNotify(params).then(res=>{ |
||||
uni.hideLoading(); |
||||
if (res.return_code == '000000') { |
||||
uni.showToast({ |
||||
title:res.return_data, |
||||
icon: 'none', |
||||
duration: 2000 |
||||
}) |
||||
// setTimeout(()=>{ |
||||
// uni.navigateBack(); |
||||
// },1000) |
||||
|
||||
} else { |
||||
uni.showToast({ |
||||
title: res.return_msg, |
||||
icon: 'none', |
||||
duration: 2000 |
||||
}) |
||||
} |
||||
}) |
||||
}, |
||||
} |
||||
}, |
||||
onLoad(option){ |
||||
this.key = option.orderKey; |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
<style lang="scss" scoped> |
||||
.pr { |
||||
position: relative; |
||||
} |
||||
|
||||
.border-box{ |
||||
box-sizing: border-box; |
||||
} |
||||
.text-lt{ |
||||
text-decoration: line-through; |
||||
} |
||||
/* ======== */ |
||||
|
||||
.bgLight { |
||||
background-color: #089bf5; |
||||
} |
||||
|
||||
.pd10 { |
||||
padding: 10px; |
||||
} |
||||
|
||||
.border-dash { |
||||
border-bottom: 1px dashed #f6f6f6; |
||||
position: absolute; |
||||
top: 9px; |
||||
} |
||||
|
||||
.circle { |
||||
height:40px; |
||||
&::before { |
||||
content: ""; |
||||
width: 20px; |
||||
height: 20px; |
||||
background-color: #ffffff; |
||||
position: absolute; |
||||
left: -10px; |
||||
top: 0px; |
||||
display: block; |
||||
z-index: 99; |
||||
border-radius: 50%; |
||||
} |
||||
|
||||
&::after { |
||||
content: ""; |
||||
display: block; |
||||
width: 20px; |
||||
height: 20px; |
||||
background-color: #ffffff; |
||||
position: absolute; |
||||
right: -10px; |
||||
top: 0px; |
||||
z-index: 99; |
||||
border-radius: 50%; |
||||
|
||||
} |
||||
} |
||||
|
||||
//end |
||||
|
||||
//content |
||||
.dot { |
||||
width: 5px; |
||||
height: 5px; |
||||
border-radius: 50%; |
||||
flex-shrink: 0; |
||||
margin-right: 8px; |
||||
|
||||
&.bgb2 { |
||||
background-color: #b2b2b2; |
||||
} |
||||
|
||||
&.bg33 { |
||||
background-color: #333333; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,436 @@ |
||||
<template> |
||||
<view> |
||||
|
||||
<view class="headsearch width94 mart15 paddtop5 paddbotm10 fotct"> |
||||
|
||||
<view class="mart10 width90 alijusstart"> |
||||
<view class="fcorfff font14 margleri10 width60 fotlt">开始时间 :</view> |
||||
<picker mode="date" :value="startdate" :start="startDate" :end="endDate" @change="bindDateChange"> |
||||
<view class="datetim fcorfff">{{startdate}}<i class="down"></i></view> |
||||
</picker> |
||||
</view> |
||||
<view class="mart10 width90 alijusstart"> |
||||
<view class="fcorfff font14 margleri10 width60 fotlt">结束时间 :</view> |
||||
<picker mode="date" :value="enddate" :start="startDate" :end="endDate" @change="bindDateChange1"> |
||||
<view class="datetim fcorfff">{{enddate}}<i class="down"></i></view> |
||||
</picker> |
||||
</view> |
||||
|
||||
<view class="mart15 width90 alijusstart" v-if="userInfo.secUser.objectType == 2"> |
||||
<view class="fcorfff font14 margleri10 width25 fotlt">业务员 :</view> |
||||
<picker mode="selector" class="width75" :range="salesmanList" range-key="name" |
||||
@change="bindDateChange4"> |
||||
<view class="fcorfff fotrt font14" v-if="salesmanname">{{salesmanname}}<i class="down"></i></view> |
||||
<view class="fcorfff fotrt font14" v-else>请选择<i class="down"></i></view> |
||||
</picker> |
||||
</view> |
||||
|
||||
<view class="mart15 width90 alijusstart" |
||||
v-if="userInfo.secUser.objectType == 2 || userInfo.secUser.objectType == 3"> |
||||
<view class="fcorfff font14 margleri10 width25 fotlt">商户 :</view> |
||||
<picker mode="selector" class="width75" :range="merList" range-key="merName" @change="bindDateChange2"> |
||||
<view class="fcorfff fotrt font14" v-if="merName">{{merName}}<i class="down"></i></view> |
||||
<view class="fcorfff fotrt font14" v-else>请选择<i class="down"></i></view> |
||||
</picker> |
||||
</view> |
||||
|
||||
<view class="mart15 width90 alijusstart" |
||||
v-if="userInfo.secUser.objectType == 2 || userInfo.secUser.objectType == 3 || userInfo.secUser.objectType == 4"> |
||||
<view class="fcorfff font14 margleri10 width25 fotlt">门店 :</view> |
||||
<picker mode="selector" class="width75" :range="storeListByMer" range-key="name" |
||||
@change="bindDateChange3"> |
||||
<view class="fcorfff fotrt font14" v-if="storename">{{storename}}<i class="down"></i></view> |
||||
<view class="fcorfff fotrt font14" v-else>请选择<i class="down"></i></view> |
||||
</picker> |
||||
</view> |
||||
|
||||
<view class="input-box"> |
||||
<view class="icon search"></view> |
||||
<input placeholder="请输入订单编号" v-model="orderNo" placeholder-style="color:#c0c0c0;" @input="toSearch()" /> |
||||
</view> |
||||
</view> |
||||
|
||||
|
||||
<view class="width100 height90 backcorfff marb5 mart15" style="border-radius: 22px 0 22px 0;"> |
||||
<view class="width100 fotct height40p alijus font20 fcor333"> |
||||
<view class="width50"> |
||||
{{totalPrice}} 元 |
||||
</view> |
||||
<view class="width50 "> |
||||
{{totalNum}} 笔 |
||||
</view> |
||||
<!-- <view style="width: 1px;" class="height80 backcor6"></view> --> |
||||
</view> |
||||
<view class="width100 fotct height40p alijus font14 fcor333"> |
||||
<view class="width50 "> |
||||
交易金额 |
||||
</view> |
||||
<view class="width50"> |
||||
交易笔数 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view v-if="notesList == ''" class="mart60 fotct font14 fcor666"> |
||||
<image mode="widthFix" style="width: 70vw;" src="/static/img/noorder.png"></image> |
||||
</view> |
||||
<view class="width100 backcorfff" v-for="(item,index) in notesList" :key="index" |
||||
@click="jumpOderdetails(item.outTradeNo)"> |
||||
<view class="width94 paddtop10 paddbotm10 alijusstart bor-botm1"> |
||||
<view class="width15"> |
||||
<image src="/static/img/wechat.png" mode="widthFix" class="iconw40" |
||||
v-if="item.payMode == 'WECHAT'"></image> |
||||
<image src="/static/img/alipay.png" mode="widthFix" class="iconw40" |
||||
v-if="item.payMode == 'ALIPAY'"></image> |
||||
</view> |
||||
|
||||
<view class="width85"> |
||||
<view class="font15 fcor666 width100">{{item.outTradeNo}}</view> |
||||
<view class="alijusstart font14 fcor999"> |
||||
<view class="width50 text1">扫一扫</view> |
||||
<view class="width50 fotrt">{{statusList[item.status]}}</view> |
||||
</view> |
||||
<view class="alijusstart font14 paddtop5 fcor999"> |
||||
<view class="width15 text1" v-if="userInfo.secUser.objectType == 2">{{item.salesmanName}}</view> |
||||
<view class="width85 text1" v-if="userInfo.secUser.objectType != 2">{{item.storeName}}</view> |
||||
<view class="width85 fotrt" v-if="userInfo.secUser.objectType == 2">{{item.storeName}}</view> |
||||
</view> |
||||
<view class="alijusstart font14 paddtop5 fcor999"> |
||||
<view class="width70">{{item.createTime | timeFormat('yyyy-mm-dd hh:mm:ss')}} |
||||
</view> |
||||
<view class="width30 fotrt">¥ {{item.tradeAmount}}</view> |
||||
</view> |
||||
|
||||
</view> |
||||
</view> |
||||
|
||||
</view> |
||||
|
||||
<!-- <view @click="scanCode()"> |
||||
扫码核销 |
||||
</view> --> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import { |
||||
getTradeOrderList, |
||||
getMerList, |
||||
getStoreListByMer, |
||||
querySalesmanList |
||||
} from '@/Utils/Api.js'; |
||||
let app = getApp(); |
||||
export default { |
||||
data() { |
||||
const currentDate = this.getDate({ |
||||
format: true |
||||
}) |
||||
return { |
||||
startdate: currentDate, |
||||
enddate: currentDate, |
||||
notesList: [], |
||||
statusList: { |
||||
1: "待支付", |
||||
2: "支付中", |
||||
3: "支付成功", |
||||
4: "支付失败", |
||||
5: "已取消", |
||||
6: "已退款" |
||||
}, |
||||
pageNum: 1, |
||||
pageSize: 10, |
||||
isNoMoreData: false, //是否加载中 |
||||
orderNo: '', //订单编号 |
||||
totalPrice: 0, //总价格 |
||||
totalNum: 0, //总笔数 |
||||
userInfo: app.globalData.userInfo, //登录信息 |
||||
merList: [], // 商户列表 |
||||
merno: '', //商户编号 |
||||
merName: '', //商户名称 |
||||
storeListByMer: [], //门店列表 |
||||
storeno: '', //门店编号 |
||||
storename: '', //门店名称, |
||||
salesmanList: [], //业务员列表 |
||||
salesmanid: '', //业务员id |
||||
salesmanname: '', //业务员名称 |
||||
} |
||||
}, |
||||
computed: { |
||||
startDate() { |
||||
return this.getDate('start'); |
||||
}, |
||||
endDate() { |
||||
return this.getDate('end'); |
||||
} |
||||
}, |
||||
onLoad() { |
||||
//代理商 |
||||
if (this.userInfo.secUser.objectType == 2) { |
||||
this.querySalesmanList(); |
||||
} |
||||
//业务员 |
||||
if (this.userInfo.secUser.objectType == 3) { |
||||
this.getMerList(this.userInfo.salesman.id); |
||||
} |
||||
//商户 |
||||
if (this.userInfo.secUser.objectType == 4) { |
||||
this.getStoreListByMer(this.userInfo.mer.id); |
||||
} |
||||
this.getTradeOrderList(); |
||||
}, |
||||
onReachBottom() { |
||||
this.getTradeOrderList(); |
||||
}, |
||||
|
||||
methods: { |
||||
scanCode(){ |
||||
// wx.scanQRCode({ |
||||
// needResult: 0, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果， |
||||
// scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码，默认二者都有 |
||||
// success: function (res) { |
||||
// var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果 |
||||
// } |
||||
// }); |
||||
}, |
||||
//代理商查询业务员 |
||||
querySalesmanList() { |
||||
let datas = { |
||||
pageNum: 1, |
||||
pageSize: 9999, |
||||
agentId: this.userInfo.agent.id |
||||
} |
||||
querySalesmanList(datas).then(res => { |
||||
if (res.return_code == '000000' && res.return_data.list != '') { |
||||
this.salesmanList = res.return_data.list; |
||||
// this.salesmanid = res.return_data.list[0].id; |
||||
// this.getStoreListByMer(res.return_data.list[0].id); |
||||
// this.salesmanname = res.return_data.list[0].name; |
||||
} |
||||
}) |
||||
}, |
||||
//业务员查询商户 |
||||
getMerList(item) { |
||||
let datas = { |
||||
pageNum: 1, |
||||
pageSize: 9999, |
||||
merStatus:1, |
||||
salesmanId: item |
||||
} |
||||
getMerList(datas).then(res => { |
||||
if (res.return_code == '000000' && res.return_data.list != '') { |
||||
this.merList = res.return_data.list; |
||||
// this.merno = res.return_data.list[0].id; |
||||
// this.getStoreListByMer(res.return_data.list[0].id); |
||||
// this.merName = res.return_data.list[0].merName; |
||||
} |
||||
}) |
||||
}, |
||||
//商户查询门店 |
||||
getStoreListByMer(item) { |
||||
let datas = { |
||||
pageNum: 1, |
||||
pageSize: 9999, |
||||
merId: item |
||||
} |
||||
getStoreListByMer(datas).then(res => { |
||||
if (res.return_code == '000000' && res.return_data.list != '') { |
||||
this.storeListByMer = res.return_data.list; |
||||
// this.storeno = res.return_data.list[0].id; |
||||
// this.storename = res.return_data.list[0].name; |
||||
} |
||||
}) |
||||
}, |
||||
//时间修改 |
||||
getDate(type) { |
||||
const date = new Date(); |
||||
let year = date.getFullYear(); |
||||
let month = date.getMonth() + 1; |
||||
let day = date.getDate(); |
||||
|
||||
if (type === 'start') { |
||||
year = year - 60; |
||||
} else if (type === 'end') { |
||||
year = year + 2; |
||||
} |
||||
month = month > 9 ? month : '0' + month;; |
||||
day = day > 9 ? day : '0' + day; |
||||
return `${year}-${month}-${day}`; |
||||
}, |
||||
//选择时间 |
||||
bindDateChange(e) { |
||||
this.startdate = e.target.value; |
||||
this.pageNum = 1; |
||||
this.notesList = []; |
||||
this.isNoMoreData = false; |
||||
this.getTradeOrderList(); |
||||
}, |
||||
bindDateChange1(e) { |
||||
this.enddate = e.target.value; |
||||
this.pageNum = 1; |
||||
this.notesList = []; |
||||
this.isNoMoreData = false; |
||||
this.getTradeOrderList(); |
||||
}, |
||||
//业务员 |
||||
bindDateChange4(e) { |
||||
this.salesmanid = this.salesmanList[e.target.value].id; |
||||
this.salesmanname = this.salesmanList[e.target.value].name; |
||||
this.getMerList(this.salesmanList[e.target.value].id); |
||||
this.pageNum = 1; |
||||
this.notesList = []; |
||||
this.isNoMoreData = false; |
||||
this.getTradeOrderList(); |
||||
}, |
||||
//商户 |
||||
bindDateChange2(e) { |
||||
this.merno = this.merList[e.target.value].id; |
||||
this.merName = this.merList[e.target.value].merName; |
||||
this.getStoreListByMer(this.merList[e.target.value].id); |
||||
this.pageNum = 1; |
||||
this.notesList = []; |
||||
this.isNoMoreData = false; |
||||
this.getTradeOrderList(); |
||||
}, |
||||
//门店 |
||||
bindDateChange3(e) { |
||||
this.storeno = this.storeListByMer[e.target.value].id; |
||||
this.storename = this.storeListByMer[e.target.value].name; |
||||
this.pageNum = 1; |
||||
this.notesList = []; |
||||
this.isNoMoreData = false; |
||||
this.getTradeOrderList(); |
||||
}, |
||||
|
||||
toSearch() { |
||||
this.pageNum = 1; |
||||
this.notesList = []; |
||||
this.isNoMoreData = false; |
||||
this.getTradeOrderList(); |
||||
}, |
||||
//查询列表 |
||||
getTradeOrderList() { |
||||
uni.showLoading({ |
||||
title: '加载中...' |
||||
}) |
||||
if (this.isNoMoreData) { |
||||
uni.hideLoading() |
||||
return false; |
||||
} |
||||
let a = new Date(this.startdate).getTime(); |
||||
let b = new Date(this.enddate).getTime(); |
||||
let startTime = a - 28800000; |
||||
let endTime = b + 57599000; |
||||
let pagenum = this.pageNum; |
||||
let datas = { |
||||
status: 3, |
||||
payTimeS: startTime, |
||||
payTimeE: endTime, |
||||
outTradeNo: this.orderNo, |
||||
pageNum: pagenum, |
||||
salesmanId:this.salesmanid, |
||||
merId: this.merno, |
||||
storeId: this.storeno, |
||||
pageSize: this.pageSize |
||||
} |
||||
getTradeOrderList(datas).then(res => { |
||||
uni.hideLoading(); |
||||
if (res.return_code == '000000' && res.return_data.pageInfo.list) { |
||||
this.totalPrice = res.return_data.totalPrice; |
||||
this.totalNum = res.return_data.totalNum; |
||||
this.isNoMoreData = res.return_data.pageInfo.list.length == this.pageSize ? false : true; |
||||
this.notesList = this.notesList.concat(res.return_data.pageInfo.list); |
||||
if (res.return_data.pageInfo.total == (this.pageNum * this.pageSize)) { |
||||
this.isNoMoreData = true; |
||||
} |
||||
this.pageNum = res.return_data.pageInfo.list.length == this.pageSize ? ++pagenum : pagenum; |
||||
} else { |
||||
this.notesList = []; |
||||
uni.showToast({ |
||||
title: res.return_msg, |
||||
duration: 2000, |
||||
icon: 'none' |
||||
}) |
||||
} |
||||
}) |
||||
}, |
||||
//跳转详情 |
||||
jumpOderdetails(item) { |
||||
uni.navigateTo({ |
||||
url: '/pages/index/order-list-details/order-list-details?orderid=' + item |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss"> |
||||
page { |
||||
background-color: #f8f9f9; |
||||
} |
||||
|
||||
.input-box { |
||||
width: 90%; |
||||
margin-left: 5%; |
||||
margin-top: 15px; |
||||
margin-bottom: 15px; |
||||
height: 70rpx; |
||||
background-color: #f5f5f5; |
||||
border-radius: 10rpx; |
||||
position: relative; |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
.icon { |
||||
display: flex; |
||||
align-items: center; |
||||
position: absolute; |
||||
top: 2px; |
||||
left: 5px; |
||||
width: 60upx; |
||||
height: 60upx; |
||||
font-size: 34upx; |
||||
color: #c0c0c0; |
||||
} |
||||
|
||||
input { |
||||
padding-left: 50upx; |
||||
height: 28upx; |
||||
font-size: 28upx; |
||||
width: 100%; |
||||
} |
||||
} |
||||
|
||||
i { |
||||
border: solid #ffffff; |
||||
border-width: 0 2px 2px 0; |
||||
display: inline-block; |
||||
padding: 4px; |
||||
margin-left: 10px; |
||||
vertical-align: 3px; |
||||
} |
||||
|
||||
.down { |
||||
-webkit-transform: rotate(45deg); |
||||
} |
||||
|
||||
.font306adb { |
||||
color: #306adb; |
||||
} |
||||
|
||||
.stus { |
||||
float: right; |
||||
margin-right: 20px; |
||||
} |
||||
|
||||
.headsearch { |
||||
border-radius: 8px; |
||||
background-color: #4c7fe6; |
||||
} |
||||
|
||||
.datetim { |
||||
width: 130px; |
||||
height: 30px; |
||||
line-height: 30px; |
||||
text-align: right; |
||||
border-radius: 15px; |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue