yos_web/src/HDrpManagement/contractManage/components/addContract.vue

<template>
  <div>
    <!-- <p class="normal-title normal-panel" style="line-height:32px;padding-left:16px;border-bottom:1px solid #eeeeee">新建合同</p> -->
    <div>
      <p class="normal-title normal-panel" style="border-bottom:1px solid #cccccc;padding:16px">新建{{$route.query.type == '框架' ? '经销商合作' :$route.query.type == '直销'?'直销客户合作': $route.query.type}}合同</p>
      <div class="container normal-panel" style="padding-bottom:0">
        <!--合作协议-->
        <el-row v-if="$route.query.type == '框架'">
          <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="140px" size="small">
            <el-col :span="24">
              <el-form-item label="合同标题:" prop="title">
                <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="经销商:" prop="enterprisename" >
                <el-popover
                  placement="bottom"
                  trigger="manual"
                  v-model="agentVisible"
                  width="500">
                  <selectAgent type="21" ref="member"   :param="agentListPrams" :radio="true" @onSelect="agentChange" @onCancel="agentVisible = false"></selectAgent>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('agentVisible')" v-model="form.enterprisename" placeholder="请选择合作伙伴"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="业务员:" prop="salername">
                <el-popover
                    placement="bottom"
                    trigger="manual"
                    v-model="salesmanVisible"
                    width="500">
<!--                  <selectAgent type="5" ref="member"   :param="agentListPrams" :radio="true" @onSelect="agentChange" @onCancel="agentVisible = false"></selectAgent>-->
                  <selectSalesman type="1" ref="selectSalesman" :sys_enterpriseid="form.sys_enterpriseid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
<!--            <el-col :span="24">
              <el-form-item label="业务员:" prop="">
                  <el-input disabled type="text" size="small" v-model="form.salername"></el-input>
              </el-form-item>
            </el-col>-->
            <el-col :span="24">
              <el-form-item label="折扣(%):" prop="discountrate"  >
                <el-input  size="small" v-model="form.discountrate" placeholder="请输入0-100%" @change="discountrateChange"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="付款条件:" prop="paytype">
                <el-select v-model="form.paytype" placeholder="请选择">
                  <el-option
                      v-for="item in payTypeData"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="发货日期提醒(天):" prop="reminddays"  >
                <el-input type="text" size="small" v-model="form.reminddays" placeholder="请输入发货日期提醒天数"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同有效期:" prop="begdate">
                <el-input style="display:none" v-model="form.begdate"></el-input>
              <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="签约日期:" prop="signdate">
                <el-date-picker
                  v-model="form.signdate"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同模板:" prop="type">
                <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同描述:" prop="remarks">
                <el-input type="textarea" size="small" v-model="form.remarks" placeholder="请输入描述信息"></el-input>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>

        <!--直销客户-->
        <el-row v-if="$route.query.type == '直销'">
          <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="140px" size="small">
            <el-col :span="24">
              <el-form-item label="合同标题:" prop="title">
                <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="客户:" prop="enterprisename">
                <el-popover
                    placement="bottom"
                    trigger="manual"
                    v-model="agentVisible"
                    width="500">
                  <selectAgent type="18" ref="member" :param="agentListPrams"  :radio="true" @onSelect="agentChange" @onCancel="agentVisible = false"></selectAgent>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('agentVisible')" v-model="form.enterprisename" placeholder="请选择客户"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
<!--            <el-col :span="24">
              <el-form-item label="项目名称:" prop="projectname">
                <el-popover
                    placement="bottom"
                    trigger="manual"
                    v-model="projectVisible"
                    width="600">
                  <seleteProject ref="project" type="2" :sys_enterpriseid='form.sys_enterpriseid' @onSelect="projectChange" @onCanel="projectVisible=false"></seleteProject>
                  <el-input readonly type="text" slot="reference" size="small" v-model="form.projectname" @focus="showChange('projectVisible')" placeholder="请选择项目"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>-->
<!--            <el-col :span="24">
              <el-form-item label="项目编号:" prop="">
                <el-input disabled type="text" size="small" v-model="form.projectnum" placeholder="请选择项目"></el-input>
              </el-form-item>
            </el-col>-->
            <el-col :span="24">
              <el-form-item label="业务员:" prop="salername">
                <el-popover
                    placement="bottom"
                    trigger="manual"
                    v-model="salesmanVisible"
                    width="500">
                  <selectSalesman type="2" ref="selectSalesman" :sa_projectid="form.sa_projectid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员" disabled></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="折扣(%):" prop="discountrate"  >
                <el-input  size="small" v-model="form.discountrate" placeholder="请输入0-100%" @change="discountrateChange"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="付款条件:" prop="paytype">
                <el-select v-model="form.paytype" placeholder="请选择">
                  <el-option
                      v-for="item in payTypeData"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="发货日期提醒(天):" prop="reminddays"  >
                <el-input type="text" size="small" v-model="form.reminddays" placeholder="请输入发货日期提醒天数"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同有效期:" prop="begdate">
                <input type="text" style="display:none" v-model="form.begdate">
                <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="签约日期:" prop="signdate">
                <el-date-picker
                    v-model="form.signdate"
                    type="date"
                    value-format="yyyy-MM-dd"
                    placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
