<!--
|
* @Descripttion: 智享云状态切换 + 数据资料的反显,无复杂逻辑
|
* @Author: TM丶
|
* @LastEditors: 小明丶
|
* @Date: 2019-04-21 18:06:00
|
* @LastEditTime: 2019-09-02 11:15:49
|
-->
|
<template>
|
<div class="zxh-set-box">
|
<x-header title="智享花" :left-options="{backText:''}"></x-header>
|
<group>
|
<x-switch title="状态" v-model="status"></x-switch>
|
</group>
|
<f-space></f-space>
|
<group>
|
<div class="title">
|
<span class="line"></span>
|
基本信息
|
</div>
|
<cell title="商户名称" :value="info.merName"></cell>
|
<cell title="营业执照号" :value="info.licenseNo"></cell>
|
<cell title="地址" :value="info.merAddr"></cell>
|
<cell title="详细地址" :value="info.merDtlAddr"></cell>
|
<cell title="营业面积" :value="info.merArea"></cell>
|
<cell title="成立日期" :value="info.foundDate | timeformat('yyyy-MM-dd')"></cell>
|
<cell title="协议开始时间" :value="(info.agreeStartTime || '') | parseDate"></cell>
|
<cell title="协议结束时间" :value="(info.agreeEndTime || '') | parseDate"></cell>
|
</group>
|
<f-space></f-space>
|
|
<group>
|
<div class="title">
|
<span class="line"></span>
|
法人信息
|
</div>
|
<cell title="法人姓名" :value="info.legalName"></cell>
|
<cell title="法人身份证号" :value="info.legalIdNo"></cell>
|
<cell title="法人电话" :value="info.legalMblNo"></cell>
|
<cell title="法人家庭住址" :value="info.legalHomeAddr"></cell>
|
</group>
|
<f-space></f-space>
|
|
<group>
|
<div class="title">
|
<span class="line"></span>
|
银行信息
|
</div>
|
<cell title="银行名称" :value="info.bankName"></cell>
|
<cell title="开户行" :value="info.bankDtlName"></cell>
|
<cell title="地址" :value="info.bankAddr"></cell>
|
<cell title="户名" :value="info.cardName"></cell>
|
<cell title="银行账号" :value="info.cardNo"></cell>
|
<cell title="账号类型" :value="info.cardTypeName"></cell>
|
<cell title="开户行行号" v-if="info.cardType ==='pu'" :value="info.bankNo"></cell>
|
</group>
|
|
<f-space></f-space>
|
|
<!-- 图片反显 -->
|
<section class="img-box">
|
<h4>营业执照照片</h4>
|
<div class="img-item" v-for="(item, index) in info.licencePhotos" :key="index"
|
:style="item.fileUrl | generate">
|
</div>
|
</section>
|
<section class="img-box">
|
<h4>法人身份证正反面照片</h4>
|
<div class="img-item" v-for="(item, index) in info.legalCardPhotos" :key="index"
|
:style="item.fileUrl | generate"></div>
|
</section>
|
<section class="img-box">
|
<h4>房产证或租赁合同</h4>
|
<div class="img-item" v-for="(item, index) in info.houseContractPhotos" :key="index"
|
:style="item.fileUrl | generate"></div>
|
</section>
|
<section class="img-box">
|
<h4>外景照、门头照片、前台照、内景照</h4>
|
<div class="img-item" v-for="(item, index) in info.storePhotos" :key="index"
|
:style="item.fileUrl | generate"></div>
|
</section>
|
<section class="img-box">
|
<h4>套餐活动清单、终端商品定价清单</h4>
|
<div class="img-item" v-for="(item, index) in info.mealBillPhotos" :key="index"
|
:style="item.fileUrl | generate"></div>
|
</section>
|
<section class="img-box">
|
<h4>运营商授权文件</h4>
|
<div class="img-item" v-for="(item, index) in info.accreditFilePhotos" :key="index"
|
:style="item.fileUrl | generate"></div>
|
</section>
|
<f-button fixed @on-click="submit">保存</f-button>
|
</div>
|
</template>
|
|
<script>
|
import {
|
XSwitch
|
} from 'vux';
|
|
export default {
|
name: "xyg_info",
|
components: {
|
XSwitch
|
},
|
data() {
|
return {
|
status: true,
|
info: {},
|
productInfo: {}
|
}
|
},
|
filters: {
|
generate(path) {
|
return {
|
'background-image': `url(${path})`
|
}
|
},
|
parseDate(v = '') {
|
if (v) {
|
return v.slice(0, 4) + '-' + v.slice(4, 6) + '-' + v.slice(-2);
|
} else {
|
return '暂无';
|
}
|
}
|
},
|
created() {
|
this.init();
|
},
|
methods: {
|
init() {
|
this.$api.prodRefInit(this.$route.query).then(res => {
|
this.productInfo = res.body;
|
this.status = !!this.productInfo.status;
|
});
|
// 获取商户信息反显
|
this.$api.getXygMerInfo(this.$route.query.orgId).then(res => {
|
this.info = res.body;
|
})
|
},
|
// 保存
|
submit() {
|
this.$api.prodSaveRef({
|
...this.$route.query,
|
prodSkDtlInfoList: this.productInfo.prodSkDtlInfoList,
|
status: this.status ? 1 : 0
|
}).then(() => {
|
this.$notify('保存成功');
|
});
|
}
|
},
|
}
|
</script>
|
|
<style lang="less">
|
.zxh-set-box {
|
padding-bottom: 60px;
|
|
.title {
|
padding: 14px 12px;
|
font-size: 15px;
|
color: #333;
|
|
.line {
|
display: inline-block;
|
width: 2px;
|
height: 16px;
|
margin-right: 8px;
|
background: @color-text-three;
|
vertical-align: middle;
|
margin-top: -1px;
|
}
|
}
|
|
.img-box {
|
padding: 0 12px;
|
background-color: #fff;
|
margin-bottom: 20px;
|
|
h4 {
|
font-weight: normal;
|
font-size: 15px;
|
line-height: 40px;
|
}
|
|
.img-item {
|
display: inline-block;
|
height: 100px;
|
width: 100px;
|
margin: 0 10px 10px 0;
|
border: 1Px dashed #d9d9d9;
|
background-repeat: no-repeat;
|
background-size: contain;
|
background-position: center;
|
}
|
}
|
}
|
</style>
|