shop-applet/pages/index/index.vue

2019 lines
42 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="content">
<view class="content-top">
<view class="content-tops">
<view class="content-top_img" v-if="Object.keys(userInfoData).length>0">
<image :src="userInfoData.avatar" v-if="userInfoData.avatar" mode="aspectFill" @click="logout">
</image>
<image src="@/static/images/f.png" v-else mode="aspectFit" @click="logout"></image>
</view>
<view class="content-top_img" v-else @click="login">
<image src="@/static/images/f.png" mode="aspectFit"></image>
</view>
<view class="content-top-title" @click="shopp" v-if="Object.keys(userInfoData).length>0">
<view class="top-titlea">
{{userInfoData.mer_info.mer_name?userInfoData.mer_info.mer_name:'暂无信息'}}
</view>
<view class="top-titleb">
<image src="@/static/images/you.png" mode=""></image>
</view>
</view>
<view class="content-top-title" @click="login" v-else>
<view class="top-titlea">
请登录
</view>
<view class="top-titleb">
<image src="@/static/images/you.png" mode=""></image>
</view>
</view>
</view>
<retuntop style="margin-top: 20rpx; margin-right: 50rpx;" />
</view>
<view class="content-middle">
<view class="content-middlea" v-for="(item,index) in list" :key='index'>
<view class="content-middlea-one">
{{item.name}}
</view>
<view class="content-middlea-two">
{{item.value}}
</view>
</view>
</view>
<view class="content-open" v-if='!isshow' @click="open">
<image src="@/static/images/zk.png" mode="aspectFit"></image>
</view>
<div v-if='isshow' style="margin-top: 80rpx;">
<!-- // type=price&time=today&merId=1 -->
<view class="tools-one"
style="font-size: 33rpx;font-family: PingFang SC-Medium, PingFang SC;font-weight: 500;color: #333333; margin-left: 30rpx;margin-bottom: 30rpx;">
订单数据统计
</view>
<ordertime ref='test' type='price' timetype='today' :merid='userInfoData.service.mer_id'></ordertime>
</div>
<view class="content-bottom" v-else>
<view class="content-order">
<view class="" v-for="(item,i) in order" :key='i' @click="shopporder(item)">
<view class="content-order-two">
{{item.value}}
</view>
<view class="content-order-one">
{{item.name}}
</view>
</view>
</view>
<view class="content-tools">
<view class="tools-one">
常用工具
<view class=""></view>
</view>
<view class="tools-two">
<view class="" v-for="(item,k) in typelist" :key='k' @click="navation(item)">
<view class="tools-two-img">
<image :src="item.image" mode=""></image>
</view>
<view class="tools-two-title"> {{item.name}}</view>
</view>
</view>
</view>
<view class="content-list">
<view class="tools-one">
订单列表
<view class=""></view>
</view>
<view class="content-list-one" v-for="(item,u) in productList" :key="u">
<view class="list-one">
<view class="list-one_left">
<view class="list-one_left-a">
<image src="@/static/images/f.png" mode="aspectFit"></image>
</view>
<view class="list-one_left-b">{{item.real_name}}</view>
<view class="list-one_left-c">
<image src="@/static/images/you.png" mode="aspectFit"></image>
</view>
</view>
<view class="list-one_right">
<view class="list-one_right-a">{{item.pay_time}}拍下 </view>
<view class="list-one_right-c">
</view>
<view class="list-one_right-b">待发货</view>
</view>
</view>
<view class="" v-for="(g,h) in item.orderProduct">
<view class="list-two">
<view class="list-two_left">
<image :src="g.cart_info.product.image" mode=""></image>
</view>
<view class="list-two_middle">
<view class="two_middle-title-a">
<view class="two_middle-title-a-left">{{ g.cart_info.product.store_name }}</view>
<view class="two_middle-title-a-right">
<view class="title-price">¥<span
style="font-size: 37rpx;font-weight: 600;">{{g.product_price.split('.')[0]}}.</span>
<span>{{g.product_price.split('.')[1]}}</span><strong></strong>
</view>
<view class="title-number">X{{g.product_num}}</view>
</view>
</view>
<view class="two_middle-title-b">
<view class="title-number">共{{g.product_num}}件 </view>
<view class="title-price">实收: <span style="color: #F84221;">¥</span><span
style="font-size: 37rpx; color: #F84221;">{{g.cart_info.productAttr.price.split('.')[0] }}.</span><span
style="color: #F84221;">{{g.cart_info.productAttr.price.split('.')[1] }}</span>(含快递:¥0.00
</view>
</view>
</view>
</view>
<view class="list-three">
<view class="list-three-one">
<view class="title-img">
<image src="@/static/images/dz.png" mode="aspectFit"></image>
</view>
<view class="order_id">
订单编号{{item.order_sn}}
</view>
</view>
<view class="list-three-one">
<view class="title-img">
<image src="@/static/images/zb.png" mode="aspectFit"></image>
</view>
<view class="adress">{{item.real_name}} {{ item.user_phone}} {{item.user_address}}
</view>
</view>
</view>
</view>
<view class="list-four">
<view class="btn" @click="refundModify(item,1)">备注</view>
<view class="btn1" @click="shopdetail(item)">去发货</view>
</view>
</view>
<view class="conter-img" v-if='productList.length == 0'>
<image src="@/static/images/noCart.png" mode="aspectFit"></image>
</view>
<view class='loadingicon acea-row row-center-wrapper' v-if='productList.length > 0'>
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
</view>
</view>
<view>
<view class="priceChange" :class="refundMark === true ? 'on' : ''">
<view class="priceTitle">
订单备注
<span class="iconfont icon-guanbi" @click="refundMark = false"></span>
</view>
<view class="listChange">
<textarea placeholder="请填写备注信息..." v-model="refundInfo.remark"></textarea>
</view>
<view class="modify" @click="save">
确认提交
</view>
</view>
<view class="mask" @touchmove.prevent v-show="refundMark === true"></view>
</view>
<uni-popup ref="popup1" type="left">
<view class="left-content">
<view class="left-content-left">
<view class="content-top_img" v-if="Object.keys(userInfoData).length>0">
<image :src="userInfoData.avatar" v-if="userInfoData.avatar" mode="aspectFill"></image>
<image src="@/static/images/f.png" v-else mode="aspectFit"></image>
</view>
<view class="content-top_img" v-else @click="login">
<image src="@/static/test/KH.png" mode="aspectFit"></image>
</view>
<view class="content-top_txt">{{userInfoData.account}}</view>
</view>
<view class="left-content-right">
<view class="content-right-one" v-if="Object.keys(userInfoData).length>0">
<view class="content-right-onea">{{userInfoData.mer_info.mer_name}}</view>
<view class="content-right-oneb">
<image src="@/static/images/you.png" mode=""></image>
</view>
</view>
<view class="content-right-two">
</view>
<view class="content-right-botm" @click="login()">
退出
</view>
</view>
</view>
</uni-popup>
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"
:isGoIndex="false"></authorize>
<view class="settlementAgreement" v-if="isFshow">
<view class="setAgCount" style="width: 100%;height: 100%; padding-top: 160rpx;">
<!-- <i class="icon iconfont icon-cha" @click="recuo"></i> -->
<view class="" style="width: 60rpx;height: 60rpx; position: absolute;right: 30rpx; top:80rpx"
@click="recuo">
<image src="@/static/images/close.png" mode="aspectFit" style="width: 60rpx;height: 60rpx;"></image>
</view>
<div class="title">{{detail.title}}</div>
<view style="margin: 20rpx 0;">甲方公司:{{company?company:"暂无公司信息"}}</view>
<view style="margin: 20rpx 0;">机构代码:{{organization_code?organization_code:"暂无公司信息"}}</view>
<view class="contenta">
<jyf-parser :html="detail.mer_settlement_agree" ref="article" :tag-style="tagStyle"></jyf-parser>
</view>
<view class="setAgCountbtn">
<button class="setAgCountbtna" @click="refuse">
拒绝
</button>
<button :class="num>0?'setAgCountbtnb':'setAgCountbtnc'" :disabled="num!=0" @click="agree">
<text v-if="num>0">请仔细阅读协议{{num}}S</text>
<text v-else>同意</text>
</button>
</view>
</view>
</view>
<uni-popup ref="popup" type="bottom">
<view class="userpage">
<view class="userpage-icon" @click="close">
<image src="@/static/images/close.png" mode=""></image>
</view>
<form report-submit='true' style="height: 100%;">
<view class='merchantsSettled' :style="{'height':Fheight}">
<view class="title">填写信息</view>
<view class='list'>
<view class="item">
<view class="acea-row row-middle">
<text class="item-name">开户行名称:</text>
<input type="text" maxlength="30" placeholder="请输入开户行名称"
v-model="merchantData.bank_username" @input="validateBtn"
placeholder-class='placeholder' />
</view>
</view>
<view class="item">
<view class="acea-row row-middle">
<text class="item-name">联系电话:</text>
<input type="text" placeholder="请输入手机号" v-model="merchantData.phone"
@input="validateBtn" placeholder-class='placeholder' />
</view>
</view>
<view class="item">
<view class="acea-row row-middle">
<text class="item-name">开户行:</text>
<input type="text" placeholder="请输入开户行" v-model="merchantData.bank_opening"
@input="validateBtn" placeholder-class='placeholder' />
</view>
</view>
<view class="item">
<view class="acea-row row-middle">
<text class="item-name">身份证正面:</text>
</view>
<view class="item-card">
<view class="item-carda" @click='uploadpic({type:1})'
v-if='merchantData.cardno_front.length==0'>
<image src="@/static/images/SFZZ.png" mode="aspectFit"></image>
</view>
<view class="item-carda" @click='DelPic({type:1})' v-else>
<image :src="merchantData.cardno_front" mode="aspectFit"></image>
</view>
<view class="item-cardb" @click='uploadpic({type:2})'
v-if='merchantData.cardno_back.length==0'>
<image src="@/static/images/SFFF.png" mode="aspectFit"></image>
</view>
<view class="item-cardb" @click='DelPic({type:2})' v-else>
<image :src="merchantData.cardno_back" mode="aspectFit"></image>
</view>
</view>
</view>
<view class="item">
<view class="acea-row row-middle">
<text class="item-name">银行卡反面:</text>
</view>
<view class="item-card">
<view class="item-carda" @click='uploadpic({type:3})'
v-if='merchantData.bank_front.length==0'>
<image src="@/static/images/YHKZ.png" mode="aspectFit"></image>
</view>
<view class="item-carda" @click='DelPic({type:3})' v-else>
<image :src="merchantData.bank_front" mode="aspectFit"></image>
</view>
<view class="item-cardb" @click='uploadpic({type:4})'
v-if='merchantData.bank_back.length==0'>
<image src="@/static/images/YHKF.png" mode="aspectFit"></image>
</view>
<view class="item-cardb" @click='DelPic({type:4})' v-else>
<image :src="merchantData.bank_back" mode="aspectFit"></image>
</view>
</view>
</view>
<button class='submitBtn' :class="validate === true? 'on':''" @click="formSubmit">
提交申请
</button>
</view>
</view>
</form>
</view>
</uni-popup>
</view>
</template>
<script>
import authorize from '@/components/Authorize';
import ordertime from './component/timelist.vue'
import retuntop from '@/components/content-top/index.vue';
import {
setAdminOrderRemark
} from "@/api/admin";
import {
merstreet,
getUserInfo
} from '@/api/user.js';
import {
business,
intention,
intentionbus
} from "@/api/product"
import image from '../../uni_modules/uview-ui/libs/config/props/image';
import {
orderStatistics,
getOrderList
} from "@/api/admin";
export default {
components: {
authorize,
ordertime,
retuntop
},
data() {
return {
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
list: [{
name: '今日成交额',
value: 0
}, {
name: '今日订单数',
value: 0
}, {
name: '本月订单数',
value: 0
}],
order: [{
name: '待付款',
type: 1,
value: 0
}, {
name: '待发货',
type: 2,
value: 0
}, {
name: '待收货',
type: 3,
value: 0
}, {
name: '待评价',
type: 4,
value: 0
}, {
name: '退款',
type: 6,
value: 0
}],
typelist: [{
name: '商品管理',
type: 1,
image: require('@/static/images/index7.png')
}, {
name: '订单管理',
type: 2,
image: require('@/static/images/index1.png')
}, {
name: '供货采购',
type: 3,
image: require('@/static/images/index4.png')
},
{
name: '进货管理',
type: 4,
image: require('@/static/images/index5.png')
}, {
name: '提现管理',
type: 5,
image: require('@/static/images/index8.png')
}, {
name: '客服记录',
type: 6,
image: require('@/static/images/index6.png')
}, {
name: '订单核销',
type: 7,
image: require('@/static/images/index2.png')
}, {
name: '全部',
type: 8,
image: require('@/static/images/index3.png')
}
],
refundInfo: {},
company: '',
organization_code: '',
show: false,
refundMark: false,
where: {
page: 1,
limit: 3,
status: 2
},
loadend: false,
loading: false,
loadTitle: '加载更多',
emptyShow: false,
productList: [],
userid: '',
userInfoData: {},
isshow: false,
where1: {
product_type: 0
},
codenote: [],
validate: false,
merchantData: {
bank_username: '',
bank_opening: '',
bank_front: '',
bank_back: '',
cardno_front: '',
cardno_back: ''
},
Fheight: 0,
isFshow: false,
detail: {},
tagStyle: {
img: 'width:100%;display:block;'
},
num: 10
}
},
onPullDownRefresh() {
this.getGoods(true)
uni.stopPullDownRefresh()
},
onLoad() {
this.getUserInfo()
this.list1()
this.Fheight = uni.getSystemInfoSync().windowHeight + 'px';
},
onReachBottom() {
if (this.productList.length > 0) {
setTimeout(() => {
this.getGoods(false);
}, 1000)
}
},
mounted() {
this.list1()
},
onShow() {
this.getUserInfo()
},
beforeDestroy() {
// 销毁监听事件
this.$bus.$off('value-updated')
},
methods: {
//关闭弹窗
close() {
this.$refs.popup.close()
this.num = 15
},
//获取交易信息
codelist() {
intention(this.where).then(res => {
this.codenote = res.data.list
})
},
//跳转订单
shopporder(item) {
if (this.userid) {
switch (item.type) {
case 1:
uni.navigateTo({
url: '/pages/admin/orderList/index?merId=' + this.userInfoData.service.mer_id +
'&types=' + item.type
})
break;
case 2:
uni.navigateTo({
url: '/pages/admin/orderList/index?merId=' + this.userInfoData.service.mer_id +
'&types=' + item.type
})
break;
case 3:
uni.navigateTo({
url: '/pages/admin/orderList/index?merId=' + this.userInfoData.service.mer_id +
'&types=' + item.type
})
break;
case 4:
uni.navigateTo({
url: '/pages/admin/orderList/index?merId=' + this.userInfoData.service.mer_id +
'&types=' + item.type
})
break;
case 6:
uni.navigateTo({
url: '/pages/admin/orderList/index?merId=' + this.userInfoData.service.mer_id +
'&types=' + item.type
})
break;
}
} else {
this.isAuto = true;
this.isShowAuth = true
}
},
//提交
formSubmit: function(e) {
let that = this;
if (that.validateForm() && that.validate) {
that.validate = false;
intentionbus(that.merchantData).then(res => {
if (res.status == 200) {
this.$refs.popup.close()
that.$util.Tips({
title: '提交成功'
});
this.codelist()
that.timer = setTimeout(() => {
that.successful = true;
that.validate = true;
}, 1000)
}
}).catch(res => {
that.validate = true;
this.num = 15
this.$refs.popup.close()
that.$util.Tips({
title: res
});
})
}
},
//备注弹窗
refundModify(item) {
this.refundInfo = item;
this.refundMark = true;
},
//同意
agree() {
this.$refs.popup.open()
this.isFshow = false
},
//拒绝
refuse() {
this.isFshow = false
},
//关闭弹窗
recuo() {
if (this.num > 0) {
this.num = 15
this.isFshow = false
} else {
this.num = 15
this.isFshow = false
}
},
countDown() {
let {
num
} = this;
// if (num === 3) this.nums = true;
num = num > 0 ? num - 1 : "0";
setTimeout(() => {
this.num = num;
if (num == '0') {
// this.launchApp()
return
}
if (this.isFshow == false && this.num > 0) {
this.num = 15
return
}
this.countDown();
}, 1000);
},
//验证
validateBtn: function() {
let that = this,
value = that.merchantData;
if (value.bank_username && value.bank_opening) {
if (!that.isShowCode) {
that.validate = true;
} else {
if (that.codeVal) {
that.validate = true;
} else {
that.validate = false;
}
}
} else {
that.validate = false;
}
},
validateForm: function() {
let that = this,
value = that.merchantData;
if (!value.bank_username) return that.$util.Tips({
title: '请输入银行账户姓名'
});
if (!value.bank_opening) return that.$util.Tips({
title: '请输入开户行'
});
if (value.bank_front.length == 0) return that.$util.Tips({
title: '请上传一张或者多张图片'
});
if (value.bank_back.length == 0) return that.$util.Tips({
title: '请上传一张或者多张图片'
});
if (value.cardno_front.length == 0) return that.$util.Tips({
title: '请上传一张或者多张图片'
});
if (value.cardno_back.length == 0) return that.$util.Tips({
title: '请上传一张或者多张图片'
});
that.validate = true;
return true;
},
/**
* 上传文件
*
*/
uploadpic(data) {
let that = this;
if (data.type == 1) {
that.$util.uploadImageOne('upload/image', function(res) {
that.merchantData.cardno_front = res.data.path
});
} else if (data.type == 2) {
that.$util.uploadImageOne('upload/image', function(res) {
that.merchantData.cardno_back = res.data.path
});
} else if (data.type == 3) {
that.$util.uploadImageOne('upload/image', function(res) {
that.merchantData.bank_front = res.data.path
});
} else {
that.$util.uploadImageOne('upload/image', function(res) {
that.merchantData.bank_back = res.data.path
});
}
},
//删除图片
DelPic(data) {
let that = this;
if (data.type == 1) {
that.merchantData.cardno_front = ''
} else if (data.type == 2) {
that.merchantData.cardno_back = ''
} else if (data.type == 3) {
that.merchantData.bank_front = ''
} else {
that.merchantData.bank_back = ''
}
},
//个人详情
logout() {
this.$refs.popup1.open()
},
//登录
login() {
uni.redirectTo({
url: '/pages/users/login/login_copy'
})
},
//获取协议内容
list1() {
business({
type: 'mer_settlement_agree'
}).then(res => {
this.detail = res.data
})
},
//跳转
shopp() {
if (this.userInfoData.mer_info.type_id == 12) {
uni.navigateTo({
url: `/pages/nongKe/supply_chain/merchant?id=${this.userInfoData.service.mer_id}`
})
} else {
uni.navigateTo({
url: `/pages/store/home/index?id=` + this.userInfoData.service.mer_id + `&type=7`
})
}
},
//界面跳转
shopdetail(item) {
uni.navigateTo({
url: '/pages/admin/orderDetail/index?id=' + item.order_id + '&mer_id=' + this.userInfoData
.service.mer_id
})
},
//获取订单数据
getindex() {
const data = {
product_type: this.where1.product_type
}
orderStatistics(this.userInfoData.service.mer_id, data).then(
res => {
this.order[0].value = res.data.order.unpaid
this.order[1].value = res.data.order.unshipped
this.order[2].value = res.data.order.untake
this.order[3].value = res.data.order.unevaluate
this.order[4].value = res.data.order.refund
this.list[0].value = res.data.data.today.payPrice
this.list[1].value = res.data.data.today.orderNum
this.list[2].value = res.data.data.month.orderNum
},
err => {
that.$util.Tips({
title: err.msg
})
}
);
},
open() {
this.isshow = !this.isshow
if (this.isshow) {
setTimeout((res) => {
this.$refs.test.timelist()
}, 1000)
}
},
// 授权回调
onLoadFun(data) {
this.getUserInfo();
this.isShowAuth = false;
},
/**
* 获取个人用户信息
*/
getUserInfo() {
getUserInfo().then(res => {
this.userid = res.data.uid
this.userInfoData = res.data
if (res.data.mer_info.length == 0) {
uni.showModal({
title: '暂无商户信息'
})
} else {
this.getindex()
this.getGoods(true)
}
merstreet({
street_code: res.data.mer_info.street_id
}).then((res) => {
if (res.code == 0) {
// this.$util.Tips({
// title: res.msg
// });
return false;
}
this.company = res.data.title
this.organization_code = res.data.organization_code
}).catch(res => {
console.log(res)
})
});
},
// 备注
save() {
let that = this;
if (!that.refundInfo.remark) {
return this.$util.Tips({
title: '请输入备注'
})
}
setAdminOrderRemark(that.userInfoData.service.mer_id, that.refundInfo.order_id, {
remark:that.refundInfo.remark
}).then(
res => {
this.refundMark =false;
this.$util.Tips({
title: res.message,
icon: 'success'
})
that.getGoods(true);
},
err => {
that.$util.Tips({
title: err
});
}
);
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
//路由跳转
navation(item) {
if (item.type == 8) {
uni.navigateTo({
url: '/pages/moreProject/moreProject'
})
}
if (this.userid) {
if (this.userInfoData.mer_info.setting_status == 1) {
switch (item.type) {
case 1:
uni.switchTab({
url: '/pages/product/list/index'
})
break;
case 2:
uni.navigateTo({
url: '/pages/admin/order/index?mer_id=' + this.userInfoData.service.mer_id +
'&type_id=' + this.userInfoData.mer_info.type_id
})
break;
case 3:
uni.navigateTo({
url: '/pages/users/supply_procurement/index?type_id=12&isDetail=1&product_type=98&cate_id=' +
this.userInfoData.mer_info.category_id
})
break;
case 4:
uni.navigateTo({
// url: '/pages/users/order_list/index?status=-1'
url: '/pages/users/order_list/indexCopy?status=-1&product_type=98'
})
break;
case 5:
uni.navigateTo({
url: '/pages/users/embody/embody?mer_id=' + this.userInfoData.service.mer_id
})
break;
case 6:
uni.switchTab({
url: '/pages/chat/customer_list/index?type=1&mer_id=' + this.userInfoData
.service
.mer_id
})
break;
case 7:
uni.navigateTo({
url: '/pages/admin/order_cancellation/index?mer_id=' + this.userInfoData
.service
.mer_id
})
break;
}
} else {
if (this.userInfoData.mer_info.mer_name) {
if (this.userInfoData.mer_info.mer_settlement_agree_status == 0) {
if (this.codenote.length == 0) {
this.isFshow = true
this.countDown()
} else {
if (this.codenote[0].status == 0) {
uni.showModal({
title: '申请正在审核中,请勿重复提交'
})
} else {
this.isFshow = true
this.countDown()
}
}
} else {
uni.navigateTo({
url: url
})
}
} else {
uni.showModal({
title: '提示',
content: '请完成商户设置后,再进行本次操作',
success: function(res) {
if (res.confirm) {
uni.navigateTo({
url: '/pages/product/basicSet?mer_id=' + this.userInfoData
.service
.mer_id
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
})
}
}
} else {
this.isAuto = true;
this.isShowAuth = true
}
},
//获取订单列表
getGoods: function(isPage) {
let that = this;
if (that.loadend) return;
if (that.loading) return;
if (isPage === true) that.$set(that, 'productList', []);
that.loading = true;
that.loadTitle = '';
getOrderList(that.where, this.userInfoData.service.mer_id).then(res => {
let list = res.data.list;
let productList = that.$util.SplitArray(list, that.productList);
let loadend = list.length < that.where.limit;
that.loadend = loadend;
that.loading = false;
that.loadTitle = loadend ? '已全部加载' : '加载更多';
setTimeout(() => {
that.$set(that, 'productList', productList);
}, 500)
// console.log(that.productList)
that.$set(that.where, 'page', that.where.page + 1);
if (that.where.page == 1 && res.data.list.length <= 0) that.emptyShow = true
}).catch(err => {
that.loading = false;
that.loadTitle = '加载更多';
});
},
}
}
</script>
<style lang="scss" scoped>
page {
background-color: #f4f7fe;
// background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%);
}
/deep/.statistical-page .navs {
top: 400rpx !important;
}
.userpage {
width: 100%;
background-color: #fff;
position: relative;
}
.priceChange {
position: fixed;
width: 580upx;
background-color: #fff;
border-radius: 10upx;
top: 50%;
left: 50%;
margin-left: -290upx;
margin-top: -335upx;
z-index: 666;
transition: all 0.3s ease-in-out 0s;
transform: scale(0);
opacity: 0;
}
.priceChange.on {
opacity: 1;
transform: scale(1);
}
.priceChange .priceTitle {
background: url("~@/static/images/pricetitle.jpg") no-repeat;
background-size: 100% 100%;
width: 100%;
height: 160upx;
border-radius: 10upx 10upx 0 0;
text-align: center;
font-size: 40upx;
color: #fff;
line-height: 160upx;
position: relative;
}
.priceChange .priceTitle .iconfont {
position: absolute;
font-size: 40upx;
right: 26upx;
top: 23upx;
width: 40upx;
height: 40upx;
line-height: 40upx;
}
.priceChange .listChange {
padding: 0 40upx;
}
.priceChange .listChange textarea {
box-sizing: border-box;
}
.priceChange .listChange .item {
height: 103upx;
border-bottom: 1px solid #e3e3e3;
font-size: 32upx;
color: #333;
}
.priceChange .modify {
font-size: 32upx;
color: #fff;
width: 490upx;
height: 90upx;
text-align: center;
line-height: 90upx;
border-radius: 45upx;
background-color: #2291f8;
margin: 53upx auto;
}
.priceChange .listChange textarea {
border: 1px solid #eee;
width: 100%;
height: 200upx;
margin-top: 50upx;
border-radius: 10upx;
color: #333;
padding: 20upx;
}
.userpage-icon {
width: 60rpx;
height: 60rpx;
position: absolute;
top: 85rpx;
right: 60rpx;
image {
width: 100%;
height: 100%;
}
}
.item-name {
width: 190rpx;
}
.merchantsSettled {
height: 100%;
padding-top: 160rpx;
}
.merchantsSettled .title {
font-size: 35rpx;
font-family: Microsoft YaHei;
font-weight: 400;
text-align: center;
}
.merchantsSettled .list {
background-color: #fff;
border-radius: 12px;
margin: 0 15px;
position: absolute;
}
.application-record {
position: absolute;
display: flex;
align-items: center;
top: 240rpx;
right: 0;
color: #fff;
font-size: 22rpx;
background-color: rgba(0, 0, 0, 0.3);
padding: 8rpx 18rpx;
border-radius: 20px 0px 0px 20px;
}
.item-card {
display: flex;
margin-top: 20rpx;
.item-carda {
width: 298rpx;
height: 175rpx;
margin-right: 20rpx;
image {
width: 100%;
height: 100%;
}
}
.item-cardb {
width: 298rpx;
height: 175rpx;
image {
width: 100%;
height: 100%;
}
}
}
.merchantsSettled .list .item {
padding: 50rpx 0 20rpx;
position: relative;
margin: 0 20px;
&.no-border {
border-bottom: none;
padding-left: 0;
padding-right: 0;
}
.item-title {
color: #666666;
font-size: 28rpx;
display: block;
}
.item-desc {
color: #B2B2B2;
font-size: 22rpx;
display: block;
margin-top: 9rpx;
line-height: 36rpx;
}
}
.acea-row,
.upload {
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-o-box-lines: multiple;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.upload {
margin-top: 20rpx;
}
.acea-row.row-middle {
-webkit-box-align: center;
-moz-box-align: center;
-o-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
padding-left: 2px;
}
.acea-row.row-column {
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-o-box-orient: vertical;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.acea-row.row-center-wrapper {
-webkit-box-align: center;
-moz-box-align: center;
-o-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-moz-box-pack: center;
-o-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.merchantsSettled .list .item .pictrue {
width: 130rpx;
height: 130rpx;
margin: 24rpx 22rpx 0 0;
position: relative;
font-size: 11px;
color: #bbb;
&:nth-child(4n) {
margin-right: 0;
}
&:nth-last-child(1) {
border: 0.5px solid #ddd;
box-sizing: border-box;
}
uni-image,
image {
width: 100%;
height: 100%;
border-radius: 1px;
img {
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
display: block;
position: absolute;
top: 0;
left: 0;
opacity: 0;
width: 100%;
height: 100%;
}
}
.icon-guanbi1 {
font-size: 33rpx;
position: absolute;
top: -10px;
right: -10px;
}
}
.uni-list-cell-db {
position: relative;
}
.merchantsSettled .submitBtn {
width: 588rpx;
margin: 0 auto;
height: 86rpx;
border-radius: 25px;
text-align: center;
line-height: 86rpx;
font-size: 15px;
color: #fff;
background: #E3E3E3;
margin-top: 25px;
pointer-events: none;
}
.merchantsSettled .submitBtn.on {
background: red;
pointer-events: all;
}
.settlementAgreement {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, .5);
z-index: 10;
}
.settlementAgreement .setAgCount {
background: #fff;
width: 656rpx;
// height: 458px;
position: absolute;
top: 50%;
left: 50%;
padding: 52rpx;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
overflow: hidden;
.content {
height: 900rpx;
overflow-y: scroll;
/deep/ p {
font-size: 13px;
line-height: 22px;
}
/deep/ img {
max-width: 100%;
}
}
}
.settlementAgreement .setAgCount .icon {
font-size: 42rpx;
color: #b4b1b4;
position: absolute;
top: 15rpx;
right: 15rpx;
}
.settlementAgreement .setAgCount .title {
color: #333;
font-size: 32rpx;
text-align: center;
font-weight: bold;
}
.settlementAgreement .setAgCount .contenta {
color: #333;
font-size: 26rpx;
line-height: 22px;
text-align: justify;
text-justify: distribute-all-lines;
height: 68%;
overflow-y: scroll;
}
.setAgCountbtn {
display: flex;
justify-content: space-around;
padding-bottom: 120rpx;
.setAgCountbtna {
margin-top: 40rpx;
width: 200rpx;
height: 74rpx;
text-align: center;
line-height: 74rpx;
border-radius: 46rpx 46rpx;
opacity: 1;
border: 2rpx solid #B3B3B3;
font-size: 25rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #737373;
}
.setAgCountbtnb {
margin-top: 40rpx;
padding-left: 20rpx;
padding-right: 20rpx;
text-align: center;
line-height: 74rpx;
background: #cecece;
border-radius: 46rpx 46rpx;
opacity: 1;
font-size: 25rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #fff;
}
.setAgCountbtnc {
margin-top: 40rpx;
width: 200rpx;
height: 74rpx;
text-align: center;
line-height: 74rpx;
background: linear-gradient(270deg, #FF6D20 0%, #F84221 100%);
border-radius: 46rpx 46rpx;
opacity: 1;
font-size: 25rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #fff;
}
}
.left-content {
width: 680rpx;
height: 100%;
display: flex;
background-color: #ffffff;
.left-content-left {
width: 206rpx;
height: 100%;
background-color: #d9d9d9;
text-align: center;
padding-top: 20rpx;
.content-top_txt {
font-size: 18rpx;
}
.content-top_img {
width: 96rpx;
height: 96rpx;
border-radius: 50%;
margin: 0 auto;
margin-bottom: 40rpx;
image {
border-radius: 50%;
width: 100%;
height: 100%;
}
}
}
.left-content-right {
padding-left: 30rpx;
position: relative;
padding-top: 20rpx;
.content-right-one {
display: flex;
.content-right-onea {
font-size: 30rpx;
}
.content-right-oneb {
margin-top: 5rpx;
width: 40rpx;
height: 40rpx;
image {
width: 100%;
height: 100%;
}
}
}
.content-right-botm {
position: absolute;
bottom: 200rpx;
width: 300rpx;
height: 70rpx;
line-height: 70rpx;
border-radius: 20rpx 20rpx;
left: 50%;
color: #ffffff;
background-color: #00a1f1;
text-align: center;
font-size: 25rpx;
}
}
}
.conter-img {
width: 650rpx;
height: 400rpx;
margin: 0 auto;
margin-top: 60rpx;
image {
width: 100%;
height: 100%;
}
}
.content {
padding-top: 80rpx;
.content-top {
display: flex;
justify-content: space-between;
}
.content-tops {
display: flex;
height: 96rpx;
line-height: 96rpx;
.content-top_img {
margin-left: 16rpx;
width: 96rpx;
height: 96rpx;
border-radius: 50%;
image {
border-radius: 50%;
width: 100%;
height: 100%;
}
}
.content-top-title {
margin-left: 11rpx;
display: flex;
font-size: 33rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
.top-titleb {
width: 30rpx;
height: 30rpx;
margin-top: 5rpx;
margin-left: 10rpx;
image {
width: 100%;
height: 100%;
}
}
}
}
.content-middle {
padding: 0 60rpx;
display: flex;
justify-content: space-around;
margin-top: 61rpx;
.content-middlea {
width: 161rpx;
text-align: center;
.content-middlea-one {
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
}
.content-middlea-two {
font-size: 42rpx;
font-family: SF Pro Display-Semibold, SF Pro Display;
font-weight: 600;
color: #333333;
margin-top: 11rpx;
}
}
}
.content-open {
width: 70rpx;
height: 15rpx;
margin: 0 auto;
margin-top: 53rpx;
image {
width: 100%;
height: 100%;
}
}
.content-bottom {
background-color: #ffffff;
border-radius: 32rpx 32rpx 0px 0px;
margin-top: 41rpx;
padding-top: 46rpx;
.content-order {
display: flex;
justify-content: space-around;
view {
width: 100rpx;
text-align: center;
.content-order-one {
margin-top: 11rpx;
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
}
.content-order-two {
font-size: 42rpx;
font-family: SF Pro Display-Semibold, SF Pro Display;
font-weight: 600;
color: #333333;
}
}
}
.content-tools {
margin-top: 70rpx;
.tools-one {
width: 133rpx;
line-height: 50rpx;
font-size: 33rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
margin-left: 16rpx;
view {
width: 46rpx;
height: 5rpx;
background: #F84221;
margin: 0 auto;
}
}
.tools-two {
display: grid;
grid-template-columns: repeat(4, 1fr);
padding: 0 44rpx;
view {
margin-top: 24rpx;
text-align: center;
.tools-two-img {
width: 120rpx;
height: 120rpx;
margin-left: 20rpx;
image {
width: 100%;
height: 100%;
}
}
}
}
}
.content-list {
margin-top: 70rpx;
.tools-one {
width: 133rpx;
line-height: 50rpx;
font-size: 33rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
margin-left: 16rpx;
view {
width: 46rpx;
height: 5rpx;
background: #F84221;
margin: 0 auto;
}
}
.content-list-one {
padding: 25rpx 25rpx;
padding-bottom: 80rpx;
.list-one {
display: flex;
justify-content: space-between;
.list-one_left {
display: flex;
height: 49rpx;
line-height: 49rpx;
.list-one_left-a {
width: 49rpx;
height: 49rpx;
margin-right: 20rpx;
image {
width: 100%;
height: 100%;
}
}
.list-one_left-c {
width: 26rpx;
height: 26rpx;
margin-top: 5rpx;
image {
width: 100%;
height: 100%;
}
}
}
.list-one_right {
display: flex;
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
.list-one_right-a {
color: #333333;
}
.list-one_right-c {
height: 27rpx;
width: 2px;
margin-top: 5rpx;
background-color: #000;
margin-left: 15rpx;
margin-right: 15rpx;
}
.list-one_right-b {
color: #F84221;
}
}
}
.list-two {
display: flex;
margin-top: 26rpx;
.list-two_left {
width: 175rpx;
height: 175rpx;
image {
width: 100%;
height: 100%;
}
}
.list-two_middle {
margin-left: 20rpx;
.two_middle-title-a {
display: flex;
justify-content: space-between;
.two_middle-title-a-left {
width: 387rpx;
font-size: 30rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
}
.two_middle-title-a-right {
text-align: right;
.title-number {
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #737373;
}
.title-price {
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #F84221;
margin-top: -10rpx;
}
}
}
.two_middle-title-b {
display: flex;
.title-number {
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #737373;
}
.title-price {
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
margin-top: -10rpx;
}
}
}
}
.list-three {
margin-top: 46rpx;
.list-three-one {
display: flex;
margin-top: 20rpx;
.title-img {
width: 28rpx;
height: 28rpx;
margin-top: 5rpx;
margin-right: 10rpx;
image {
width: 100%;
height: 100%;
}
}
font-size: 26rpx;
font-family: PingFang SC-Regular,
PingFang SC;
font-weight: 400;
color: #333333;
}
}
.list-four {
display: flex;
position: absolute;
right: 25rpx;
}
.list-four .btn {
width: 116rpx;
line-height: 58rpx;
text-align: center;
border: 1px solid #737373;
height: 58rpx;
border-radius: 30rpx 30rpx;
opacity: 1;
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #737373 !important;
}
.list-four .btn1 {
margin-left: 32rpx;
width: 142rpx;
line-height: 58rpx;
text-align: center;
border: 1px solid #F84221;
height: 58rpx;
border-radius: 30rpx 30rpx;
opacity: 1;
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #F84221 !important;
}
}
}
}
}
</style>