<!--            <el-col :span="24">
              <el-form-item label="签约金额(元):" prop="signamount">
                <el-input type="text" size="small" placeholder="系统自动计算" disabled v-model="form.signamount"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同模板:" prop="type">
                <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
              </el-form-item>
            </el-col>-->
            <el-col :span="24">
              <el-form-item label="合同描述:" prop="hrid">
                <el-input type="textarea" size="small" v-model="form.remarks" placeholder="请输入描述信息"></el-input>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>

        <!--经销项目-->
        <el-row v-if="$route.query.type == '经销项目'">
          <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="140px" size="small">
            <el-col :span="24">
              <el-form-item label="合同标题:" prop="title">
                <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="经销商:" prop="enterprisename">
                <el-popover
                  placement="bottom"
                  trigger="manual"
                  v-model="agentVisible"
                  width="500">
                  <selectAgent type="21" ref="member" :param="agentListPrams"  :radio="true" @onSelect="agentChange" @onCancel="agentVisible = false"></selectAgent>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('agentVisible')" v-model="form.enterprisename" placeholder="请选择合作伙伴"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="项目名称:" prop="projectname">
                <el-popover
                  placement="bottom"
                  trigger="manual"
                  v-model="projectVisible"
                  width="600">
                  <seleteProject ref="project" type="2" :sys_enterpriseid='form.sys_enterpriseid' @onSelect="projectChange" @onCanel="projectVisible=false"></seleteProject>
                  <el-input readonly type="text" slot="reference" size="small" v-model="form.projectname" @focus="showChange('projectVisible')" placeholder="请选择项目"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="项目编号:" prop="">
                <el-input disabled type="text" size="small" v-model="form.projectnum" placeholder="请选择项目"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="业务员:" prop="salername">
                <el-popover
                    placement="bottom"
                    trigger="manual"
                    v-model="salesmanVisible"
                    width="500">
                  <selectSalesman type="2" ref="selectSalesman" :sa_projectid="form.sa_projectid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="折扣(%):" prop="discountrate"  >
                <el-input  size="small" v-model="form.discountrate" placeholder="请输入0-100%" @change="discountrateChange"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="付款条件:" prop="paytype">
                <el-select v-model="form.paytype" placeholder="请选择">
                  <el-option
                      v-for="item in payTypeData"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="发货日期提醒(天):" prop="reminddays"  >
                <el-input type="text" size="small" v-model="form.reminddays" placeholder="请输入发货日期提醒天数"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同有效期:" prop="begdate">
                <input type="text" style="display:none" v-model="form.begdate">
              <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="签约日期:" prop="signdate">
                <el-date-picker
                  v-model="form.signdate"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="签约金额(元):" prop="signamount">
                <el-input type="text" size="small" placeholder="系统自动计算" disabled v-model="form.signamount"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同模板:" prop="type">
                <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同描述:" prop="hrid">
                <el-input type="textarea" size="small" v-model="form.remarks" placeholder="请输入描述信息"></el-input>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
        <!--直销项目-->
        <el-row v-if="$route.query.type == '直销项目'">
          <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="140px" size="small">
            <el-col :span="24">
              <el-form-item label="合同标题:" prop="title">
                <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="客户" prop="sys_enterpriseid">
                <el-popover
                  placement="bottom"
                  trigger="manual"
                  v-model="accountVisible"
                  width="500">
                  <selectAgent type="18" ref="member"  :param="agentListPrams" :radio="true" @onSelect="accountChange" @onCancel="accountVisible = false"></selectAgent>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('accountVisible')" v-model="form.enterprisename" placeholder="请选择客户"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="项目:" prop="projectname">
                <el-popover
                  placement="bottom"
                  trigger="manual"
                  v-model="projectVisible"
                  width="600">
                  <seleteProject ref="project" type="1" @onSelect="projectChange" @onCanel="projectVisible=false"></seleteProject>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('projectVisible')" v-model="form.projectname" placeholder="请选择项目"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="项目地址:" prop="address">
                <el-input disabled type="text" size="small" v-model="address" placeholder="请选择项目地址"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="业务员:" prop="salername">
                <el-popover
                    placement="bottom"
                    trigger="manual"
                    v-model="salesmanVisible"
                    width="500">
                  <selectSalesman type="2" ref="selectSalesman" :sa_projectid="form.sa_projectid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="折扣(%):" prop="discountrate"  >
                <el-input  size="small" v-model="form.discountrate" placeholder="请输入0-100%" @change="discountrateChange"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="付款条件:" prop="paytype">
                <el-select v-model="form.paytype" placeholder="请选择">
                  <el-option
                      v-for="item in payTypeData"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="发货日期提醒(天):" prop="reminddays"  >
                <el-input type="text" size="small" v-model="form.reminddays" placeholder="请输入发货日期提醒天数"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="收货人:" prop="receiptName">
                <el-popover
                    placement="bottom"
                    trigger="manual"
                    v-model="receiptVisible"
                    width="600">
                  <seleteReceipt ref="receipt" type="1" @onSelect="receiptChange" @onCanel="receiptVisible = false"></seleteReceipt>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('receiptVisible')" v-model="form.receiptName"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="收货人电话:" prop="phonenumber">
                <el-input disabled type="text" size="small" v-model="form.phonenumber"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同有效期:" prop="begdate">
                <input type="text" style="display:none" v-model="form.begdate">
              <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="签约日期:" prop="signdate">
                <el-date-picker
                  v-model="form.signdate"
                  value-format="yyyy-MM-dd"
                  type="date"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="签约金额(元):" prop="signamount">
                <el-input type="text" placeholder="系统自动计算" disabled size="small" v-model="form.signamount"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同模板:" prop="type">
                <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同描述:" prop="hrid">
                <el-input type="textarea" size="small" v-model="form.remarks" placeholder="请输入描述信息"></el-input>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
        <!--工具使用协议-->
        <el-row v-if="$route.query.type == '工具借用'">
          <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="140px" size="small">
            <el-col :span="24">
              <el-form-item label="合同标题:" prop="title">
                <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="企业" prop="enterprisename">
                <el-popover
                  placement="bottom"
                  trigger="manual"
                  v-model="accountVisible"
                  width="600">

                   <el-tabs v-model="activeName" @tab-click="tabClick">
                    <el-tab-pane label="客户" name="客户">
                      <selectAgent ref="member" type="19"  :param="agentListPrams" :radio="true" @onSelect="accountChange" @onCancel="accountVisible = false"></selectAgent>
                    </el-tab-pane>
                    <el-tab-pane label="合作伙伴" name="合作伙伴">
                      <selectAgent ref="member" type="20"  :param="agentListPrams" :radio="true" @onSelect="accountChange" @onCancel="accountVisible = false"></selectAgent>
                    </el-tab-pane>
                  </el-tabs>
