finance-ssr/pages/checkcustinfo/checkcust.vue

<template>
  <div class="content">
  <!--   主体内容-->
  <div class="row content-row">
    <!--page1-->
    <div class="list-inline">
      <div class="all">
        <div class="form-group">
          <label class="control-label">公司名称(中文名):</label>
          <input type="text" class="form-control" v-model="$store.state.tab1.cu_name" disabled/>
        </div>
        <div class="form-group">
          <label class="control-label">公司名称(英文名):</label>
          <input type="text" class="form-control" v-model="$store.state.tab1.cu_engname"/>
        </div>
      </div>
      <div class="all">
        <div class="form-group">
          <label class="control-label">机构类型:</label>
          <select class="form-control" v-model="$store.state.tab1.cu_institutype">
            <option>法人企业</option>
            <option>非法人企业</option>
            <option>其他</option>
          </select>
        </div>
        <div class="form-group">
          <label class="control-label">成立时间:</label>
          <el-date-picker
            required
            v-model="$store.state.tab1.cu_licensedate"
            type="date"
            placeholder="选择日期">
          </el-date-picker>
        </div>
      </div>
      <div class="all">
        <div class="form-group">
          <label class="control-label">证件类型:</label>
          <select class="form-control" required v-model="$store.state.tab1.cu_paperstype">
            <option>统一社会信用代码</option>
            <option>组织机构代码证</option>
            <option>其他</option>
          </select>
        </div>
        <div class="form-group">
          <label class="control-label">证件号码:</label>
          <input type="text" class="form-control" required v-model="$store.state.tab1.cu_paperscode"/>
        </div>
      </div>
      <div class="all">
        <div class="form-group">
          <label class="control-label">证件有效期:</label>
          <el-date-picker
            required
            v-model="$store.state.tab1.cu_ctfduedate"
            type="date"
            placeholder="选择日期">
          </el-date-picker>
        </div>
        <div class="form-group" style="margin-left: 100px">
          <label class="control-label">营业执照号:</label>
          <input type="text" class="form-control" v-model="$store.state.tab1.cu_businesscode" required maxlength="50"/>
        </div>
      </div>
      <div class="all">
        <div class="form-group">
          <label class="control-label">国标行业分类:</label>
          <select class="form-control" v-model="$store.state.tab1.cu_nastdinducls" required>
            <option>农、林、牧、渔业</option>
            <option>采矿业</option>
            <option>制造业</option>
            <option>电力、热力、燃气及水生产和供应链</option>
            <option>建筑业</option>
            <option>批发和零售业</option>
            <option>交通运输、仓储和邮政业</option>
            <option>住宿和餐饮业</option>
            <option>信息传输、软件和信息技术服务业</option>
            <option>金融业</option>
            <option>房地产业</option>
            <option>租赁和商务服务业</option>
            <option>科学研究和技术服务</option>
            <option>水利、环境和公共设施管理业</option>
            <option>居民服务、修理和其他服务业</option>
            <option>教育</option>
            <option>卫生和社会工作</option>
            <option>文化、体育和娱乐业</option>
            <option>公共管理、社会保障和社会组织</option>
            <option>国际组织</option>
          </select>
        </div>
        <div class="form-group">
          <label class="control-label">注册资本币种:</label>
          <input type="text" class="form-control" v-model="$store.state.tab1.cu_capcurrency" required />
        </div>
      </div>
      <div class="all">
        <div class="form-group">
          <label class="control-label">注册资本(万元):</label>
          <input type="number" class="form-control" min="0"
                 v-model.nubmer="$store.state.tab1.cu_regcapital" required/>
        </div>
        <div class="form-group">
          <label class="control-label">实缴资本(万元):</label>
          <input type="number" class="form-control" min="0"
                 v-model="$store.state.tab1.cu_paidincapital" required/>
        </div>
      </div>
      <div class="all">
        <div class="form-group1">
          <label class="control-label">公司注册地:</label>
          <textarea class="form-control" max-length="50" rows="2" placeholder="限50字符" maxlength="50"
                    v-model="$store.state.tab1.cu_regadd" required>
                            </textarea>
        </div>
      </div>
      <div class="all">
        <div class="form-group1">
          <label class="control-label">办公地址:</label>
          <textarea class="form-control" rows="2" max-length="500" placeholder="限50字符" maxlength="50"
                    v-model="$store.state.tab1.cu_officeadd" required >
                            </textarea>
        </div>
      </div>
      <div class="all">
        <div class="form-group1">
          <label class="control-label">经营范围:</label>
          <textarea class="form-control" rows="10" max-length="500" placeholder="限500字符" maxlength="500"
                    v-model="$store.state.tab1.cu_businsscope" required>
                            </textarea>
        </div>
      </div>
      <div class="all">
        <div class="form-group1">
          <label class="control-label">其他情况说明:</label>
          <textarea class="form-control" rows="10" placeholder="限500字符" maxlength="500"
                    v-model="$store.state.tab1.cu_others" required>
                            </textarea>
        </div>
      </div>
    </div>
    <!--page2-->
    <div id="tab2" class="tab">
      <table class="table table-striped">
        <thead>
        <tr>
          <th style="width: 70px">序号</th>
          <th>股东名称</th>
          <th>证件类型</th>
          <th>证件号码</th>
          <th>股权比例(%)</th>
          <th>出资金额(万元)</th>
        </tr>
        </thead>
        <tbody>
        <tr v-for="(page2, index) in $store.state.tab2">
          <td v-text="index + 1"></td>
          <td><input type="text" v-model="page2.cs_name" :readonly="page2.isDisabled"></td>
          <td><input type="text" v-model="page2.cs_paperstype" :readonly="page2.isDisabled"/></td>
          <td><input type="text" v-model="page2.cs_paperscode" :readonly="page2.isDisabled"/></td>
          <td><input type="number" min="0" v-model="page2.cs_investratio" :readonly="page2.isDisabled"/></td>
          <td><input type="number" min="0" v-model="page2.cs_investamount" :readonly="page2.isDisabled"/></td>
        </tr>
        <tr>
          <td><input type="button" value="+" @click="$store.commit('addtab2')"/></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
        </tr>
        </tbody>
      </table>
    </div>
    <!--page3-->
    <div class="tab"  style="overflow-x: auto">
      <table class="table table-striped">
        <thead>
        <tr>
          <th width="70">序号</th>
          <th>企业名称</th>
          <th>关联关系</th>
          <th>法人代表</th>
          <th>注册资本(万元)</th>
          <th>法人代表股权(占比%)</th>
          <th>主营业务</th>
        </tr>
        </thead>
        <tbody>
        <tr v-for="(page3,index) in $store.state.tab3">
          <td v-text="index + 1"></td>
          <td><input type="text" v-model="page3.cud_name" :readonly="page3.isDisabled"></td>
          <td><input type="text" v-model="page3.cud_association" :readonly="page3.isDisabled"/></td>
          <td><input type="text" v-model="page3.cud_legalperson" :readonly="page3.isDisabled"/></td>
          <td><input type="number" min="0" v-model="page3.cud_amount" :readonly="page3.isDisabled"/></td>
          <td><input type="number" min="0" v-model="page3.cud_ratio" :readonly="page3.isDisabled"/></td>
          <td><input type="text" v-model="page3.cud_product" :readonly="page3.isDisabled"/></td>
        </tr>
        <tr>
          <td><input type="button" value="+"  @click="$store.commit('addtab3')" /></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
        </tr>
        </tbody>
      </table>
    </div>
    <!--page4-->
    <div  class="tab">
      <div class="all" style="overflow:hidden">
        <div class="form-group">
          <label class="control-label">最高权力机构:</label>
          <input type="text" class="form-control" v-model="$store.state.tab1.cu_highestauthority" />
        </div>
        <div class="form-group">
          <label class="control-label">员工人数:</label>
          <input type="text" class="form-control"
                 v-model="$store.state.tab1.cu_employeesnum"/>
        </div>
      </div>
      <div class="all">
        <div class="form-group1">
          <label class="control-label">部门设置概况:</label>
          <textarea class="form-control" rows="10" placeholder="限500字符" v-model="$store.state.tab1.cu_departsituation"
                    maxlength="500">
                            </textarea>
        </div>
      </div>
      <div style="overflow-x: auto">
        <table class="table table-striped">
          <thead>
          <tr>
            <th>序号</th>
            <th>变更科目</th>
            <th>变更时间</th>
            <th>变更前内容</th>
            <th>变更后内容</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(change,index) in $store.state.changeInstruction">
            <td style="width:70px" v-text="index+1"></td>
            <td v-text="change.cd_type"></td>
            <td>
              <el-date-picker
                required
                v-model="change.cs_date"
                type="date"
                placeholder="选择日期">
              </el-date-picker>
            </td>
            <td><input type="text" v-model="change.cs_before"/></td>
            <td><input type="text" v-model="change.cs_after"/></td>
          </tr>
          </tbody>
        </table>
      </div>
      <!--管理层背景-->
      <div style="overflow-x: auto">
        <button class="toggle" @click="$store.commit('changeShow',{index:0})"><h5>管理层背景</h5></button>
        <table class="table table-striped" style="display: none" v-show="$store.state.show[0].isshow">
          <thead>
          <tr>
            <th style="width:50px">序号</th>
            <th>姓名</th>
            <th>性别</th>
            <th>证件类型</th>
            <th>证件号码</th>
            <th>学历</th>
            <th>职务</th>
            <th style="width:70px">担任该职务时间</th>
            <th style="width:70px">从事本行业年限</th>
            <th>住所</th>
            <th>工作简介</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(item,index) in $store.state.tab4">
            <td v-text="index+1"></td>
            <td><input type="text" v-model="item.ce_name" :readonly="item.isDisabled"  /></td>
            <td>
              <select v-model="item.ce_sex"  :readonly="item.isDisabled">
                <option>男</option>
                <option>女</option>
              </select>
            </td>
            <td><input type="text" v-model="item.ce_paperstype"  :readonly="item.isDisabled"/></td>
            <td><input type="text" v-model="item.ce_paperscode"  :readonly="item.isDisabled"/></td>
            <td><input type="text" v-model="item.ce_education"  :readonly="item.isDisabled"/></td>
            <td><input type="text" v-model="item.ce_position"  :readonly="item.isDisabled"/></td>
            <td style="width:70px">
              <el-date-picker
                required
                v-model="item.ce_stwkfpo"
                type="date"
                placeholder="选择日期"
                :readonly="item.isDisabled"
              >
              </el-date-picker>
            </td>
            <td style="width:70px"><input type="number" v-model="item.ce_workeyears"  :readonly="item.isDisabled"/></td>
            <td><input type="text" v-model="item.ce_nowaddress"  :readonly="item.isDisabled"/></td>
            <td><input type="text" v-model="item.ce_woekexper" @click="infoTab($store.state.tab4[index])"  :readonly="item.isDisabled"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab4')"></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
        <el-dialog
          title="请填写工作简介信息"
          :visible.sync="dialogVisible"
          width="30%">
          <textarea id="info-textarea" v-model="woekexper_modal"></textarea>
          <span slot="footer" class="dialog-footer">
                            <el-button @click="dialogVisible = false">取 消</el-button>
                            <el-button type="primary" @click="subTab">确 定</el-button>
                        </span>
        </el-dialog>
      </div>
    </div>
    <!--page5-->
    <div class="tab">
      <div class="all">
        <div class="form-group1">
          <label class="control-label">经营状况简述:</label>
          <textarea v-model='$store.state.condition.bc_bcremark' class="form-control" rows="10" placeholder="限500字符"
                    maxlength="500">
          </textarea>
        </div>
      </div>
      <!--上年度和今年经营状况-->
      <div style="overflow-x: auto">
        <button class="toggle" @click="$store.commit('changeShow',{index:1})"><h5>经营情况</h5></button>
        <table class="table table-striped" v-show="$store.state.show[1].isshow">
          <thead>
          <tr>
            <th style="width:70px">序号</th>
            <th>产品/服务种类</th>
            <th>去年营业收入(元)</th>
            <th>去年营业收入占比(%)</th>
            <th>今年营业收入(元)</th>
            <th>今年营业收入占比(%)</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(item,index) in $store.state.tab5">
            <td v-text="index+1" style="padding:10px 20px"></td>
            <td><input type="text" v-model="item.pm_kind"></td>
            <td><input type="number" min="0" v-model="item.pm_tannualrevenue"/></td>
            <td><input type="number" min="0" v-model="item.pm_tratio"/></td>
            <td><input type="number" min="0" v-model="item.pm_annualrevenue"/></td>
            <td><input type="number" min="0" v-model="item.pm_ratio"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab5')"></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
      </div>
    </div>
    <!--page6-->
    <div class="tab">
      <div class="all">
        <div class="form-group1">
          <label  class="control-label">贸易流程简述:</label>
          <textarea class="form-control" v-model="$store.state.condition.bc_sweaterprocess" rows="10"
                    placeholder="限500字符" maxlength="500">
                            </textarea>
        </div>
      </div>
      <!--前五大供应商-->
      <div>
        <button class="toggle" style="width:100px"><h5>前五大供应商</h5></button>
        <table class="table table-striped">
          <thead>
          <tr>
            <th>序号</th>
            <th>名称</th>
            <th>产品</th>
            <th>上年交易额(元)</th>
            <th>今年交易额(元)</th>
            <th>结账方式及账期</th>
            <th>合作年限</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(item,index) in $store.state.tab6">
            <td v-text="index+1" style="width:70px"></td>
            <td><input type="text" v-model="item.udc_name"/></td>
            <td><input type="text" v-model="item.udc_product"/></td>
            <td><input type="number" v-model="item.udc_lastyear"/></td>
            <td><input type="number" v-model="item.udc_thisyear"/></td>
            <td><input type="text" v-model="item.udc_payment"/></td>
            <td><input type="number" v-model="item.udc_cooperationyears"/></td>
          </tr>
          </tbody>
        </table>
        <!--前五大客户-->
        <div>
          <button class="toggle" style="width:100px"><h5>前五大客户</h5></button>
          <table class="table table-striped">
            <thead>
            <tr>
              <th>序号</th>
              <th>名称</th>
              <th>产品</th>
              <th>上年交易额(元)</th>
              <th>今年交易额(元)</th>
              <th>结账方式及日期</th>
              <th>合作年限</th>
            </tr>
            </thead>
            <tbody>
            <tr v-for="(item,index) in $store.state.tab6_2">
              <td v-text="index+1" style="width:70px"></td>
              <td><input type="text" v-model="item.udc_name"/></td>
              <td><input type="text" v-model="item.udc_product"/></td>
              <td><input type="number" v-model="item.udc_lastyear"/></td>
              <td><input type="number" v-model="item.udc_thisyear"/></td>
              <td><input type="text" v-model="item.udc_payment"/></td>
              <td><input type="text" v-model="item.udc_cooperationyears"/></td>
            </tr>
            </tbody>
          </table>
        </div>
      </div>
    </div>
    <!--page7-->
    <div class="tab"  id="tab7">
      <!--应收账款明细-->
      <div>
        <button class="toggle" style="width:100px" @click="$store.commit('changeShow',{index:2})"><h5>应收账目详情</h5></button>
        <table class="table table-striped" v-show="$store.state.show[2].isshow">
          <thead>
          <tr>
            <th width="70px">序号</th>
            <th>买方客户名称</th>
            <th>金额(元)</th><!--实际是UAS的余额-->
            <th>占比(%)</th>
            <th>账龄(月)</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(li, index) in $store.state.tab7">
            <td v-text="index + 1"></td>
            <td><input type="text" v-model="li.ai_cuname"></td>
            <td><input type="number" v-model="li.ai_leftamount"/></td>
            <td><input type="number" v-model="li.ai_rate"/></td>
            <td><input type="text" v-model="li.ai_payment"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab7')"/></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
      </div>
      <div>
        <span>截止至</span><input type="number" v-model="$store.state.financecondition.year"/><span>年</span><input
        type="number" v-model="$store.state.financecondition.month"/><span>月末应收账款余额</span>
        <input type="number" style="width: 150px" v-model="$store.state.financecondition.fc_arbalance"><span>元</span>
      </div>
      <div>
        <table class="table table-striped">
          <tbody>
          <tr>
            <td>账龄&gt;=3个月以内的(元)</td>
            <td><input type="number" style="width:100%" v-model="$store.state.financecondition.fc_agingamount1"/>
            </td>
            <td>3个月&gt;账龄&gt;=6个月以内的(元)
            </td>
            <td><input type="number" v-model="$store.state.financecondition.fc_agingamount2"/></td>
          </tr>
          <tr>
            <td>6个月&gt;账龄&gt;=12个月以内的(元)
            </td>
            <td><input type="number" v-model="$store.state.financecondition.fc_agingamount4"/></td>
            <td>账龄&lt;=12个月以上的(元)</td>
            <td><input type="number" v-model="$store.state.financecondition.fc_agingamount3"/></td>
          </tr>
          </tbody>
        </table>
      </div>
      <!--其他应收账款-->
      <div>
        <button class="toggle" style="width:100px" @click="$store.commit('changeShow',{index:4})"><h5>其他应收账款</h5></button>
        <table class="table table-striped" v-show="$store.state.show[4].isshow">
          <thead>
          <tr>
            <th width="70px">序号</th>
            <th>名称</th>
            <th>占比(%)</th>
            <th>账龄(月)</th>
            <th>产生原因</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(li, index) in $store.state.tab8">
            <td v-text="index + 1"></td>
            <td><input type="text" v-model="li.ai_cuname"></td>
            <td><input type="number" v-model="li.ai_rate"/></td>
            <td><input type="text" v-model="li.ai_payment"/></td>
            <td><input type="text" v-model="li.ai_remark"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab8')"/></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
      </div>
      <!--预付账款-->
      <div>
        <button class="toggle" style="width:100px" @click="$store.commit('changeShow',{index:5})"><h5>预付账款</h5></button>
        <table class="table table-striped" v-show="$store.state.show[5].isshow">
          <thead>
          <tr>
            <th width="70px">序号</th>
            <th>名称</th>
            <th>余额(元)</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(li, index) in $store.state.tab9">
            <td v-text="index + 1"></td>
            <td><input type="text" v-model="li.ai_cuname"/></td>
            <td><input type="number" v-model="li.ai_leftamount"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab9')"/></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
      </div>
      <!--固定资产-->
      <div>
        <button class="toggle" style="width:100px" @click="$store.commit('changeShow',{index:6})"><h5>固定资产</h5></button>
        <table class="table table-striped" v-show="$store.state.show[6].isshow">
          <thead>
          <tr>
            <th width="70px">序号</th>
            <th>项目名称</th>
            <th>金额(元)</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(li, index) in $store.state.tab10">
            <td v-text="index + 1"></td>
            <td><input type="text" v-model="li.ai_caname"/></td>
            <td><input type="number" v-model="li.ai_amount"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab10')"/></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
      </div>
      <!--存货-->
      <div>
        <button class="toggle" @click="$store.commit('changeShow',{index:7})"><h5>存货</h5></button>
        <table class="table table-striped" v-show="$store.state.show[7].isshow">
          <thead>
          <tr>
            <th width="70px">序号</th>
            <th>项目名称</th>
            <th>金额(元)</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(li, index) in $store.state.tab11">
            <td v-text="index + 1"></td>
            <td><input type="text" v-model="li.ai_caname"/></td>
            <td><input type="number" v-model="li.ai_amount"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab11')"/></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
      </div>
    </div>
    <!--page8-->
    <div class="tab">
      <!--短期借款-->
      <div>
        <button class="toggle" @click="$store.commit('changeShow',{index:8})"><h5>短期借款</h5></button>
        <table class="table table-striped" v-show="$store.state.show[8].isshow">
          <thead>
          <tr>
            <th style="width:70px">序号</th>
            <th>机构名称</th>
            <th>金额(元)</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(li, index) in $store.state.tab12">
            <td v-text="index + 1"></td>
            <td><input type="text" v-model="li.ai_bank"/></td>
            <td><input type="number" v-model="li.ai_leftamount"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab12')"/></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
      </div>
      <!--应付账款-->
      <div>
        <button class="toggle" @click="$store.commit('changeShow',{index:9})"><h5>应付账款</h5></button>
        <table class="table table-striped" v-show="$store.state.show[9].isshow">
          <thead>
          <tr>
            <th style="width:70px">序号</th>
            <th>卖方名称</th>
            <th>金额(元)</th><!--对应UAS余额-->
            <th>占比(%)</th>
            <th>账龄(月)</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(li, index) in $store.state.tab13">
            <td v-text="index + 1"></td>
            <td><input type="text" v-model="li.ai_cuname"></td>
            <td><input type="number" v-model="li.ai_leftamount"/></td>
            <td><input type="number" v-model="li.ai_rate"/></td>
            <td><input type="text" v-model="li.ai_payment"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab13')"/></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
      </div>
      <!--其他应付账款-->
      <div>
        <button class="toggle" style="width: 120px" @click="$store.commit('changeShow',{index:10})"><h5>其他应付账款</h5></button>
        <table class="table table-striped" v-show="$store.state.show[10].isshow">
          <thead>
          <tr>
            <th style="width:70px">序号</th>
            <th>卖方名称</th>
            <th>余额(元)</th><!--其他应付余额对应UAS金额-->
            <th>占比(%)</th>
            <th>产生原因</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(li, index) in $store.state.tab14">
            <td v-text="index + 1"></td>
            <td><input type="text" v-model="li.ai_cuname"></td>
            <td><input type="number" v-model="li.ai_amount"/></td>
            <td><input type="number" v-model="li.ai_rate"/></td>
            <td><input type="text" v-model="li.ai_remark"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab14')"/></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
      </div>
      <!--说明-->
      <div class="all">
        <!-- <div class="form-group1">-->
        <label class="control-label">说明:</label>
        <textarea class="form-control" rows="10" placeholder="限500字符" maxlength="500"
                  v-model="$store.state.financecondition.fc_apremark">
                            </textarea>
        <!--</div>-->
      </div>
      </br>
      <!--长期借款-->
      <div>
        <button class="toggle" @click="$store.commit('changeShow',{index:11})"><h5>长期借款</h5></button>
        <table class="table table-striped" v-show="$store.state.show[11].isshow">
          <thead>
          <tr>
            <th style="width:70px">序号</th>
            <th>机构名称</th><!--对应UAS项目名称-->
            <th>余额(元)</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(li,index) in $store.state.tab15">
            <td v-text="index+1"></td>
            <td><input type="text" v-model="li.ai_caname"/></td>
            <td><input type="number" v-model="li.ai_leftamount"/></td>
          </tr>
          <tr>
            <td><input type="button" value="+" @click="$store.commit('addtab15')"/></td>
            <td></td>
            <td></td>
          </tr>
          </tbody>
        </table>
      </div>
    </div>
    <!--买方客户列表-->
    <div class="tab">
      <button class="toggle" style="width:100px" @click="$store.commit('changeShow',{index:12})"><h5>买方客户信息</h5></button>
      <table class="table table-striped" v-show="$store.state.show[12].isshow">
        <thead>
        <tr>
          <th style="width: 70px">序号</th>
          <th>买方客户名称</th>
        </tr>
        </thead>
        <tbody>
        <tr v-for="(item,index) in $store.state.mfmodal"  @click="$store.commit('infoMfmodal',index)">
          <td v-text="index+1"></td>
          <td v-text="item.mf_custname" data-toggle="modal"
              data-target="#mfdetail" @click="$store.commit('infoMfmodal',index)"></td>
        </tr>
        <tr>
          <td><input type="button" value="+" @click="$store.commit('addMfmodal')" data-target="#mfdetail"
                     data-toggle="modal"/></td>
          <td></td>
        </tr>
        </tbody>
      </table>
    </div>
    <!-- 买方附件上传 -->
    <div class="tab">
      <button class="toggle" style="width:100px" @click="$store.commit('changeShow',{index:12})"><h5>客户上传的附件</h5></button>
      <table class="table table-striped" v-show="$store.state.show[12].isshow">
        <thead>
        <tr>
          <th style="width: 70px">序号</th>
          <th width="571">文件类型</th>
          <th width="571">下载文件</th>
        </tr>
        </thead>
        <tbody>
        <tr v-for="(item,index) in filesTypeData" class="files-tab-tr">
          <td v-text="index+1"></td>
          <td>{{item.type}}</td>
          <td>
            <template v-if="item.fileObj">
              <a class="files-tab" :href="fileObj.path" target="_blank" v-if="item.fileObj.length > 0" v-for="fileObj in item.fileObj" :title="fileObj.name">{{fileObj.name}}</a>
              <span v-if="item.fileObj.length == 0">无</span>
            </template>
            <template v-else>
              <span>无</span>
            </template>
          </td>
        </tr>
        </tbody>
      </table>
    </div>
    <modal v-model="$store.state.openmf" title="买方客户资料填写" ref="modal" size="lg">
      <div  v-for="(item,index) in $store.state.mfmodal" v-show="item.show">
        <div class="tab">
          <button class="toggle" style="width:100px"><h5>买方客户信息</h5></button>
          <table class='table table-striped'>
            <tbody>
            <tr>
              <td style="width: 100px">买方名称</td>
              <td colspan="3"><input style="width:100%" type="text"
                                     v-model="item.mf_custname"></td>
            </tr>
            <tr>
              <td>申请额度(元)</td>
              <td colspan="3"><input type="number" v-model="item.mf_credit"/></td>
            </tr>
            <tr>
              <td>法人代表</td>
              <td><input type="text" v-model="item.mf_legrep" /></td>
              <td>注册资本(万元)</td>
              <td><input type="number" v-model="item.mf_regcapital"/></td>
            </tr>
            <tr>
              <td>经营地址</td>
              <td><input type="text" v-model="item.mf_addr"/></td>
              <td>成立时间</td>
              <td>
                <el-date-picker
                  required
                  v-model="item.mf_estabtime"
                  type="date"
                  placeholder="选择日期">
                </el-date-picker>
              </td>
            </tr>
            <tr>
              <td>联系人</td>
              <td><input type="text" v-model="item.mf_contact"></td>
              <td>联系电话</td>
              <td><input type="text" v-model="item.mf_contactnum"/></td>
            </tr>
            <tr>
              <td>传真</td>
              <td><input type="text" v-model="item.mf_fax"/></td>
              <td>电子邮箱</td>
              <td><input type="text" v-model="item.mf_email"/></td>
            </tr>
            <tr>
              <td>结算开户行</td>
              <td><input type="text" v-model="item.mf_balancebank"/></td>
              <td>银行账户</td>
              <td><input type="text" v-model="item.mf_bankaccount"/></td>
            </tr>
            <tr>
              <td>交易产品</td>
              <td><input type="text" v-model="item.mf_tradprod"/></td>
              <td>付款条件</td>
              <td><input type="text" v-model="item.mf_payterm"/></td>
            </tr>
            <tr>
              <td>股东占比(%)</td>
              <td colspan="3"><input type="number" v-model="item.mf_shareholder"/></td>
            </tr>
            <tr>
              <td>经营范围</td>
              <td colspan="3"><input type="text" v-model="item.mf_businsscope"/></td>
            </tr>
            <tr>
              <td>是否与其他保理商合作</td>
              <td>
                <select v-model="item.mf_coopohers" style="width:100%;border；none;">
                  <option value="-1">是</option>
                  <option value="0">否</option>
                </select>
              </td>
              <td>是否在保险公司取得保险额度</td>
              <td>
                <select v-model="item.mf_hasinslimit" style="width:100%;border；none;">
                  <option value="-1">是</option>
                  <option value="0">否</option>
                </select>
              </td>
            </tr>
            </tbody>
          </table>
        </div>
        <!--双方交易情况-->
        <div class="tab">
          <button class="toggle" style="width:150px"><h5>近三年双方交易情况</h5></button>
          <table class="table table-striped">
            <thead>
            <tr>
              <th style="width:70px">序号</th>
              <th style="width:70px">年度</th>
              <th style="width:100px">购买总额(元)</th>
              <th style="width:200px">其他赊账总金额(元)</th>
              <th style="width:200px">折扣金额(元)</th>
              <th style="width:200px">有无逾期付款记录</th>
            </tr>
            </thead>
            <tbody>
            <tr v-for="(item1,index1) in item.mfCustInfoDetailList">
              <td v-text="index1+1"></td>
              <td><input type="number" v-model="item1.mfd_year" /></td>
              <td><input type="number" v-model="item1.mfd_amount"/></td>
              <td><input type="number" v-model="item1.mfd_chargeamount"/></td>
              <td><input type="number" v-model="item1.mfd_discountamount"/></td>
              <td>
                <select>
                  <option>有</option>
                  <option>没有</option>
                </select>
              </td>
            </tr>
            <tr>
              <td><input type="button" value="+" @click="$store.commit('addmfCustInfoDetailList',index)"/>
              </td>
              <td></td>
              <td></td>
              <td></td>
              <td></td>
              <td></td>
            </tr>
            </tbody>
          </table>
        </div>
      </div>

    </modal>
  </div>

  </div>
