<template>
|
<GlobalWindow
|
:title="title"
|
width="100%"
|
:withFooter="false"
|
:visible.sync="visible"
|
:confirm-working="isWorking"
|
@confirm="confirm"
|
>
|
<div class="box" v-if="info">
|
<div class="box_status">
|
<div class="box_status_row" v-for="(item, index) in info.parentStatusVOList" :key="index">
|
<div v-if="info.parentStatusVOList.length - 1 !== index" :class="item.optDate ? 'box_status_row_xian statusColor1' : 'box_status_row_xian'"></div>
|
<div :class="item.optDate ? 'box_status_row_icon statusColor1' : info.parentStatusVOList[index - 1].optDate ? 'box_status_row_icon statusColor2 statusColor3' : 'box_status_row_icon'"></div>
|
<div class="box_status_row_info">
|
<div class="title">{{item.parentTitle}}</div>
|
<div class="info" v-if="item.childTitle">{{item.childTitle}}</div>
|
<div class="info" v-if="item.optDate">{{item.optDate}}</div>
|
</div>
|
</div>
|
</div>
|
<template v-if="userInfo.type === 1">
|
<div class="box_tui">
|
<span class="box_tui_status">已退回</span>
|
<div class="box_tui_title">退回说明</div>
|
<div class="box_tui_info">时间：2025-03-11 12:23</div>
|
<div class="box_tui_info">人员：平台理赔人员-张三-18876784433</div>
|
<div class="box_tui_row"><div class="yuan"></div>住院病历材料不完整，请补充2025年1月1日至2月1日日期间的住院记录</div>
|
</div>
|
<div class="box_dk" v-if="info.status === 13">
|
<div class="box_dk_title">
|
<i class="el-icon-success"></i>
|
<span>已打款</span>
|
</div>
|
<div class="box_dk_list">
|
<div class="box_dk_list_row">
|
<div class="box_dk_list_row_label">打款时间：</div>
|
<div class="box_dk_list_row_value">2025-06-08 09:52</div>
|
</div>
|
<div class="box_dk_list_row">
|
<div class="box_dk_list_row_label">打款说明：</div>
|
<div class="box_dk_list_row_value">这里是打款说明</div>
|
</div>
|
<div class="box_dk_list_row">
|
<div class="box_dk_list_row_label">打款凭证：</div>
|
<div class="box_dk_list_row_l">
|
<div class="box_dk_list_row_l_img">
|
<img src="" alt="">
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="box_comInfo" v-if="[10,11,12].includes(info.status)">
|
<div class="box_comInfo_title">
|
<i class="el-icon-info"></i>
|
<span>重要提示</span>
|
</div>
|
<div class="box_comInfo_text">
|
<span>• 赔付款项将在确认后 1-3 个工作日内到账</span>
|
<span>• 请确认收款账户信息准确无误</span>
|
<span>• 如有疑问请及时联系客服 0551-77738493</span>
|
</div>
|
</div>
|
<div class="box_price" v-if="[10,11,12].includes(info.status)">
|
<span class="box_price_title">赔付金额{{[11].includes(info.status) ? '待确认' : '已确认'}}</span>
|
<span class="box_price_jine">¥{{info.hpAccount + info.hpOtherAccount}}</span>
|
<el-button type="text" style="margin-bottom: 5px;" @click="$refs.compensationDetails.open('赔付详情', info.hpAccountContent)">查看赔付详情</el-button>
|
<el-button type="primary" @click="confirmFeeInfo" v-if="[11].includes(info.status)">确认</el-button>
|
</div>
|
<div class="box_sinfo" v-if="[10,11,12].includes(info.status)">
|
<div class="box_sinfo_title">
|
<span>收款信息</span>
|
<span @click="$refs.paymentInformation.open('修改收款信息', {
|
id: info.id,
|
receiveBank: info.receiveBank,
|
receiveAccount: info.receiveAccount,
|
receiveUserName: info.receiveUserName
|
})">修改</span>
|
</div>
|
<div class="box_sinfo_row">
|
<div class="box_sinfo_row_label">开户银行：</div>
|
<div class="box_sinfo_row_val">{{info.receiveBank}}</div>
|
</div>
|
<div class="box_sinfo_row">
|
<div class="box_sinfo_row_label">账号：</div>
|
<div class="box_sinfo_row_val">{{info.receiveAccount}}</div>
|
</div>
|
<div class="box_sinfo_row">
|
<div class="box_sinfo_row_label">户名：</div>
|
<div class="box_sinfo_row_val">{{info.receiveUserName}}</div>
|
</div>
|
</div>
|
</template>
|
<div class="box_desc" v-if="[9,10].includes(info.status)">
|
<div class="box_desc_head">
|
<div class="box_desc_title">
|
<i class="el-icon-success"></i>
|
<span class="box_desc_title_val">理算完成</span>
|
</div>
|
</div>
|
<div class="box_desc_ls">
|
<span>理算赔付金额合计：</span>
|
<span>¥{{info.claimAccount + info.otherAccount}}</span>
|
</div>
|
<div class="box_desc_lslist">
|
<div class="box_desc_lslist_title">赔付详情</div>
|
<div class="box_desc_lslist_l">
|
<div class="box_desc_lslist_l_row" v-for="(item, index) in JSON.parse(info.accountContent).filter(row => row.type === 0)" :key="index">
|
<span>{{item.name}}</span>
|
<span>{{item.fee}}</span>
|
<span>{{item.describe}}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="box_desc">
|
<div class="box_desc_head">
|
<div class="box_desc_title">
|
<span class="box_desc_title_val">报案详情</span>
|
<div class="box_desc_title_zt" v-if="info.statusName">{{info.statusName}}</div>
|
<div class="box_desc_title_tips" v-if="info.isRisk === 1">
|
<i class="el-icon-warning"></i>
|
<span>风险案件</span>
|
</div>
|
<template v-if="userInfo.type === 0">
|
<el-select v-model="info.caseType" @change="setCaseType" style="width: 100px;" placeholder="案件类型" v-if="[9,10,11].includes(info.status)">
|
<el-option label="医疗" :value="1"></el-option>
|
<el-option label="伤残" :value="2"></el-option>
|
<el-option label="死亡" :value="3"></el-option>
|
</el-select>
|
</template>
|
</div>
|
<div class="box_desc_btns">
|
<template v-if="userInfo.type === 1">
|
<el-button type="danger" @click="revoke()" v-if="[1,2,3,4,5,9,7,10].includes(info.status)">撤销报案</el-button>
|
<el-button type="primary" @click="addReport(1)" v-if="[3].includes(info.status) && info.reportNumStatus === 0">添加报案号</el-button>
|
<el-button type="primary" @click="$refs.additionMaterial_ba.open('补充材料', info.id)" v-if="[3].includes(info.status)">补充材料</el-button>
|
</template>
|
<template v-if="userInfo.type === 0">
|
<el-button type="danger" @click="returnCase" v-if="[1,2].includes(info.status)">退回</el-button>
|
<el-button type="primary" @click="register" v-if="[1,2].includes(info.status)">立案</el-button>
|
<el-button type="primary" @click="$refs.acceptance.open('案件受理', info.id)" v-if="[3,5].includes(info.status)">受理</el-button>
|
<el-button type="primary" @click="addRemark" v-if="![0,1,2,4,13,14].includes(info.status)">备注</el-button>
|
<el-button type="primary" @click="addReport(1)" v-if="[3].includes(info.status) && info.reportNumStatus === 0">添加报案号</el-button>
|
<el-button type="primary" @click="addReport(2)" v-if="[9].includes(info.status) && info.reportNumStatus === 1">编辑报案号</el-button>
|
<el-button type="primary" @click="$refs.adjustment.open('理算', info.id, 1)" v-if="[9].includes(info.status)">理算</el-button>
|
<el-button type="primary" @click="$refs.adjustment.open('重新理算', info.id, 1)" v-if="[10].includes(info.status)">重新理算</el-button>
|
<el-button type="primary" @click="$refs.adjustment.open('核赔', info.id, 2)" v-if="[10].includes(info.status)">核赔</el-button>
|
<el-button type="primary" @click="$refs.adjustment.open('修改金额', info.id, 2)" v-if="[11,12].includes(info.status)">修改金额</el-button>
|
<el-button type="primary" @click="$refs.makePayment.open('打款', info.id)" v-if="[12].includes(info.status)">打款</el-button>
|
<el-button type="primary" @click="supplementaryMaterials" v-if="[9].includes(info.status)">补充材料</el-button>
|
<el-button type="primary" @click="$refs.additionMaterial_ba.open('添加材料', info.id)" v-if="[9,10].includes(info.status)">添加材料</el-button>
|
</template>
|
<el-button icon="el-icon-refresh-left" type="primary" circle @click="$refs.caseProgress.open('案件进度', info.settleClaimsLogList)" v-if="![0,13,14].includes(info.status)"></el-button>
|
</div>
|
</div>
|
<div class="box_desc_list">
|
<div class="box_desc_list_row">
|
报案时间：{{info.createDate}}
|
</div>
|
<div class="box_desc_list_row">
|
报案号：{{info.reportNum}}
|
</div>
|
<div class="box_desc_list_row">
|
所属保单：{{info.applyCode}}
|
</div>
|
<div class="box_desc_list_row">
|
报案人：{{info.informantName}}
|
</div>
|
<div class="box_desc_list_row">
|
报案人联系方式：{{info.informantPhone}}
|
</div>
|
<div class="box_desc_list_zw"></div>
|
</div>
|
</div>
|
<div class="box_fx" v-if="info.isRisk === 1">
|
<div class="box_fx_left">
|
<i class="el-icon-warning"></i>
|
<span class="box_fx_left_a">注意，该案件有{{info.riskContent.length}}条风险信息</span>
|
<span class="box_fx_left_b" @click="$refs.riskCaseReminder.open('风险案件提醒', info.riskContent)">查看详情</span>
|
</div>
|
<i class="el-icon-close" @click="info.isRisk = 0"></i>
|
</div>
|
<div class="box_desc">
|
<div class="box_desc_head">
|
<div class="box_desc_title">
|
<span class="box_desc_title_val">出险人信息</span>
|
</div>
|
<!-- <div class="box_desc_btns">-->
|
<!-- <div class="box_desc_btns_operate">-->
|
<!-- <i class="el-icon-arrow-down"></i>-->
|
<!-- <span>收起</span>-->
|
<!-- </div>-->
|
<!-- </div>-->
|
</div>
|
<div class="box_desc_list">
|
<div class="box_desc_list_row">
|
出险人姓名：{{info.memberName}}
|
</div>
|
<div class="box_desc_list_row">
|
出险人身份证号：{{info.memberIdcard}}
|
</div>
|
<div style="width: 33%; height: 0;"></div>
|
</div>
|
<div class="box_desc_head">
|
<div class="box_desc_title">
|
<span class="box_desc_title_val">保险方案</span>
|
</div>
|
</div>
|
<div class="box_desc_f">
|
<div class="box_desc_fa">
|
<div class="box_desc_fa_title">{{info.solutionName}}</div>
|
<div class="box_desc_fa_row">保单号：{{info.applyCode}}</div>
|
<div class="box_desc_fa_row">保障期限：{{info.baoxianStartTime}}～{{info.baoxianEndTime}}</div>
|
<div class="box_desc_fa_row">投保单位：{{info.companyName}}</div>
|
<div class="box_desc_fa_row">派遣单位：{{info.duName}}</div>
|
<div class="box_desc_fa_row">所属工种：{{info.worktypeName}}</div>
|
</div>
|
</div>
|
<div class="box_desc_head">
|
<div class="box_desc_title">
|
<span class="box_desc_title_val">出险信息</span>
|
</div>
|
</div>
|
<div class="box_desc_list">
|
<div class="box_desc_list_row">
|
出险时间：{{info.happenTime}}
|
</div>
|
<div class="box_desc_list_row">
|
就诊医疗机构：{{info.hospital}}
|
</div>
|
<div class="box_desc_list_row">
|
出险地区：{{info.areaInfo}}
|
</div>
|
<div class="box_desc_list_row" style="width: 100%;">
|
出险经过：{{info.content}}
|
</div>
|
<div class="box_desc_list_row" style="width: 100%;">
|
事故类型：{{returnType(info.type)}}
|
</div>
|
<div class="box_desc_list_row">
|
是否有医疗保险：{{returnName(info.medicalInsurance)}}
|
</div>
|
<div class="box_desc_list_row">
|
就诊类型：{{returnInHospital(info.inHospital)}}
|
</div>
|
<div class="box_desc_list_zw"></div>
|
<div class="box_desc_list_img">
|
<span>事故视频/照片：</span>
|
<div class="box_desc_list_img_files">
|
<div class="box_desc_list_img_files_row" v-for="(item, index) in info.reportFileList" :key="index">
|
<img :src="item.fileurlFull" alt="img" />
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="box_desc">
|
<div class="box_desc_head">
|
<div class="box_desc_title">
|
<span class="box_desc_title_val">理赔材料</span>
|
</div>
|
<!-- <div class="box_desc_btns">-->
|
<!-- <div class="box_desc_btns_operate">-->
|
<!-- <i class="el-icon-arrow-down"></i>-->
|
<!-- <span>收起</span>-->
|
<!-- </div>-->
|
<!-- </div>-->
|
</div>
|
<div class="box_desc_cailiao">
|
<div class="box_desc_cailiao_title">
|
<div class="box_desc_cailiao_title_x"></div>
|
<span>员工关系证明材料</span>
|
</div>
|
<div class="box_desc_cailiao_list">
|
<div class="box_desc_cailiao_list_img" v-for="(item, index) in info.relationFileList" :key="index">
|
<img :src="item.fileurlFull" alt="img" />
|
</div>
|
</div>
|
</div>
|
<div class="box_desc_cailiao">
|
<div class="box_desc_cailiao_title">
|
<div class="box_desc_cailiao_title_x"></div>
|
<span>门诊</span>
|
</div>
|
<div class="box_desc_cailiao_list">
|
<div class="box_desc_cailiao_list_img" v-for="(item, index) in info.outpatientFileList" :key="index">
|
<img :src="item.fileurlFull" alt="img" />
|
</div>
|
</div>
|
</div>
|
<div class="box_desc_cailiao">
|
<div class="box_desc_cailiao_title">
|
<div class="box_desc_cailiao_title_x"></div>
|
<span>住院</span>
|
</div>
|
<div class="box_desc_cailiao_list">
|
<div class="box_desc_cailiao_list_img" v-for="(item, index) in info.hospitalFileList" :key="index">
|
<img :src="item.fileurlFull" alt="img" />
|
</div>
|
</div>
|
</div>
|
<div class="box_desc_cailiao">
|
<div class="box_desc_cailiao_title">
|
<div class="box_desc_cailiao_title_x"></div>
|
<span>伤残</span>
|
</div>
|
<div class="box_desc_cailiao_list">
|
<div class="box_desc_cailiao_list_img" v-for="(item, index) in info.disabilityFileList" :key="index">
|
<img :src="item.fileurlFull" alt="img" />
|
</div>
|
</div>
|
</div>
|
<div class="box_desc_cailiao">
|
<div class="box_desc_cailiao_title">
|
<div class="box_desc_cailiao_title_x"></div>
|
<span>其他材料</span>
|
</div>
|
<div class="box_desc_cailiao_list">
|
<div class="box_desc_cailiao_list_img" v-for="(item, index) in info.otherFileList" :key="index">
|
<img :src="item.fileurlFull" alt="img" />
|
</div>
|
</div>
|
</div>
|
<div class="box_desc_cailiao">
|
<div class="box_desc_cailiao_title">
|
<div class="box_desc_cailiao_title_x"></div>
|
<span>补充材料</span>
|
</div>
|
<div class="box_desc_cailiao_list">
|
<div class="box_desc_cailiao_list_img" v-for="(item, index) in info.supplementFileList" :key="index">
|
<img :src="item.fileurlFull" alt="img" />
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<!-- 退回 -->
|
<el-dialog
|
title="退回"
|
:visible.sync="show"
|
width="500px">
|
<span>这是一段信息</span>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="show = false">取消</el-button>
|
<el-button type="primary" @click="show = false">确定退回</el-button>
|
</span>
|
</el-dialog>
|
<!-- 风险案件提醒 -->
|
<RiskCaseReminder ref="riskCaseReminder" />
|
<!-- 案件进度 -->
|
<CaseProgress ref="caseProgress" />
|
<!-- 受理 -->
|
<Acceptance ref="acceptance" @success="getDetail" />
|
<!-- 添加材料 -->
|
<AdditionMaterial_ba ref="additionMaterial_ba" @success="getDetail" />
|
<!-- 理算 -->
|
<adjustment ref="adjustment" @success="getDetail" />
|
<!-- 赔付详情 -->
|
<CompensationDetails ref="compensationDetails" />
|
<!-- 修改收款信息 -->
|
<PaymentInformation ref="paymentInformation" @success="getDetail" />
|
<!-- 打款 -->
|
<MakePayment ref="makePayment" @success="getDetail" />
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import BaseOpera from '@/components/base/BaseOpera'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import { findById, returnSettle } from '@/api/business/settleClaims'
|
import {
|
register,
|
addReportNum,
|
addRemark,
|
saveSupplementDescribe,
|
updCaseType,
|
confirmFee,
|
payCash } from '@/api/business/settleRisk'
|
import RiskCaseReminder from '@/components/business/riskCaseReminder'
|
import CaseProgress from '@/components/business/caseProgress'
|
import Acceptance from '@/components/business/acceptance'
|
import AdditionMaterial_ba from '@/components/business/additionMaterial_ba'
|
import adjustment from '@/components/business/adjustment'
|
import CompensationDetails from '@/components/business/compensationDetails'
|
import PaymentInformation from '@/components/business/paymentInformation'
|
import MakePayment from '@/components/business/makePayment'
|
import { mapState } from 'vuex'
|
|
export default {
|
name: 'OperaSettleClaimsWindow',
|
extends: BaseOpera,
|
components: { GlobalWindow, MakePayment, PaymentInformation, CompensationDetails, RiskCaseReminder, CaseProgress, Acceptance, AdditionMaterial_ba, adjustment },
|
data () {
|
return {
|
show: false,
|
info: null,
|
id: null
|
}
|
},
|
computed: {
|
...mapState(['userInfo'])
|
},
|
created () {
|
this.config({
|
api: '/business/settleClaims',
|
'field.id': 'id'
|
})
|
},
|
methods: {
|
open (title, id) {
|
this.title = title
|
this.id = id
|
this.getDetail()
|
},
|
setCaseType(e) {
|
updCaseType({ id: this.id, caseType: e })
|
.then(res => {
|
this.getDetail()
|
})
|
},
|
supplementaryMaterials() {
|
this.$prompt('补充说明', '补充材料', {
|
confirmButtonText: '提交',
|
cancelButtonText: '取消',
|
inputPattern: /^(?:.|\n)+$/,
|
inputErrorMessage: '补充说明不能为空！',
|
beforeClose: (action, instance, done) => {
|
if (action === 'confirm') {
|
instance.confirmButtonLoading = true;
|
saveSupplementDescribe({ id: this.id, describe: instance.inputValue })
|
.finally(() => {
|
done();
|
instance.confirmButtonLoading = false;
|
})
|
} else {
|
done();
|
}
|
}
|
}).then(({ value }) => {
|
this.getDetail()
|
}).catch(() => {
|
|
});
|
},
|
addRemark() {
|
this.$prompt('备注', '添加备注', {
|
confirmButtonText: '添加',
|
cancelButtonText: '取消',
|
inputPattern: /^(?:.|\n)+$/,
|
inputErrorMessage: '备注不能为空！',
|
beforeClose: (action, instance, done) => {
|
if (action === 'confirm') {
|
instance.confirmButtonLoading = true;
|
addRemark({ id: this.id, describe: instance.inputValue })
|
.finally(() => {
|
done();
|
instance.confirmButtonLoading = false;
|
})
|
} else {
|
done();
|
}
|
}
|
}).then(({ value }) => {
|
this.getDetail()
|
}).catch(() => {
|
|
});
|
},
|
addReport(type) {
|
this.$prompt(`报案号`, `${type === 1 ? '添加报案号' : '编辑报案号'}`, {
|
confirmButtonText: '添加',
|
cancelButtonText: '取消',
|
inputPattern: /^(?:.|\n)+$/,
|
inputErrorMessage: '报案号不能为空！',
|
beforeClose: (action, instance, done) => {
|
if (action === 'confirm') {
|
instance.confirmButtonLoading = true;
|
addReportNum({ id: this.id, reportNum: instance.inputValue })
|
.finally(() => {
|
done();
|
instance.confirmButtonLoading = false;
|
})
|
} else {
|
done();
|
}
|
}
|
}).then(({ value }) => {
|
this.getDetail()
|
}).catch(() => {
|
|
});
|
},
|
register() {
|
this.$prompt('立案说明', '立案', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
beforeClose: (action, instance, done) => {
|
if (action === 'confirm') {
|
instance.confirmButtonLoading = true;
|
register({ id: this.id, describe: instance.inputValue, registerStatus: 3 })
|
.finally(() => {
|
done();
|
instance.confirmButtonLoading = false;
|
})
|
} else {
|
done();
|
}
|
}
|
}).then(({ value }) => {
|
this.getDetail()
|
}).catch(() => {
|
|
});
|
},
|
returnCase() {
|
this.$prompt('退回说明', '退回', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
inputPattern: /^(?:.|\n)+$/,
|
inputErrorMessage: '退回说明不能为空！',
|
beforeClose: (action, instance, done) => {
|
if (action === 'confirm') {
|
instance.confirmButtonLoading = true;
|
register({ id: this.id, describe: instance.inputValue, registerStatus: 4 })
|
.finally(() => {
|
done();
|
instance.confirmButtonLoading = false;
|
})
|
} else {
|
done();
|
}
|
}
|
}).then(({ value }) => {
|
this.getDetail()
|
}).catch(() => {
|
|
});
|
},
|
getDetail() {
|
findById(this.id)
|
.then(res => {
|
res.riskContent = JSON.parse(res.riskContent)
|
this.info = res
|
this.visible = true
|
})
|
},
|
// 撤销
|
revoke(id) {
|
this.$confirm('撤销后，案件直接结束，无法继续进行理赔操作！', '是否撤销报案？', {
|
confirmButtonText: '确定撤销',
|
cancelButtonText: '我再想想',
|
type: 'warning'
|
}).then(() => {
|
returnSettle({ id: this.info.id })
|
.then(res => {
|
this.getDetail()
|
})
|
}).catch(() => {
|
|
});
|
},
|
returnInHospital(type) {
|
switch (type) {
|
case 0:
|
return '住院'
|
case 1:
|
return '门诊'
|
}
|
},
|
returnName(type) {
|
switch (type) {
|
case 0:
|
return '是'
|
case 1:
|
return '否'
|
}
|
},
|
returnType(type) {
|
switch (type) {
|
case 0:
|
return '工作期间受伤'
|
case 1:
|
return '上下班途中受伤'
|
case 2:
|
return '非工作时间受伤'
|
case 3:
|
return '意外受伤'
|
}
|
},
|
confirmFeeInfo() {
|
this.$confirm('是否确认赔付金额?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
confirmFee(this.id)
|
.then(res => {
|
this.getDetail()
|
})
|
}).catch(() => {
|
|
});
|
},
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.box {
|
width: 100%;
|
.box_tui {
|
width: 100%;
|
padding: 17px 0;
|
box-sizing: border-box;
|
margin-bottom: 30px;
|
.box_tui_status {
|
padding: 3px 8px;
|
border-radius: 15px;
|
background-color: rgba(254,226,225,1);
|
color: rgba(153,27,27,1);
|
font-size: 12px;
|
}
|
.box_tui_title {
|
color: rgba(16,16,16,1);
|
font-size: 16px;
|
margin-top: 15px;
|
}
|
.box_tui_info {
|
color: rgba(154,154,154,1);
|
font-size: 14px;
|
margin-top: 10px;
|
}
|
.box_tui_row {
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
margin-top: 10px;
|
display: flex;
|
align-items: center;
|
.yuan {
|
width: 5px;
|
height: 5px;
|
border-radius: 50%;
|
margin-right: 5px;
|
background-color: rgba(153,27,27,1);
|
}
|
}
|
}
|
.box_dk {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
margin-bottom: 30px;
|
.box_dk_title {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 12px;
|
i {
|
font-size: 20px;
|
margin-right: 5px;
|
color: #34C758;
|
}
|
span {
|
color: rgba(52,199,88,1);
|
font-size: 18px;
|
}
|
}
|
.box_dk_list {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
.box_dk_list_row {
|
width: 100%;
|
display: flex;
|
align-items: start;
|
margin-bottom: 15px;
|
&:last-child {
|
margin: 0 !important;
|
}
|
.box_dk_list_row_label {
|
flex-shrink: 0;
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
}
|
.box_dk_list_row_value {
|
flex: 1;
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
}
|
.box_dk_list_row_l {
|
flex: 1;
|
display: flex;
|
align-items: center;
|
flex-wrap: wrap;
|
.box_dk_list_row_l_img {
|
width: 80px;
|
height: 80px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
overflow: hidden;
|
margin-right: 15px;
|
margin-bottom: 15px;
|
img {
|
width: 100%;
|
height: 100%;
|
}
|
}
|
}
|
}
|
}
|
}
|
.box_sinfo {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
margin-bottom: 30px;
|
.box_sinfo_title {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 26px;
|
span {
|
&:nth-child(1) {
|
color: rgba(16,16,16,1);
|
font-size: 16px;
|
margin-right: 10px;
|
}
|
&:nth-child(2) {
|
color: rgba(22,93,255,1);
|
font-size: 14px;
|
cursor: pointer;
|
text-decoration: underline;
|
}
|
}
|
}
|
.box_sinfo_row {
|
width: 100%;
|
margin-bottom: 15px;
|
display: flex;
|
align-items: center;
|
.box_sinfo_row_label {
|
flex-shrink: 0;
|
color: rgba(154,154,154,1);
|
font-size: 14px;
|
}
|
.box_sinfo_row_val {
|
flex: 1;
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
}
|
}
|
}
|
.box_price {
|
width: 100%;
|
padding: 30px 0;
|
background-color: #ffffff;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
margin-bottom: 30px;
|
border-bottom: 1px solid #ececec;
|
.box_price_title {
|
color: rgba(16,16,16,1);
|
font-size: 20px;
|
margin-bottom: 10px;
|
}
|
.box_price_jine {
|
color: rgba(255,162,63,1);
|
font-size: 29px;
|
margin-bottom: 10px;
|
}
|
}
|
.box_comInfo {
|
width: 100%;
|
padding: 11px 21px;
|
box-sizing: border-box;
|
background-color: rgba(240,246,254,1);
|
display: flex;
|
flex-direction: column;
|
margin-bottom: 30px;
|
.box_comInfo_title {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 12px;
|
i {
|
color: #165DFF;
|
font-size: 20px;
|
margin-right: 5px;
|
}
|
span {
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
}
|
}
|
.box_comInfo_text {
|
width: 100%;
|
padding-left: 20px;
|
box-sizing: border-box;
|
display: flex;
|
flex-direction: column;
|
span {
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
margin-bottom: 10px;
|
&:last-child {
|
margin: 0 !important;
|
}
|
}
|
}
|
}
|
.box_status {
|
width: 100%;
|
padding: 30px 0;
|
box-sizing: border-box;
|
display: flex;
|
align-items: start;
|
justify-content: center;
|
/*margin-bottom: 30px;*/
|
.box_status_row {
|
width: 200px;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
position: relative;
|
.box_status_row_xian {
|
position: absolute;
|
right: -55px;
|
top: 5px;
|
width: calc(100% - 80px);
|
height: 1px;
|
background-color: #BEBEBE;
|
}
|
.statusColor1 {
|
background-color: #165DFF !important;
|
}
|
.statusColor2 {
|
border: 1px solid #0052D9 !important;
|
}
|
.statusColor3 {
|
span {
|
color: #ffffff !important;
|
}
|
}
|
.box_status_row_icon {
|
width: 8px;
|
height: 8px;
|
border: 1px solid #C5C5C5;
|
border-radius: 50%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
span {
|
color: rgba(78,89,105,1);
|
font-size: 14px;
|
}
|
i {
|
color: #165DFF;
|
}
|
}
|
.box_status_row_info {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
margin-top: 10px;
|
.title {
|
color: rgba(78,89,105,1);
|
font-size: 16px;
|
font-weight: bold;
|
}
|
.info {
|
color: rgba(154,154,154,1);
|
font-size: 14px;
|
margin-top: 10px;
|
}
|
}
|
}
|
}
|
.box_desc {
|
width: 100%;
|
margin-bottom: 15px;
|
.box_desc_cailiao {
|
width: 100%;
|
margin-bottom: 18px;
|
.box_desc_cailiao_title {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 15px;
|
.box_desc_cailiao_title_x {
|
width: 5px;
|
height: 14px;
|
background-color: #165DFF;
|
}
|
span {
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
margin-left: 5px;
|
}
|
}
|
.box_desc_cailiao_list {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
flex-wrap: wrap;
|
.box_desc_cailiao_list_img {
|
width: 100px;
|
height: 100px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
overflow: hidden;
|
margin-right: 15px;
|
background-color: #E5E5E5;
|
&:last-child {
|
margin: 0;
|
}
|
img {
|
width: 100%;
|
height: 100%;
|
}
|
}
|
}
|
}
|
.box_desc_ls {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 15px;
|
span {
|
&:nth-child(1) {
|
color: rgba(0,0,0,1);
|
font-size: 16px;
|
}
|
&:nth-child(2) {
|
color: rgba(255,162,63,1);
|
font-size: 16px;
|
}
|
}
|
}
|
.box_desc_lslist {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
margin-bottom: 40px;
|
.box_desc_lslist_title {
|
color: rgba(0,0,0,1);
|
font-size: 16px;
|
margin-bottom: 15px;
|
}
|
.box_desc_lslist_l {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
padding-left: 50px;
|
box-sizing: border-box;
|
.box_desc_lslist_l_row {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 13px;
|
&:last-child {
|
margin: 0 !important;
|
}
|
span {
|
&:nth-child(1) {
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
}
|
&:nth-child(2) {
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
margin: 0 30px;
|
}
|
&:nth-child(3) {
|
color: rgba(108,108,108,1);
|
font-size: 14px;
|
}
|
}
|
}
|
}
|
}
|
.box_desc_head {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
margin-bottom: 26px;
|
.box_desc_title {
|
display: flex;
|
align-items: center;
|
.el-icon-success {
|
font-size: 20px;
|
color: #34C758;
|
margin-right: 10px;
|
}
|
.box_desc_title_val {
|
color: rgba(16,16,16,1);
|
font-size: 18px;
|
margin-right: 20px;
|
}
|
.box_desc_title_zt {
|
height: 25px;
|
padding: 0 15px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
box-sizing: border-box;
|
border-radius: 15px;
|
background-color: rgba(239,239,239,1);
|
color: rgba(16,16,16,1);
|
font-size: 12px;
|
margin-right: 20px;
|
}
|
.box_desc_title_tips {
|
width: 84px;
|
height: 25px;
|
border-radius: 15px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
background-color: rgba(254,226,225,1);
|
margin-right: 20px;
|
.el-icon-warning {
|
color: #FF4D4F;
|
margin-right: 5px;
|
}
|
span {
|
color: #FF4D4F;
|
font-size: 12px;
|
}
|
}
|
}
|
.box_desc_btns {
|
display: flex;
|
align-items: center;
|
.box_desc_btns_operate {
|
display: flex;
|
align-items: center;
|
margin-left: 10px;
|
cursor: pointer;
|
i {
|
color: #515151;
|
}
|
span {
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
margin-left: 4px;
|
}
|
}
|
}
|
}
|
.box_desc_list {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
flex-wrap: wrap;
|
.box_desc_list_zw {
|
width: 33%;
|
height: 0;
|
}
|
.box_desc_list_row {
|
width: 33%;
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
margin-bottom: 24px;
|
}
|
.box_desc_list_img {
|
width: 100%;
|
display: flex;
|
align-items: start;
|
span {
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
}
|
.box_desc_list_img_files {
|
flex-shrink: 0;
|
display: flex;
|
align-items: center;
|
flex-wrap: wrap;
|
.box_desc_list_img_files_row {
|
width: 94px;
|
height: 94px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
overflow: hidden;
|
margin-right: 25px;
|
&:last-child {
|
margin: 0;
|
}
|
background-color: #E5E5E5;
|
img {
|
width: 100%;
|
}
|
}
|
}
|
}
|
}
|
.box_desc_f {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
flex-wrap: wrap;
|
margin-bottom: 30px;
|
justify-content: space-between;
|
.box_desc_fa {
|
width: 32%;
|
padding: 22px 25px;
|
box-sizing: border-box;
|
border-radius: 4px;
|
background-color: rgba(239,239,239,1);
|
.box_desc_fa_title {
|
color: rgba(16,16,16,1);
|
font-size: 18px;
|
font-weight: bold;
|
text-decoration: underline;
|
margin-bottom: 10px;
|
}
|
.box_desc_fa_row {
|
color: rgba(16,16,16,1);
|
font-size: 14px;
|
margin-bottom: 10px;
|
&:last-child {
|
margin: 0;
|
}
|
}
|
}
|
}
|
}
|
.box_fx {
|
width: 100%;
|
height: 49px;
|
display: flex;
|
padding: 0 17px;
|
margin-bottom: 30px;
|
box-sizing: border-box;
|
align-items: center;
|
justify-content: space-between;
|
background-color: rgba(254,226,225,1);
|
.box_fx_left {
|
display: flex;
|
align-items: center;
|
i {
|
color: #FF4D4F;
|
font-size: 18px;
|
}
|
.box_fx_left_a {
|
color: rgba(255,77,79,1);
|
font-size: 14px;
|
margin: 0 10px;
|
}
|
.box_fx_left_b {
|
color: rgba(255,77,79,1);
|
font-size: 14px;
|
text-decoration: underline;
|
cursor: pointer;
|
}
|
}
|
.el-icon-close {
|
color: #101010;
|
cursor: pointer;
|
font-size: 18px;
|
}
|
}
|
}
|
</style>
|