<!--                  <selectAgent ref="member" type="10"  :param="agentListPrams" :radio="true" @onSelect="accountChange" @onCancel="accountVisible = false"></selectAgent>-->
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('accountVisible')" v-model="form.enterprisename" placeholder="请选择企业"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="业务员:" prop="salername">
                <el-popover
                    placement="bottom"
                    trigger="manual"
                    v-model="salesmanVisible"
                    width="500">
                  <selectSalesman type="1" ref="selectSalesman" :sys_enterpriseid="form.sys_enterpriseid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同有效期:" prop="begdate">
                <input type="text" style="display:none" v-model="form.begdate">
              <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="签约日期:" prop="signdate">
                <el-date-picker
                  v-model="form.signdate"
                  value-format="yyyy-MM-dd"
                  type="date"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="单套价格(元)" prop="signamount">
                <el-input type="text" disabled size="small" placeholder="系统自动计算" v-model="form.signamount"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同模板:" prop="type">
                <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同描述:" prop="hrid">
                <el-input type="textarea" size="small" v-model="form.remarks" placeholder="请输入描述信息"></el-input>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
        <!--居间协议-->
        <el-row v-if="$route.query.type == '居间'">
          <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="135px" size="small">
            <el-col :span="24">
              <el-form-item label="合同标题:" prop="title">
                <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="居间商:" :rules="{ required: false, message: '请选择居间商', trigger: 'change' }">
                <el-popover
                  placement="bottom"
                  trigger="manual"
                  v-model="agentVisible"
                  width="500">

                  <selectAgent ref="member" type="21" :param="agentListPrams" :radio="true" @onSelect="centerChange" @onCancel="agentVisible = false"></selectAgent>

                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('agentVisible')" v-model="form.enterprisename" placeholder="请选择居间商"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同:" prop="ascription_title">
                <el-popover
                  placement="bottom"
                  trigger="manual"
                  v-model="contractVisible"
                  width="600">
                  <selectContract   ref="contractRef" @onSelect="concratChange" @onCanel="contractVisible=false" ></selectContract>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('contractVisible')" v-model="form.ascription_title" placeholder="请选择合同"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="项目名称:" prop="projectnum">
                <el-input disabled type="text" size="small" v-model="form.projectname" placeholder="请选择项目"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="项目编号:" prop="projectnum">
                <el-input disabled type="text" size="small" v-model="form.projectnum" placeholder="项目编号"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="客户名称:" :rules="{ required: false, message: '请选择客户', trigger: 'change,blur' }">
                <el-input disabled type="text" size="small" v-model="form.customername" placeholder="客户名称"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="业务员:" prop="salername">
                <el-popover
                    placement="bottom"
                    trigger="manual"
                    v-model="salesmanVisible"
                    width="500">
                  <selectSalesman type="2" ref="selectSalesman" :sa_projectid="form.sa_projectid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
                  <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="签约日期:" prop="signdate">
                <el-date-picker
                    v-model="form.signdate"
                    value-format="yyyy-MM-dd"
                    type="date"
                    placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="计算方式" prop="calculatemodel">
                <el-radio-group v-model="form.calculatemodel">
                  <el-radio label="1">按订单金额比例计算</el-radio>
                  <el-radio label="2">按居间产品折扣计算</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="form.calculatemodel==1">
              <el-form-item label="订单金额比例(%):" prop="orderratio" >
                <el-input  size="small" v-model="form.orderratio"  placeholder="请输入0-100%" @change="orderratioChange"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="form.calculatemodel==2">
              <el-form-item label="居间产品折扣(%):" :rules="{ required: false, message: '请填写折扣', trigger: 'blur' }">
                <el-input size="small" v-model="form.productdiscount" placeholder="请输入0-100%" @change="productdiscountChange"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同有效期:" prop="begdate">
                <input type="text" style="display:none" v-model="form.begdate">
              <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
              </el-form-item>
            </el-col>

            <el-col :span="24">
              <el-form-item label="合同模板:" prop="type">
                <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="合同描述:" prop="hrid">
                <el-input type="textarea" size="small" v-model="form.remarks" placeholder="请输入描述信息"></el-input>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
      </div>
    </div>
    <div class="fixed__btn__panel">
      <el-button size="small" @click="onCancel" class="normal-btn-width">取 消</el-button>
      <el-button size="small" type="primary" @click="onSubmit" :loading="loading" class="normal-btn-width">确 定</el-button>
    </div>
  </div>