</template>

<script>
    export default {
      fetch({store}){
        return Promise.all([
          store.dispatch('findcustomer'),
          store.dispatch('findCustomerFiles')
        ])
      },
      data(){
        return{
          dialogVisible:false,
          tabInfo: {},
          woekexper_modal: ''
        }
      },
      computed: {
        files () {
          return this.$store.state.custFiles
        },
        filesTypeData () {
          let fileTypes = [
            {
              type: '保理业务申请书'
            },
            {
              type: '营业执照正副本'
            },
            {
              type: '开户许可证'
            },
            {
              type: '法人代表身份证'
            },
            {
              type: '实际控制人身份证'
            },
            {
              type: '法人代表证明书'
            },
            {
              type: '公司章程'
            },
            {
              type: '实际控制人征信授权书'
            },
            {
              type: '租赁合同/房产证'
            },
            {
              type: '近三个月水电费单据'
            },
            {
              type: '法定代表人和实际控制人简历（Word版）'
            },
            {
              type: '近三年财务报表和近一期月度财报（含资产负债表、损益表、现金流量表）'
            },
            {
              type: '前五大上游企业贸易合同（两份）'
            },
            {
              type: '前五大下游企业贸易合同（两份）'
            },
            {
              type: '近1年税控系统导出的增值税发票清单（Excel版）'
            },
            {
              type: '近一年最大的五份贸易合同'
            },
            {
              type: '税控系统导出近一年全部发票（Excel版）'
            },
            {
              type: '公司人行征信报告及对外担保信息'
            },
            {
              type: '担保人的人行征信报告及对外担保信息'
            },
            {
              type: '上一年度增值税（营业税）、所得税纳税证明'
            },
            {
              type: '企业近1年主要结算银行流水'
            },
            {
              type: '个人近1年主要结算银行流水'
            },
            {
              type: '其他'
            }
          ]
          if (this.files.length) {
            fileTypes.map(item => {
              item.fileObj = []
              this.files.map(custF => {
                if (item.type === custF.type) {
                  item.fileObj.push({
                    path: custF.path,
                    name: custF.name
                  })
                }
              })
            })
          }
          return fileTypes
        }
      },
      methods: {
        //弹出工作简介模态框
        infoTab: function (tab) {
          this.tabInfo = tab
          this.dialogVisible = true
          this.woekexper_modal = this.tabInfo.ce_woekexper
        },
        //保存工作简介
        subTab: function () {
          this.tabInfo.ce_woekexper = this.woekexper_modal
          this.dialogVisible = false
        }
      }
    }
</script>

<style scoped>
  .files-tab {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 570px;
  }
  .files-tab-tr td {
    vertical-align: middle;
  }
</style>