我是个攻城狮
799 lines
20 KiB
Vue
799 lines
20 KiB
Vue
<template>
|
||
<Layout :index="-1" :banner="0" :img="'/static/img/about.jpg'" :titles="'个人中心'" :title_content="'个人中心'">
|
||
<view class="bg ptm-80">
|
||
<view class="content">
|
||
<view class="content_left">
|
||
<memberleft :index="'4'"></memberleft>
|
||
</view>
|
||
<view class="content_right">
|
||
<view class="mtitle">
|
||
<image src="../static/img/member/fkx.png" class="mimg"></image>
|
||
查看详情
|
||
</view>
|
||
<view class="lines"></view>
|
||
<view class="pay_nav">
|
||
<text class="">付款记录</text> > <text class="pay_xq">查看详情</text>
|
||
</view>
|
||
<view class="content_r">
|
||
<view class="pay_num" v-if="payinfo && payinfo.order_info">
|
||
<view class="pay_num_l">
|
||
<image src="../static/img/member/pwzf.png" class="pay_num_img" v-if="payinfo.pay_status != 20"></image>
|
||
<image src="../static/img/member/yzf.png" class="yzf_img" v-if="payinfo.pay_status == 20"></image>
|
||
<view class="pay_num_title">
|
||
<view class="pay_status" v-if="payinfo.pay_status != 20">
|
||
订单未支付
|
||
</view>
|
||
<view class="pay_desc" v-if="payinfo.pay_status != 20">
|
||
支付后，开启评估服务~
|
||
</view>
|
||
<view class="pay_status" v-if="payinfo.pay_status == 20">
|
||
订单已支付
|
||
</view>
|
||
<view class="pay_desc" v-if="payinfo.pay_status == 20">
|
||
报告评估中，请耐心等待
|
||
<!-- {{ payinfo.evaluate_info && payinfo.evaluate_info.fulfillment_status_text ? payinfo.evaluate_info.fulfillment_status_text : '报告评估中，请耐心等待' }} -->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="pay_num_r">
|
||
<view class="pay_aount">
|
||
¥{{ payinfo.amount || (payinfo.order_info.amount ? Number(payinfo.order_info.amount).toFixed(2) : '0.00') }}
|
||
</view>
|
||
<view class="pay_desc2" v-if="payinfo.pay_status != 20">
|
||
待支付金额
|
||
</view>
|
||
<view class="pay_desc2" v-if="payinfo.pay_status == 20">
|
||
支付金额
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="pay_title">
|
||
<view class="xian"></view>订单信息
|
||
</view>
|
||
<view class="order_detail" v-if="payinfo && payinfo.order_info">
|
||
<view class="order_list">
|
||
订单编号
|
||
<view class="order_list_value">{{ payinfo.order_info.order_no || '-' }}</view>
|
||
</view>
|
||
<view class="order_list">
|
||
订单状态
|
||
<view class="order_list_value">
|
||
<view class="order_list_status" v-if="payinfo.record_status != 'paid'">{{payinfo.record_status_text}}</view>
|
||
<view class="order_list_status2" v-else>已支付</view>
|
||
</view>
|
||
</view>
|
||
<view class="order_list">
|
||
资产名称
|
||
<view class="order_list_value">{{ payinfo.order_info.asset_name || '-' }}</view>
|
||
</view>
|
||
<view class="order_list">
|
||
资产类型
|
||
<view class="order_list_value">
|
||
{{ payinfo.order_info.asset_type === 'game' ? '游戏资产包' : payinfo.order_info.asset_type || '-' }}
|
||
</view>
|
||
</view>
|
||
<view class="order_list">
|
||
资产编号
|
||
<view class="order_list_value">{{ payinfo.order_info.asset_no || '-' }}</view>
|
||
</view>
|
||
<view class="order_list">
|
||
支付方式
|
||
<view class="order_list_value">{{ payinfo.order_info.pay_type_text || '-' }}</view>
|
||
</view>
|
||
<view class="order_list">
|
||
支付时间
|
||
<view class="order_list_value">{{ payinfo.order_info.pay_time_text || '-' }}</view>
|
||
</view>
|
||
<view class="order_list">
|
||
支付金额
|
||
<view class="order_list_value">{{ payinfo.amount ? payinfo.amount + '元' : ((payinfo.order_info.amount ? payinfo.order_info.amount+'元' : '-')) }}</view>
|
||
</view>
|
||
<view class="order_list boder-none">
|
||
支付方
|
||
<view class="order_list_value">{{ payinfo.order_info.payer || '-' }}</view>
|
||
</view>
|
||
<view class="order_list boder-none">
|
||
交易单号
|
||
<view class="order_list_value">{{ payinfo.order_info.transaction_id || '-' }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="pay_title">
|
||
<view class="xian"></view>评估服务信息
|
||
</view>
|
||
<view class="order_detail2" v-if="payinfo && payinfo.evaluate_info">
|
||
<view class="order_list">
|
||
报告编号
|
||
<view class="order_list_value">{{ payinfo.evaluate_info.report_no || '-' }}</view>
|
||
</view>
|
||
<view class="order_list">
|
||
履约进度
|
||
<view class="order_list_value">
|
||
<view
|
||
class="order_list_status3"
|
||
v-if="payinfo.evaluate_info.fulfillment_status === 'pending'">
|
||
{{ payinfo.evaluate_info.fulfillment_status_text || '报告评估中' }}
|
||
</view>
|
||
<view
|
||
class="order_list_status2"
|
||
v-else-if="payinfo.evaluate_info.fulfillment_status === 'done'">
|
||
{{ payinfo.evaluate_info.fulfillment_status_text || '已完成' }}
|
||
</view>
|
||
<view
|
||
class="order_list_status"
|
||
v-else>
|
||
{{ payinfo.evaluate_info.fulfillment_status_text || '-' }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="order_list boder-none">
|
||
预计交付
|
||
<view class="order_list_value">{{ payinfo.evaluate_info.expected_delivery_time_text || '-' }}</view>
|
||
</view>
|
||
<view class="order_list boder-none">
|
||
权属方
|
||
<view class="order_list_value">{{ payinfo.evaluate_info.owner || '-' }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="pay_btns" v-if="payinfo && payinfo.actions">
|
||
<el-button
|
||
v-if="true"
|
||
@click="() => $router.back()"
|
||
type="text"
|
||
size="small"
|
||
class="asset_l"
|
||
>返回</el-button>
|
||
<!-- 退款按钮 -->
|
||
<el-button
|
||
v-if="payinfo.actions.refund"
|
||
@click="dialogFormVisible = true"
|
||
type="text"
|
||
size="small"
|
||
class="asset_l"
|
||
>申请退款</el-button>
|
||
<!-- 取消付款 -->
|
||
<el-button
|
||
v-if="payinfo.actions.pay"
|
||
@click="showCancelRefundConfirm"
|
||
type="text"
|
||
size="small"
|
||
class="asset_l"
|
||
>取消付款</el-button>
|
||
<!-- 去支付 -->
|
||
<el-button
|
||
v-if="payinfo.actions.pay"
|
||
@tap="openPayDialog(payinfo.order_info)"
|
||
type="text"
|
||
size="small"
|
||
class="asset_pay"
|
||
>去支付</el-button>
|
||
<!-- 下载评估报告 -->
|
||
<el-button
|
||
v-if="payinfo.actions.download_report"
|
||
@click="downloadPDF(payinfo.evaluate_info && payinfo.evaluate_info.report_url)"
|
||
type="text"
|
||
size="small"
|
||
class="asset_2"
|
||
>下载评估报告</el-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<el-dialog :visible.sync="dialogFormVisible" custom-class="tuikuan_dialog" center>
|
||
<view class="tuikuan_content">
|
||
<view class="tuikuan_title">申请退款</view>
|
||
<!-- 展示订单编号 支付金额 支付方式 -->
|
||
<view class="tuikuan_content_order">
|
||
<view style="display: flex; align-items: center; margin-right: 24px;">
|
||
<view class="tuikuan_content_order_title"><view class="red"></view>订单编号：</view>
|
||
<view class="tuikuan_content_order_value">{{ payinfo.order_info && payinfo.order_info.order_no ? payinfo.order_info.order_no : '-' }}</view>
|
||
</view>
|
||
<view style="display: flex; align-items: center;">
|
||
<view class="tuikuan_content_order_title">支付金额：</view>
|
||
<view class="tuikuan_content_order_value">{{ payinfo.amount ? payinfo.amount + '元' : ((payinfo.order_info && payinfo.order_info.amount ? payinfo.order_info.amount+'元' : '-')) }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="tuikuan_content_order">
|
||
<view style="display: flex; align-items: center; margin-right: 24px;">
|
||
<view class="tuikuan_content_order_title"><view class="red"></view>支付方式：</view>
|
||
<view class="tuikuan_content_order_value">{{ payinfo.order_info && payinfo.order_info.pay_type_text ? payinfo.order_info.pay_type_text : '-' }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="tuikuan_content_order">
|
||
<view class="tuikuan_content_title"><view class="red">*</view>退款原因：</view>
|
||
<view class="tuikuan_content_input">
|
||
<textarea v-model="tuikuan_reason" autocomplete="off" placeholder="请输入退款原因，最多不超过200字。" maxlength="200"></textarea>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="tuikuan_footer">
|
||
<el-button type="primary" @click="tuikuan_confirm">提交申请</el-button>
|
||
</view>
|
||
</el-dialog>
|
||
<!-- 支付弹窗 调用part/pay 组件优化，支持直接插入并控制显示状态 -->
|
||
<el-dialog
|
||
:visible.sync="dialogPayVisible"
|
||
custom-class="pay_dialog"
|
||
center
|
||
width="480px"
|
||
:show-close="true"
|
||
@close="dialogPayVisible = false"
|
||
>
|
||
<pay
|
||
v-if="dialogPayVisible"
|
||
:order-id="currentOrderId"
|
||
@pay-success="handlePaySuccess"
|
||
@close="dialogPayVisible = false"
|
||
/>
|
||
</el-dialog>
|
||
|
||
<!-- 取消退款二次确认弹窗（使用uniapp的模态框，不再用el-dialog） -->
|
||
</Layout>
|
||
</template>
|
||
|
||
<script>
|
||
import Layout from './part/layouts.vue';
|
||
import memberleft from './part/member_left.vue';
|
||
import pay from './part/pay.vue';
|
||
export default {
|
||
components:{
|
||
Layout,
|
||
memberleft,
|
||
pay
|
||
},
|
||
data(){
|
||
return {
|
||
payinfo: {},
|
||
total: 0,
|
||
name:'',
|
||
order_status:'0',
|
||
dialogFormVisible: false,
|
||
dialogPayVisible:false,
|
||
currentOrderId: '',
|
||
tuikuan_reason: '',
|
||
id:'',
|
||
showCancelRefundDialog: false, // 新增：控制取消付款确认弹窗
|
||
}
|
||
},
|
||
created() {
|
||
const width = window.innerWidth;
|
||
const height = window.innerHeight;
|
||
const mobileWidth = 768; // 可以根据需要调整这个值
|
||
const isMobile = width <= mobileWidth || height <= mobileWidth;
|
||
if(isMobile){
|
||
this.list_rows = 30;
|
||
}
|
||
|
||
|
||
},
|
||
onShow() {
|
||
let obj = this.$Route.query;
|
||
if(obj.hasOwnProperty('id')){
|
||
this.id = Number(obj.id);
|
||
}
|
||
this.getData();
|
||
},
|
||
|
||
methods:{
|
||
// 新增：提交退款申请逻辑
|
||
tuikuan_confirm() {
|
||
if (!this.tuikuan_reason.trim()) {
|
||
this.$message.error('请输入退款原因');
|
||
return;
|
||
}
|
||
this._post(
|
||
'asset.Asset/refund',
|
||
{
|
||
id: this.id,
|
||
reason: this.tuikuan_reason
|
||
},
|
||
res => {
|
||
this.$message.success('退款申请提交成功');
|
||
this.dialogFormVisible = false;
|
||
this.getData();
|
||
},
|
||
err => {
|
||
const msg = (err && err.data && err.data.msg) ? err.data.msg : '操作失败，请重试';
|
||
this.$message.error(msg);
|
||
}
|
||
);
|
||
},
|
||
openPayDialog(e) {
|
||
this.currentOrderId = e.id;
|
||
this.dialogPayVisible = true;
|
||
},
|
||
downloadPDF(e) {
|
||
if(!e){
|
||
this.$message.error('评估报告生成中~');
|
||
}else{
|
||
window.open(e, '_blank');
|
||
}
|
||
},
|
||
goEdit(e){
|
||
if(uni.getStorageSync('apply_status')==3){
|
||
this.$message.error('用户认证审核中');
|
||
return false;
|
||
}
|
||
if(uni.getStorageSync('apply_status')==2){
|
||
this.$message.error('用户认证失败，请重新提交审核');
|
||
return false;
|
||
}
|
||
this.$router.push({
|
||
path: 'asset_add',
|
||
query: {
|
||
id: e
|
||
}
|
||
})
|
||
},
|
||
finds(e){
|
||
uni.showModal({
|
||
title: '审核意见',
|
||
content: e.auth_remark?e.auth_remark:"无审核意见说明",
|
||
showCancel: true,
|
||
cancelText: '取消',
|
||
cancelColor: '#cccccc',
|
||
confirmText: '确定',
|
||
confirmColor: '#F78A30',
|
||
success: function (res) {
|
||
if (res.confirm) {
|
||
} else if (res.cancel) {
|
||
console.log('用户点击取消');
|
||
}
|
||
},
|
||
fail: function (err) {
|
||
console.log('调用失败：', err);
|
||
},
|
||
complete: function () {
|
||
}
|
||
});
|
||
},
|
||
getData(){
|
||
this._get('asset.Asset/paymentDetail',{
|
||
id: this.id,
|
||
},res=>{
|
||
console.log(res.data,22222222222222);
|
||
this.payinfo = res.data;
|
||
}
|
||
,err=>{
|
||
uni.showToast({
|
||
icon:'none',
|
||
title: err.data.msg
|
||
})
|
||
return;
|
||
});
|
||
},
|
||
|
||
// 新增：展示取消退款的二次确认弹窗
|
||
showCancelRefundConfirm() {
|
||
uni.showModal({
|
||
title: '确认取消付款？',
|
||
content: '是否确定要取消本次付款？',
|
||
showCancel: true,
|
||
cancelText: '取消',
|
||
cancelColor: '#cccccc',
|
||
confirmText: '确定',
|
||
confirmColor: '#F78A30',
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
this.cancelRefundAction();
|
||
}
|
||
// 不需要设置showCancelRefundDialog
|
||
}
|
||
});
|
||
},
|
||
// 新增：二次确认确定调用接口
|
||
cancelRefundAction() {
|
||
this._post(
|
||
'asset.Asset/cancelPayment',
|
||
{
|
||
id: this.id
|
||
},
|
||
res => {
|
||
this.$message.success('取消付款成功');
|
||
this.getData();
|
||
},
|
||
err => {
|
||
const msg = (err && err.data && err.data.msg) ? err.data.msg : '取消付款失败，请重试';
|
||
this.$message.error(msg);
|
||
}
|
||
);
|
||
},
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.bg{
|
||
width: 100%;
|
||
background: #F1F1F1;
|
||
min-height: 800px;
|
||
}
|
||
.content{
|
||
width: 1290px;
|
||
margin: 0 auto;
|
||
padding-top: 14px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
.content_left{
|
||
width: 245px;
|
||
min-height: 789px;
|
||
background: #FFFFFF;
|
||
box-shadow: 0px 4px 10px 0px rgba(78,89,105,0.06);
|
||
border-radius: 0px 0px 0px 0px;
|
||
}
|
||
.content_right{
|
||
width: 1024px;
|
||
min-height: 789px;
|
||
background: #FFFFFF;
|
||
box-shadow: 0px 4px 10px 0px rgba(78,89,105,0.06);
|
||
border-radius: 0px 0px 0px 0px;
|
||
}
|
||
.mtitle{
|
||
font-weight: 500;
|
||
font-size: 16px;
|
||
color: #3D3D3D;
|
||
width: 985px;
|
||
margin:0 auto;
|
||
height: 48px;
|
||
line-height: 48px;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.lines{
|
||
width: 985px;
|
||
height: 0px;
|
||
border: 1px solid #D8D8D8;
|
||
opacity: 0.6;
|
||
margin:0 auto;
|
||
}
|
||
.mimg{
|
||
width: 20px;
|
||
height: 20px;
|
||
margin-right: 6px;
|
||
margin-left: 20px;
|
||
margin-top: 2px;
|
||
}
|
||
.pay_nav{
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 400;
|
||
font-size: 12px;
|
||
color: #A1A1A1;
|
||
line-height: 17px;
|
||
text-align: left;
|
||
margin-left: 23px;
|
||
margin-top: 12px;
|
||
}
|
||
.pay_xq{
|
||
color: #F38D5D;
|
||
}
|
||
|
||
.content_r{
|
||
padding: 20px 22px;
|
||
}
|
||
.pay_num{
|
||
background-image: url('/static/img/member/pbg.png');
|
||
background-size: cover;
|
||
width: 948px;
|
||
height: 150px;
|
||
margin: 0 auto;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
.pay_num_l{
|
||
margin-left: 56px;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.pay_num_img{
|
||
width: 134px;
|
||
height: 102px;
|
||
}
|
||
.yzf_img{
|
||
width: 138px;
|
||
height: 120px;
|
||
}
|
||
.pay_num_r{
|
||
margin-right: 116px;
|
||
}
|
||
.pay_num_title{
|
||
margin-left: 10px;
|
||
}
|
||
.pay_status{
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 500;
|
||
font-size: 26px;
|
||
color: #3D3D3D;
|
||
line-height: 38px;
|
||
text-align: left;
|
||
}
|
||
.pay_desc{
|
||
font-family: Segoe UI, Segoe UI;
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #767676;
|
||
line-height: 19px;
|
||
text-align: left;
|
||
margin-top: 6px;
|
||
}
|
||
.pay_desc2{
|
||
font-family: Segoe UI, Segoe UI;
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #767676;
|
||
line-height: 19px;
|
||
text-align: left;
|
||
margin-top: 12px;
|
||
}
|
||
.pay_aount{
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 700;
|
||
font-size: 32px;
|
||
color: #F6773C;
|
||
line-height: 31px;
|
||
text-align: left;
|
||
}
|
||
.pay_title{
|
||
display: flex;
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 500;
|
||
font-size: 18px;
|
||
color: #252B33;
|
||
line-height: 26px;
|
||
text-align: left;
|
||
margin-top: 28px;
|
||
margin-left: 14px;
|
||
}
|
||
.xian{
|
||
width: 4px;
|
||
height: 22px;
|
||
background: #F78A30;
|
||
border-radius: 3px 3px 3px 3px;
|
||
margin-right: 10px;
|
||
}
|
||
.order_detail{
|
||
margin: 0 auto;
|
||
margin-top: 14px;
|
||
width: 900px;
|
||
height: 270px;
|
||
background: #FFFFFF;
|
||
border-radius: 8px 8px 8px 8px;
|
||
border: 1px solid #E5E6EB;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content:space-between;
|
||
padding: 19px 24px;
|
||
overflow: hidden;
|
||
}
|
||
.order_detail2{
|
||
margin: 0 auto;
|
||
margin-top: 14px;
|
||
width: 900px;
|
||
height: 98px;
|
||
background: #FFFFFF;
|
||
border-radius: 8px 8px 8px 8px;
|
||
border: 1px solid #E5E6EB;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content:space-between;
|
||
padding: 19px 24px;
|
||
overflow: hidden;
|
||
}
|
||
.order_list{
|
||
width: 435px;
|
||
height: 54px;
|
||
border-radius: 0px 0px 0px 0px;
|
||
border-bottom: 1px solid #E5E6EB;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #A1A1A1;
|
||
line-height: 20px;
|
||
text-align: left;
|
||
}
|
||
.boder-none{
|
||
border: none;
|
||
}
|
||
.order_list_value{
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #3D3D3D;
|
||
line-height: 20px;
|
||
text-align: left;
|
||
width: 354px;
|
||
}
|
||
.order_list_status{
|
||
width: 63px;
|
||
height: 27px;
|
||
border-radius: 14px;
|
||
background: #FFF7E9;
|
||
border: 1px solid #F5B865;
|
||
text-align: center;
|
||
line-height: 27px;
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 400;
|
||
font-size: 12px;
|
||
color: #F6773C;
|
||
}
|
||
.order_list_status2{
|
||
width: 63px;
|
||
height: 27px;
|
||
border-radius: 14px;
|
||
background: #F2FFE9;
|
||
border: 1px solid #95DC6B;
|
||
text-align: center;
|
||
line-height: 27px;
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 400;
|
||
font-size: 12px;
|
||
color: #46AF1F;
|
||
}
|
||
.order_list_status3{
|
||
width: 86px;
|
||
height: 27px;
|
||
border-radius: 14px;
|
||
background: #FFF7E9;
|
||
border: 1px solid #F5B865;
|
||
text-align: center;
|
||
line-height: 27px;
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 400;
|
||
font-size: 12px;
|
||
color: #F6773C;
|
||
}
|
||
.pay_btns{
|
||
margin-top: 90px;
|
||
display: flex;
|
||
justify-content: center;
|
||
margin-bottom: 50px;
|
||
}
|
||
.asset_l{
|
||
height: 40px;
|
||
background: #FFFFFF;
|
||
border-radius: 4px 4px 4px 4px;
|
||
border: 1px solid #DFDFDF;
|
||
padding: 9px 20px;
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #3D3D3D;
|
||
text-align: center;
|
||
margin-right: 22px;
|
||
}
|
||
.asset_2{
|
||
height: 40px;
|
||
background: #B5B5B5;
|
||
border-radius: 4px 4px 4px 4px;
|
||
border: 1px solid #B5B5B5;
|
||
padding: 9px 20px;
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #ffffff;
|
||
text-align: center;
|
||
margin-right: 22px;
|
||
}
|
||
.asset_pay{
|
||
width: 101px;
|
||
height: 40px;
|
||
background: #F78A30;
|
||
border-radius: 4px 4px 4px 4px;
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #ffffff;
|
||
text-align: center;
|
||
}
|
||
|
||
.tuikuan_content_input{
|
||
width: 395px;
|
||
height: 83px;
|
||
background: #F2F3F5;
|
||
border-radius: 0px 0px 0px 0px;
|
||
padding: 8px;
|
||
}
|
||
::v-deep .uni-textarea-textarea{
|
||
width: 100%;
|
||
height: 83px;
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #3D3D3D;
|
||
}
|
||
::v-deep .uni-textarea-placeholder{
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #86909C;
|
||
}
|
||
::v-deep .el-dialog__headerbtn{
|
||
top: 18px !important;
|
||
right: 18px !important;
|
||
}
|
||
.tuikuan_content_order{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
width: 489px;
|
||
margin: 0 auto;
|
||
margin-bottom: 33px;
|
||
}
|
||
.tuikuan_content_title{
|
||
width: 100px;
|
||
height: 22px;
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #3D3D3D;
|
||
line-height: 22px;
|
||
text-align: left;
|
||
position: relative;
|
||
overflow: hidden;
|
||
display: flex;
|
||
}
|
||
.tuikuan_content_order .red{
|
||
font-size: 12px;
|
||
width: 10px;
|
||
}
|
||
.tuikuan_content_order_title{
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #3D3D3D;
|
||
display: flex;
|
||
}
|
||
.tuikuan_content_order_value{
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: #3D3D3D;
|
||
}
|
||
.tuikuan_footer{
|
||
display: flex;
|
||
justify-content: center;
|
||
z-index: 9999;
|
||
position: relative;
|
||
}
|
||
.tuikuan_footer button{
|
||
width: 236px;
|
||
height: 46px;
|
||
background-color: #F78A30;
|
||
border-radius: 4PX;
|
||
border-color:#F78A30;
|
||
margin-top: 20px;
|
||
|
||
}
|
||
::v-deep .el-dialog{
|
||
width: 657px;
|
||
height: 561px;
|
||
background: #FFFFFF;
|
||
box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.2);
|
||
border-radius: 8px 8px 8px 8px;
|
||
}
|
||
.tuikuan_title{
|
||
font-family: Source Han Sans, Source Han Sans;
|
||
font-weight: 500;
|
||
font-size: 18px;
|
||
color: #3D3D3D;
|
||
line-height: 22px;
|
||
text-align: center;
|
||
margin-top: -30px;
|
||
margin-bottom: 48px;
|
||
}
|
||
.cancel-refund-dialog .el-dialog__header {
|
||
text-align: center;
|
||
font-weight: 600;
|
||
font-size: 18px;
|
||
}
|
||
.cancel-refund-dialog .el-dialog__body {
|
||
padding: 0 30px !important;
|
||
}
|
||
.cancel-refund-dialog .dialog-footer {
|
||
text-align: center;
|
||
}
|
||
@media screen and (max-width: 768px) {
|
||
|
||
}
|
||
</style>
|