</template>

<script>
import {mapGetters} from 'vuex'
import selectPople from './selectSaler'
import selectAgent from './selectAgent.vue'
import seleteProject from './seleteProject'
import seleteProjectContract from './seleteProjectContract'
import selectContract from "@/HDrpManagement/contractManage/components/selectContract";
import TimeSelect from './TimeSelect'
import selectModel from './seleteModel'
import seleteReceipt from './seleteReceipt'
import selectSalesman from './selectSalesman'
export default {
  name: '',
  components:{selectPople,TimeSelect,seleteProject,selectAgent,selectModel,seleteProjectContract,seleteReceipt,selectSalesman,selectContract},
  data () {
    var checkNumber = (rule, value, callback) => {
      if (typeof +value != 'number') {
        return callback(new Error('请填写数字'));
      }
      callback()
    }
    var NumberSize = (rule, value, callback) => {
      if (isNaN(parseFloat(value)) && value !== ''){
        return callback(new Error('输入不合法，请输入数值'))
      }else if (+value > 100 || +value < 0 ) {
        return callback(new Error('折扣范围(0-100%)'));
      }
      callback()
    }
    var checkTimer = (rule, value, callback) => {
      if (new Date(this.form.enddate).getTime() > new Date(value).getTime() && new Date(this.form.begdate).getTime() < new Date(value).getTime()) {
        callback()
      } {
        return callback(new Error('签约日期必须在合同有效期内'));
      }
    }
    var discountrate = (rule,value,callback) =>{
      if (this.form.discountrate < 0 || this.form.discountrate > 100){
        callback(new Error('请输入0-100%'))
      } else {
        callback();
      }
    }
    return {
      activeName: '客户',
      agentVisible:false,
      salerVisible:false,
      projectVisible:false,
      accountVisible:false,
      modelVisible:false,
      contractVisible:false,
      receiptVisible:false,
      salesmanVisible:false,
      modelList:[],
      /* 新建居间项目时 所关联的居间商 */
      centerEnterpriseList:[],
      payTypeData:[],
      address:'',
      form: {
        "sa_contractid": 0,
        "sys_enterpriseid": "",
        "projectname":'',
        "projectnum":'',
        "begdate": "",
        "enddate": "",
        "sa_projectid": "", //可选
        "type": "", //可选
        "discountrate": '', //可选
        /*"saler_hrid": JSON.parse(window.sessionStorage.getItem('active_account')).hrid, //可选*/
        "saler_hrid":'',
        "signdate": "", //可选
        "signby": "", //可选
        "remarks": "", //可选
        "title": "",
        "signamount":'',
        /*"salername":JSON.parse(window.sessionStorage.getItem('active_account')).name,*/
        "salername":'',
        "enterprisename":'',
        "sys_printmodelid": '',//可选
        "typemx":"",//可选
        "modelname":"",
        "calculatemodel":'1',
        "productdiscount":'',
        "orderratio":'',
        "ascription_title":'',
        'ascription_contractid':'',
        'receiptName':'',
        "rec_contactsid":'',//收货联系人
        'phonenumber':'',
        'paytype':'',
        'reminddays':'',
        'customername':'',
        'customerid':''
      },
      rules: {
        title: [
          { required: true, message: '请填写标题', trigger: 'blur' },
        ],
        sys_enterpriseid: [
          { required: true, message: '请选择客户', trigger: 'change' },
        ],
        ascription_title: [
          { required: true, message: '请选择项目合同', trigger: 'change' },
        ],
        begdate: [
          { required: true, message: '请选择生效日期', trigger: 'blur' },
        ],
        projectname: [
          { required: true, message: '请选择项目', trigger: 'change' },
        ],
        receiptName: [
          { required: true, message: '请选择收货人', trigger: 'change' },
        ],
        salername: [
          { required: true, message: '请选择业务员', trigger: 'change' },
        ],
        enterprisename: [
          { required: true, message: '请选择合作伙伴', trigger: 'change' },
        ],
        signdate: [
          { required: true, message: '请填写签约时间', trigger: 'change' },
        ],
        paytype: [
          { required: true, message: '请选择付款条件', trigger: 'change' },
        ],
        reminddays: [
          { required: true, message: '请设置发货日期提醒天数', trigger: 'blur' },
        ],
        productdiscount: [
        /*  { message: '必须为数字', type:'number', trigger: 'change' },*/
          { pattern:/^[0-9]+\.{0,1}[0-9]{0,4}$/,message: '输入不合法，请输入数值',trigger: 'change,blur'},
          { required: true, message: '请填写折扣', trigger: 'blur' },
       /*   { validator: checkNumber, trigger: 'blur'},*/
          { validator: NumberSize, trigger: 'blur'}
        ],
        orderratio: [
         /* { message: '必须为数字', type:'number', trigger: 'change' },*/
          { pattern:/^[0-9]+\.{0,1}[0-9]{0,4}$/,message: '输入不合法，请输入数值',trigger: 'change,blur'},
          { required: true, message: '请填写折扣', trigger: 'blur' },
        /*  { validator: checkNumber, trigger: 'blur'},*/
          { validator: NumberSize, trigger: 'blur'}
        ],
        salername: [
          { required: true, message: '请选择合作伙伴', trigger: 'change' },
        ],
        discountrate: [
         /* { validator: checkNumber, trigger: 'blur'},*/
          { pattern:/^[0-9]+\.{0,1}[0-9]{0,4}$/,message: '输入不合法，请输入数值',trigger: 'change'},
          { validator: NumberSize, trigger: 'blur'}
        ],
      },
      salerListParams: {
        "id": 20221122153902,
        "content": {
            "pageNumber": 1,
            "pageSize": 20,
            "where": {
                "condition": ""
            }
        },
      },
      agentListPrams: {
        "id": 20220920083901,
        "content": {
          "pageNumber": 1,
          "pageSize": 20,
          "where": {
            "condition": "",
            "type":5,
            "typemx":"",
          }
        }
      },
      salsemanParam:{
        "id":20230305201202,
        "content":{
          "type":'',//type:1经销商合作协议,2:经销项目协议,直销项目协议,居间协议,3:工具借用协议
          "sys_enterpriseid":'',//type=1或3时传
          "sa_projectid":'' //type=2时传
        }
      }
    };
  },
  computed: {
    ...mapGetters({
      DrawerShow:'DrawerShow',
      loading:'loading'
    })
  },
  watch: {
    'DrawerShow': {
      handler (val) {
        if (!val) {
          this.showChange(false)
          if (this.$refs.form) this.$refs.form.resetFields()
          this.onCancel()
          this.$refs.timeSelect.time = ''


        } else {
          if(this.$refs.member) this.$refs.member.listData(this.$refs.member.param.content.pageNumber = 1)
          if(this.$refs.project) {
            this.$refs.project.params.content.type = this.$route.query.type == '经销项目' ? '2' : '1'
            console.log(this.$refs.project.params.content.type,'项目类型');

            this.$refs.project.queryEnterpriseArchives()
          }
        }

      },
      immediate:true,
    },

  },
  created () {
    this.form = {
      "sa_contractid": 0,
      "sys_enterpriseid": "",
      "projectname":'',
      "projectnum":'',
      "begdate": "",
      "enddate": "",
      "sa_projectid": "", //可选
      "type": "", //可选
      "discountrate": '', //可选
      /*"saler_hrid": JSON.parse(window.sessionStorage.getItem('active_account')).hrid, //可选*/
      "saler_hrid":"",
      "signdate": "", //可选
      "signby": "", //可选
      "remarks": "", //可选
      "title": "",
      "signamount":'',
      /*"salername":JSON.parse(window.sessionStorage.getItem('active_account')).name,*/
      "salername":"",
      "enterprisename":'',
      "sys_printmodelid": '',//可选
      "typemx":"",//可选
      "modelname":"",
      "calculatemodel":'1',
      "productdiscount":'',
      "orderratio":'',
      "ascription_title":'',
      'ascription_contractid':'',
      'receiptName':'',
      "rec_contactsid":'',//收货联系人
      'phonenumber':'',
      'paytype':'',
      'reminddays':'',
      'customername':'',
      'customerid':''
    }
    this.payTypeList()
  },
  methods: {
    async onSubmit () {
      this.$refs.form.validate(async val => {
        if (!val) return false
        console.log(this.form,'form')
        if (val) {
          this.$store.commit('setLoading',true)
          /* 居间新建 */
          if (this.$route.query.type == '居间' && this.centerEnterpriseList) {
            let is = this.centerEnterpriseList.some(item => item.sys_enterpriseid == this.form.sys_enterpriseid)
            if (is) {
              this.$confirm('该项目商机已存在居间服务商，不可创建','提示',{
                cancelButtonText:'取消',
                showConfirmButton:false
              }).then(() => {
                this.$store.commit('setLoading',false)
              })
            } else {
              if (this.$route.query.type == '直销项目') {
                this.form.type = '项目'
                this.form.typemx = '直销'
              } else if (this.$route.query.type == '经销项目') {
                this.form.type = '项目'
                this.form.typemx = '经销'
              } else {
                this.form.type = this.$route.query.type
              }

              this.form.discountrate ? this.form.discountrate =  (this.form.discountrate / 100).toFixed(4) : ''
              this.form.productdiscount ? this.form.productdiscount =  (this.form.productdiscount / 100).toFixed(4) : ''
              this.form.orderratio ? this.form.orderratio =  (this.form.orderratio / 100).toFixed(4) : ''
              let res = await this.$api.requested({
                "id":20221121185302,
                "content": this.form
              })
              if (res.code == 0){
                this.form.discountrate = this.form.discountrate * 100
                this.form.productdiscount = this.form.productdiscount * 100
                this.form.orderratio = this.form.orderratio * 100
              }
              this.tool.showMessage(res,() => {
                this.$store.commit('setLoading',false)
                this.$store.dispatch('DrawerShowChange',false)
                this.$store.dispatch('changeDetailDrawer',true)
                this.$router.push({path:'/contractDetail',query:{type:this.$route.query.type,id:res.data.sa_contractid,rowindex:res.data.rowindex}})
              })
            }
          } else {
            /* 其它新建 */
            if (this.$route.query.type == '直销项目') {
              this.form.type = '项目'
              this.form.typemx = '直销'
            } else if (this.$route.query.type == '经销项目') {
              this.form.type = '项目'
              this.form.typemx = '经销'
            } else {
              this.form.type = this.$route.query.type
            }
            this.form.discountrate ? this.form.discountrate =  (this.form.discountrate / 100).toFixed(4) : ''
            this.form.productdiscount ? this.form.productdiscount =  (this.form.productdiscount / 100).toFixed(4) : ''
            this.form.orderratio ? this.form.orderratio =  (this.form.orderratio / 100).toFixed(4) : ''
            let res = await this.$api.requested({
              "id":20221121185302,
              "content": this.form
            })
            if (res.code == 0){
              this.form.discountrate = this.form.discountrate * 100
              this.form.productdiscount = this.form.productdiscount * 100
              this.form.orderratio = this.form.orderratio * 100
            }
            this.tool.showMessage(res,() => {

              this.$store.commit('setLoading',false)
              console.log(res.data);
              this.$store.dispatch('DrawerShowChange',false)
              this.$store.dispatch('changeDetailDrawer',true)
              this.$router.push({path:'/contractDetail',query:{type:this.$route.query.type,id:res.data.sa_contractid,rowindex:res.data.rowindex}})
            })
          }

        }
      })
    },
    onCancel () {
      this.$store.dispatch('DrawerShowChange',false)
      this.$refs.form.resetFields()
      this.form = {
        "sa_contractid": 0,
        "sys_enterpriseid": "",
        "projectname":'',
        "projectnum":"",
        "begdate": "",
        "enddate": "",
        "sa_projectid": "", //可选
        "type": "", //可选
        "discountrate": '', //可选
        /*"saler_hrid": JSON.parse(window.sessionStorage.getItem('active_account')).hrid, //可选*/
        "saler_hrid":'',
        "signdate": "", //可选
        "signby": "", //可选
        "remarks": "", //可选
        "title": "",
        "signamount":'',
        /*"salername":JSON.parse(window.sessionStorage.getItem('active_account')).name,*/
        "salername":'',
        "enterprisename":'',
        "sys_printmodelid": '',//可选
        "typemx":"",//可选
        "modelname":"",
        "calculatemodel":'1',
        "productdiscount":'',
        "orderratio":'',
        "ascription_title":'',
        'ascription_contractid':'',
        'receiptName':'',
        "rec_contactsid":'',//收货联系人
        'phonenumber':''
      }
      this.$refs.member.selected = []
      this.$refs.selectSalesman.selected = []
      this.address = ''
      this.agentVisible = false
      this.salerVisible = false
      this.projectVisible = false
      this.accountVisible = false
      this.modelVisible = false
      this.contractVisible = false
      this.receiptVisible = false
      this.salesmanVisible = false

    },
    showChange (key) {
      this.agentVisible = false
      this.salerVisible = false
      this.projectVisible = false
      this.accountVisible = false
      this.modelVisible = false
      this.contractVisible = false
      this.receiptVisible = false
      this.salesmanVisible = false
      if (key === 'projectVisible'){
        if (this.form.sys_enterpriseid !== ''){
          this.$refs.project.params.content.sys_enterpriseid = this.form.sys_enterpriseid
          this.$refs.project.queryEnterpriseArchives()
          key ? this[key] = true : ''
        }else {
          this.$refs.form.validateField("enterprisename")
          this.$refs.form.validateField("sys_enterpriseid")
        }

      }else if (key === 'receiptVisible'){
        if (this.form.sys_enterpriseid !== ''){
          this.$refs.receipt.params.content.sys_enterpriseid = this.form.sys_enterpriseid
          this.$refs.receipt.queryReceipts()
          key ? this[key] = true : ''
        }else {
          this.$refs.form.validateField("enterprisename")
          this.$refs.form.validateField("sys_enterpriseid")
        }
      }else if(key === 'contractVisible'){
        this.$refs.contractRef.queryProject(this.$refs.contractRef.projectParam.content.pageNumber = 1)
        key ? this[key] = true : ''
      }else if(key === 'salesmanVisible'){
        this.$refs.selectSalesman.listData(this.$refs.member.param.content.pageNumber = 1)
        key ? this[key] = true : ''
      }else {
        key ? this[key] = true : ''
      }
      this.$refs.member.listData(this.$refs.member.param.content.pageNumber = 1)
    },
    agentChange (data) {
      this.form.sys_enterpriseid = data[0].sys_enterpriseid
      this.form.enterprisename = data[0].enterprisename
      this.agentVisible = false
      if (this.$route.query.type == '框架'){
        this.salsemanParam.content.type = 1
        this.salsemanParam.content.sys_enterpriseid = this.form.sys_enterpriseid
        this.querySalse()
      }else if (this.$route.query.type == '直销'){
        this.queryCustomerLeader(data[0].sa_customersid)
      }

    },
    async querySalse(){
      if (this.form.customername){
        let param = {
          "id":20230305201202,
          "content":{
            "type":4,
            "sys_enterpriseid":this.form.customerid,
            "sa_projectid":'',
          },
        }
        const res = await this.$api.requested(param)
        console.log("res",res)
        this.form.salername = res.data[0].name
        this.form.saler_hrid = res.data[0].hrid
      }else {
        const res = await this.$api.requested(this.salsemanParam)
        console.log("res",res)
        this.form.salername = res.data[0].name
        this.form.saler_hrid = res.data[0].hrid
      }

    },
    salesmanChange(data){
      console.log(data,"业务员")
      this.form.salername = data[0].name
      this.form.saler_hrid = data[0].hrid
      this.salesmanVisible = false
    },
    salerChange (data) {
      this.form.saler_hrid = data[0].hrid
      this.form.saler_name = data[0].name
      this.salerVisible = false
    },
    projectChange (data) {
      this.form.projectname = data.projectname
      this.form.projectnum = data.projectnum
      this.form.sa_projectid = data.sa_projectid
      this.address = data.province + data.city + data.county + data.address
      this.projectVisible = false
      this.salsemanParam.content.type = 2
      this.salsemanParam.content.sa_projectid = this.form.sa_projectid
      this.querySalse()
    },
    receiptChange (data) {
      this.form.receiptName = data.name
      this.form.phonenumber = data.phonenumber
      this.form.rec_contactsid = data.contactsid
      this.receiptVisible = false
    },
    accountChange (data) {
      this.form.enterprisename = data[0].enterprisename
      this.form.sys_enterpriseid = data[0].sys_enterpriseid
      this.accountVisible = false
      if (this.$route.query.type == '工具借用'){
        this.salsemanParam.content.type = 3
        this.salsemanParam.content.sys_enterpriseid = this.form.sys_enterpriseid
        this.querySalse()
      }

    },
    centerChange (data) {
      this.form.enterprisename = data[0].enterprisename
      this.form.sys_enterpriseid = data[0].sys_enterpriseid
      this.agentVisible = false
    },
    concratChange (data) {
      console.log(data,"输出")
      this.centerEnterpriseList = data.parties
      this.form.ascription_title = data.title
      this.form.ascription_contractid = data.sa_contractid
      this.form.projectname = data.projectname
      this.form.projectnum = data.projectnum
      this.form.sa_projectid = data.sa_projectid
      this.form.customername = data.enterprisename
      this.form.customerid = data.sys_enterpriseid
      this.contractVisible = false
      this.salsemanParam.content.type = 2
      this.salsemanParam.content.sa_projectid = this.form.sa_projectid
      this.querySalse()
    },
    modelChange (data) {
      this.form.modelname = data.modelname
      console.log(this.form.modelname);

      this.form.sys_printmodelid = data.sys_printmodelid
      this.modelVisible = false
    },
    clearTime () {
      this.form.begdate = ''
      this.form.enddate = ''
    },
    timeChange (time) {
      this.form.begdate = time[0]
      this.form.enddate = time[1]
    },
    async getModelList () {
      let res = await this.$api.requested({
        "id": 20221121155801,
        "content": {
          "pageNumber": 1,
            "pageSize": 999999,
            "where":{
            "condition":""
            }
        }
      })
      this.modelList = res.data
      console.log(this.modelList);
    },
    tabClick(){
      console.log(this.activeName)
      if (this.activeName === '客户'){
        this.agentListPrams.content.where.type = '19'
        this.$refs.member.flag = true
        this.$refs.member.listData(this.$refs.member.param.content.pageNumber = 1)
      }else {
        this.agentListPrams.content.where.type = '20'
        this.$refs.member.flag = true
        this.$refs.member.listData(this.$refs.member.param.content.pageNumber = 1)
      }
    },
    /*获取付款条件*/
    async payTypeList(){
      const res = await this.$api.requested({
        id: "20230110100103",
        content: {
          pageNumber: 1,
          pageSize:50,
          where: {condition: ""},
        }
      })
      console.log(res,'res')
      this.payTypeData = res.data.map((item,index)=>{
        /*if (item.point === '订单审核'){
          return {
            label:item.ruleno +  '\xa0  \xa0 \xa0 \xa0' + item.point + '\xa0  \xa0 \xa0 \xa0' + "立账额度" + (item.amountrate * 100) +'% ' + '\xa0  \xa0 \xa0 \xa0' + '后置天数' + item.days + '天',
            value:item.ruleno +  '' + item.point + '' + "立账额度" + (item.amountrate * 100) +'% ' + '' + '后置天数' + item.days + '天',
          }
        }else {
          return {
            label:item.ruleno + '\xa0  \xa0 \xa0 \xa0' + item.point + '\xa0  \xa0 \xa0 \xa0' +  '后置天数' + item.days + '天',
            value:item.ruleno + '' + item.point + '' +  '后置天数' + item.days + '天',
          }
        }*/
        return {
          label:item.ruleno + '-' + item.remarks,
          value:item.ruleno + '-' + item.remarks
        }

      })
     /* res.data.forEach((item,index)=>{
        if (item.point === '订单审核'){
          this.payTypeData[index] = item.ruleno + ' ' + item.point + ' ' + "立账额度" + (item.amountrate * 100) +'% ' + '后置天数' + item.days
        }else {
          this.payTypeData[index] = item.ruleno + ' ' + item.point + ' ' +  '后置天数' + item.days
        }
      })*/
      console.log(this.payTypeData,'处理后数据')
    },
    discountrateChange(){
      let discountrate = parseFloat(this.form.discountrate)
      if (!isNaN(discountrate)){
        this.form.discountrate = Math.round(this.form.discountrate * 100)/100
      }
    },
    orderratioChange(){
      let orderratio = parseFloat(this.form.orderratio)
      if (!isNaN(orderratio)){
        this.form.orderratio =  Math.round(this.form.orderratio * 100)/100
      }
    },
    productdiscountChange(){
      let productdiscount = parseFloat(this.form.productdiscount)
      if (!isNaN(productdiscount)){
        this.form.productdiscount =  Math.round(this.form.productdiscount * 100)/100
      }
    },

    /*获取客户负责人*/
    async queryCustomerLeader(id){
      let param = {
        id:20221012164302,
        content:{
          sa_customersid:id
        }
      }
      const res = await this.$api.requested(param)
      this.form.salername = res.data.leader?res.data.leader[0].hr.name:''
      this.form.saler_hrid = res.data.leader?res.data.leader[0].hr.hrid:''
    }
  },

  mounted() {
    this.payTypeList()
  }
};
</script>

<style scoped>
* {
  box-sizing: border-box;
}
.header_info {
  background: #ffffff;
  padding: 16px 16px 0 16px;
  margin-bottom: 16px;
}
/deep/.el-select,.el-input,.el-date-editor {
  width: 100% !important;
}
</style>