<template>
  <div class="app-container">

    <div class = "search-bx"  >
        <div class="search">
          <el-row :gutter="0">

              <el-input v-model="tableObj.getdataListParm.parammaps.contractCode" placeholder="合同编号" class="filter-item" style="width: 120px" />

              <!-- <el-autocomplete v-model="tableObj.getdataListParm.parammaps.customerName" :fetch-suggestions="customer_search" placeholder="客户名称" style="width: 200px;margin-right:10px" @select="change_customer_select" @clear="clear_customer_select" @blur="customer_search_blur" clearable>
                <template slot-scope="{ item }">
                  <span class="name">{{ item.name }}</span>
                </template>
              </el-autocomplete> -->

              <el-input v-model="tableObj.getdataListParm.parammaps.customerName" placeholder="客户名称" style="width: 180px;" class="filter-item" clearable />

              <el-select v-model="tableObj.getdataListParm.parammaps.groupId" placeholder="集团" class="filter-item" style="width: 120px;" clearable>
                <el-option v-for="item in groupNameList" :key="item.id" :label="item.name" :value="item.id" />
              </el-select>

              <el-select v-model="tableObj.getdataListParm.parammaps.dealerId" placeholder="经销商" class="filter-item" style="width: 190px;padding-bottom:10px;" clearable filterable>
                <el-option v-for="(item,index) in dealNameList" :key="index" :label="item.dealerName" :value="item.dealerId" />
              </el-select>

              <el-date-picker v-model="tableObj.getdataListParm.parammaps.inputDatetime1" class="inputDatetime filter-item" type="daterange" range-separator="至" start-placeholder="合同开始日期" end-placeholder="合同开始日期" style="width: 250px;" />

              <el-date-picker v-model="tableObj.getdataListParm.parammaps.inputDatetime2" class="inputDatetime filter-item" type="daterange" range-separator="至" start-placeholder="合同结束日期" end-placeholder="合同结束日期" style="width: 250px;" />


              <el-input v-model="tableObj.getdataListParm.parammaps.beginContractMoney" placeholder="合同金额" style="width:80px"></el-input>
                -
              <el-input v-model="tableObj.getdataListParm.parammaps.endContractMoney" placeholder="合同金额" style="width:80px"></el-input>


              <el-input v-model="tableObj.getdataListParm.parammaps.beginMoneyStep" placeholder="款项分期" style="width:80px"></el-input>
                -
              <el-input v-model="tableObj.getdataListParm.parammaps.endMoneyStep" placeholder="款项分期" style="width:80px"></el-input>


              <el-date-picker v-model="tableObj.getdataListParm.parammaps.inputDatetime3" class="inputDatetime filter-item" type="daterange" range-separator="至" start-placeholder="创建时间" end-placeholder="创建时间" style="width: 250px;" />


              <el-select v-model="tableObj.getdataListParm.parammaps.createrId" placeholder="创建人" class="filter-item" style="width: 120px;" clearable filterable>
              <el-option v-for="(item,index) in createrNameList" :key="index" :label="item.name" :value="item.id" />
            </el-select>


              <el-date-picker v-model="tableObj.getdataListParm.parammaps.inputDatetime4" class="inputDatetime filter-item" type="daterange" range-separator="至" start-placeholder="合同回收时间" end-placeholder="合同回收时间" style="width: 250px;" />


              <el-select v-model="tableObj.getdataListParm.parammaps.recordStatus" placeholder="备案状态" class="filter-item" style="width: 120px;" clearable>
                  <el-option v-for="item in recordStatusNameList" :key="item.id" :label="item.name" :value="item.id" />
              </el-select>

              <el-select v-model="tableObj.getdataListParm.parammaps.recoveryStatus" placeholder="回收状态" class="filter-item" style="width: 120px;" clearable>
                  <el-option v-for="item in recoveryStatusNameList" :key="item.id" :label="item.name" :value="item.id" />
              </el-select>


                <el-button class="successBorder" @click="form_search">查询</el-button>
                <el-button class="successBorder" @click="form_clear">重置</el-button>


                 <el-button  class="success" icon="el-icon-upload2" @click="form_export">导出</el-button>

          </el-row>
        </div>


    </div>


    <div class="table"   >
      <el-table :key="tableObj.tableKey" v-loading="tableObj.listLoading" element-loading-text="给我一点时间" :data="tableObj.list" border fit highlight-current-row style="width: 100%;" :row-style="rowStyle" :cell-style="cellStyle" class="elTable table-fixed" :max-height="myHeight">


        <el-table-column label="序号" align="center" type="index" width="50px"  fixed="left">
          <template slot-scope="scope">
             <span>{{ scope.$index + (tableObj.pageNum-1) * tableObj.pageSize + 1 }}</span>
          </template>
        </el-table-column>
        <el-table-column label="合同编号" min-width="130px" align="center"  fixed="left">
          <template slot-scope="scope">
            <span  style = "color:#409EFF; cursor: pointer;" @click="form_see(scope.row)">{{ scope.row.contractCode  }}</span>
          </template>
        </el-table-column>
        <el-table-column label="备案状态" min-width="90px" align="center"  fixed="left">
          <template slot-scope="scope">
            <span>{{ scope.row.recordStatus }}</span>
          </template>
        </el-table-column>
        <el-table-column label="回收状态" min-width="90px" align="center"  fixed="left">
          <template slot-scope="scope">
            <span>{{ scope.row.recoveryStatus }}</span>
          </template>
        </el-table-column>
        <el-table-column label="已开发票数" min-width="110px" align="center"  fixed="left">
          <template slot-scope="scope">
            <span style = "color:#409EFF; cursor: pointer;" @click="form_see_nums(scope.row)">{{ scope.row.invoiceNums }}</span>
          </template>
        </el-table-column>
        <el-table-column label="客户名称" min-width="120px" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ scope.row.customerName }}</span>
          </template>
        </el-table-column>
         <!-- <el-table-column label="营业执照" min-width="110px" align="center" show-overflow-tooltip>

            <template slot-scope="scope">
              <img  style="width: 50px; height: 50px" :src="scope.row.imgUrlDetil" alt="">
            </template>

        </el-table-column> -->
        <el-table-column label="所属集团" min-width="90px" align="center"  >
          <template slot-scope="scope">
            <span>{{ scope.row.groupName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="经销商" min-width="110px" align="center" show-overflow-tooltip >
                <template slot-scope="scope">
                  <span>{{ scope.row.dealerName }}</span>
                </template>
              </el-table-column>

        <el-table-column label="合同金额(元)" min-width="110px" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ scope.row.contractMoney }}</span>
          </template>
        </el-table-column>
        <el-table-column label="款项分期" min-width="120px" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.moneyStep }}</span>
          </template>
        </el-table-column>
        <el-table-column label="合同开始时间" min-width="110px" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ scope.row.contractBeginDate  }}</span>
          </template>
        </el-table-column>
        <el-table-column label="合同结束时间" min-width="110px" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ scope.row.contractEndDate  }}</span>
          </template>
        </el-table-column>
        <el-table-column label="创建人" min-width="110px" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ scope.row.createrName  }}</span>
          </template>
        </el-table-column>
        <el-table-column label="创建时间" min-width="110px" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ scope.row.createrDate  }}</span>
          </template>
        </el-table-column>
        <el-table-column label="备注" min-width="120px" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ scope.row.remark  }}</span>
          </template>
        </el-table-column>

        <el-table-column label="操作" align="center"    :width="autoWidth"  v-if="autoWidth !== 0"   class-name="small-padding fixed-width" fixed="right">
          <template slot-scope="{row}">

            <el-button class="miniSuccess" @click="form_edit(row)"  v-if="isContractinfoAdd && row.isRecord == '1'">备案开票</el-button>

            <el-button class="miniSuccess" @click="form_revoke(row)" v-if="isContractinfoAdd && row.isRevokeRecovery  == '1'">撤销回收</el-button>

            <el-button class="miniSuccess" @click="form_sure(row)" v-if="isContractinfoAdd && row.isRecovery  == '1'">确认回收</el-button>

          </template>
        </el-table-column>

      </el-table>

      <el-row :gutter="0">
        <el-col :span="6" :offset="12" style="color:#f00">
          列表合同总金额：{{tableSumMoney}}
        </el-col>
      </el-row>

      <pagination v-show="tableObj.total>=0" :total="tableObj.total" :page.sync="tableObj.getdataListParm.offset" :limit.sync="tableObj.getdataListParm.pagecount" @pagination="get_table_data" />
    </div>

    <!-- 新增/编辑 -->
    <el-dialog :title="textMap[create.dialogStatus]" :visible.sync="create.dialogFormVisible" :close-on-click-modal="false" width="95%" append-to-body :before-close="dialog_close">
      <div class="app-add">
        <el-form ref="temp" :rules="create.rules" :model="create.temp" label-position="right" label-width="150px" style="width: 90%;margin:0 auto 50px">

          <h3>基本信息</h3>
          <el-row>
            <el-col :span="8">
              <el-form-item label="创建人：" prop="createrName">
                <el-input ref="createrName" v-model="create.temp.createrName" class="filter-item" style="width: 100%;"     disabled  />
              </el-form-item>

               <el-form-item label="所属集团：" prop="groupId">
                  <el-select v-model="create.temp.groupId" placeholder="所属集团" class="filter-item" style="width: 100%;" filterable  @change="change_group" disabled>
                      <el-option v-for="item in groupNameList" :key="item.id" :label="item.name" :value="item.id" />
                  </el-select>
              </el-form-item>

              <el-form-item label="合同开始时间：" prop="contractBeginDate">
                <el-date-picker v-model="create.temp.contractBeginDate" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" disabled />
              </el-form-item>

              <el-form-item label="备注：" prop="remark">
                <el-input ref="remark" v-model="create.temp.remark" type="textarea" :autosize="{ minRows: 1.3, maxRows: 4}" placeholder="请输入备注，最多255个字" maxlength="255" class="filter-item" style="width: 100%;" disabled />
              </el-form-item>

            </el-col>

            <el-col :span="8">
              <el-form-item label="创建时间：" prop="createrDate">
                <el-input ref="createrDate" v-model="create.temp.createrDate" class="filter-item" style="width: 100%;"     disabled  />
              </el-form-item>

              <el-form-item label="客户名称：" prop="customerId">
                <el-select v-model="create.temp.customerId" filterable placeholder="客户名称" class="filter-item"  style="width: 100%;" clearable @change="change_customer" disabled>
                    <el-option v-for="item in create.customerNameList" :key="item.id" :label="item.name" :value="item.id" />
                </el-select>
              </el-form-item>

              <el-form-item label="合同结束时间：" prop="contractEndDate">
                <el-date-picker v-model="create.temp.contractEndDate" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false" disabled />
              </el-form-item>

            </el-col>

            <el-col :span="8">
               <el-form-item label="营业执照：" prop="businessLicense">
                <el-image style="width: 150px; height: 150px;display:inline-block"  :src="create.temp.picname1" @click="show_pic1()">

                </el-image>
                <el-dialog :visible.sync="imageIsShow" append-to-body width="40%">
                            <img width="80%" :src="create.temp.picname1" alt="">
                </el-dialog>

              </el-form-item>

            </el-col>
          </el-row>

          <h3>款项信息</h3>
          <el-row>
            <el-col :span="8">
               <el-form-item label="款项分期：" prop="moneyStep">
                  <el-select v-model="create.temp.moneyStep" placeholder="款项分期" class="filter-item" style="width: 100%;" filterable clearable disabled>
                      <el-option v-for="item in moneyStepList" :key="item.id" :label="item.name" :value="item.id" />
                  </el-select>
              </el-form-item>
            </el-col>

            <el-col :span="8">
                <el-form-item label="合同金额（元）：" prop="contractMoney">
                    <el-input ref="contractMoney" v-model="create.temp.contractMoney" class="filter-item" style="width: 100%;"  placeholder="请输入合同金额" disabled />
                </el-form-item>
            </el-col>
          </el-row>

          <el-row>
                  <el-table  :data="tableStagesList" border fit highlight-current-row style="width: 100%;" :row-style="rowStyle" :cell-style="cellStyle" class="elTable table-fixed">


                    <el-table-column label="期数" min-width="110px" align="center">
                      <template slot-scope="scope">
                        <span>{{ scope.row.stages }}期</span>
                      </template>
                    </el-table-column>

                    <el-table-column label="应收金额占比" min-width="110px" align="center">
                      <template slot-scope="scope">
                        <span>{{ scope.row.planCostRate }}%</span>
                      </template>
                    </el-table-column>
                    <el-table-column label="应收金额（元）" min-width="110px" align="center">
                      <template slot-scope="scope">
                        <span>{{ scope.row.planCost }}</span>
                      </template>
                    </el-table-column>
                    <el-table-column label="收款时间" min-width="110px" align="center">
                      <template slot-scope="scope">
                        <span>{{ scope.row.collectionDate }}</span>

                      </template>
                    </el-table-column>


                  </el-table>
          </el-row>

          <h3>货物信息</h3>
          <el-row>
            <el-row>
                  <el-table :data="tableStockList" border fit highlight-current-row style="width: 100%;" :row-style="rowStyle" :cell-style="cellStyle" class="elTable table-fixed">

                    <el-table-column label="序号" align="center" type="index" width="50px">
                      <template slot-scope="scope">
                        <span>{{ scope.$index + 1 }}</span>
                      </template>
                    </el-table-column>

                    <el-table-column label="货品名称" min-width="110px" align="center">
                      <template slot-scope="scope">
                        <span>{{ scope.row.productsName }}</span>
                      </template>
                    </el-table-column>
                    <el-table-column label="型号" min-width="110px" align="center">
                      <template slot-scope="scope">
                        <span>{{ scope.row.model }}</span>
                      </template>
                    </el-table-column>
                    <el-table-column label="规格" min-width="110px" align="center">
                      <template slot-scope="scope">
                        <span>{{ scope.row.Specifications }}</span>
                      </template>
                    </el-table-column>
                    <el-table-column label="数量" min-width="110px" align="center">
                      <template slot-scope="scope">
                        <span>{{ scope.row.nums }}</span>

                      </template>
                    </el-table-column>
                    <el-table-column label="单价(元)" min-width="110px" align="center">
                            <template slot-scope="scope">
                              <span>{{ scope.row.price }}</span>
                            </template>
                    </el-table-column>

                    <el-table-column label="总价(元)" min-width="110px" align="center">
                            <template slot-scope="scope">
                              <span>{{ scope.row.sumPrice  }}</span>
                            </template>
                    </el-table-column>

                    <el-table-column label="备注" min-width="280px" align="center">
                      <template slot-scope="scope">
                        <span>{{ scope.row.remark }}</span>
                      </template>
                    </el-table-column>

                  </el-table>
            </el-row>

            <el-row type="flex" justify="end">
                  <el-col style="color:#FF4949" :span="6" :offset="18">列表货物总价：{{stockSumPrice}}</el-col>
            </el-row>
            <el-divider></el-divider>


          </el-row>


          <h3>合同附件</h3>
          <el-row>
            <span @click="form_down2()"  style = "color:#409EFF; cursor: pointer;">{{create.temp.applyFileName}}</span>
          </el-row>

          <h3>备案信息</h3>
          <el-row>

            <el-form-item  label="合同原件" prop="">

                <el-upload
                  class="avatar-uploader"
                  :headers="headers2"
                  :auto-upload="true"
                  :show-file-list="true"
                  :limit="1"
                  :action="uploadFileUrl"
                  :on-exceed="handleExceed"
                  :on-success="handlefileSuccess"
                  :file-list="uploadfileList1"
                  >
                   <el-button size="small" type="primary">点击上传</el-button>
                </el-upload>
            </el-form-item>


          </el-row>

          <h3>发票信息</h3>
          <el-row>
            <el-col :span="8"  v-if="tableStagesList.length == 1 || tableStagesList.length > 1">
               <el-form-item  label="1期发票" prop="scenePhoto0">
                <el-upload
                  class="avatar-uploader"
                  :headers="headers"
                  :auto-upload="true"
                  :show-file-list="false"
                  :action="uploadImageUrl"

                  :on-success="(response,file)=>{ return handleAvatarSuccess(response,file, 0) }"
                  >
                  <img v-if="imageUrl0" :src="imageUrl0" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>
                </el-form-item>
                <el-form-item label="寄出时间：" prop="postDate0">
                    <el-date-picker v-model="postDate0" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />
                  </el-form-item>
             </el-col>
             <el-col :span="8"  v-if="tableStagesList.length == 2 || tableStagesList.length > 2">
               <el-form-item  label="2期发票" prop="scenePhoto1">
                <el-upload
                  class="avatar-uploader"
                  :headers="headers"
                  :auto-upload="true"
                  :show-file-list="false"
                  :action="uploadImageUrl"
                  :on-success="(response,file)=>{ return handleAvatarSuccess(response,file, 1) }"
                  >
                  <img v-if="imageUrl1" :src="imageUrl1" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>

                </el-form-item>

                  <el-form-item label="寄出时间：" prop="postDate1">
                    <el-date-picker v-model="postDate1" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />
                  </el-form-item>

             </el-col>
             <el-col :span="8"  v-if="tableStagesList.length == 3 || tableStagesList.length > 3">
               <el-form-item  label="3期发票" prop="scenePhoto2">
                <el-upload
                  class="avatar-uploader"
                  :headers="headers"
                  :auto-upload="true"
                  :show-file-list="false"
                  :action="uploadImageUrl"
                  :on-success="(response,file)=>{ return handleAvatarSuccess(response,file, 2) }"
                  >
                  <img v-if="imageUrl2" :src="imageUrl2" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>

                </el-form-item>

                  <el-form-item label="寄出时间：" prop="postDate2">
                    <el-date-picker v-model="postDate2" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />
                  </el-form-item>

             </el-col>

          </el-row>

          <el-row>
            <el-col :span="8"  v-if="tableStagesList.length == 4 || tableStagesList.length > 4">
               <el-form-item  label="4期发票" prop="scenePhoto3">
                <el-upload
                  class="avatar-uploader"
                  :headers="headers"
                  :auto-upload="true"
                  :show-file-list="false"
                  :action="uploadImageUrl"

                  :on-success="(response,file)=>{ return handleAvatarSuccess(response,file, 3) }"
                  >
                  <img v-if="imageUrl3" :src="imageUrl3" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>
                </el-form-item>
                <el-form-item label="寄出时间：" prop="postDate3">
                    <el-date-picker v-model="postDate3" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />
                  </el-form-item>
             </el-col>
             <el-col :span="8"  v-if="tableStagesList.length == 5 || tableStagesList.length > 5">
               <el-form-item  label="5期发票" prop="scenePhoto4">
                <el-upload
                  class="avatar-uploader"
                  :headers="headers"
                  :auto-upload="true"
                  :show-file-list="false"
                  :action="uploadImageUrl"
                  :on-success="(response,file)=>{ return handleAvatarSuccess(response,file, 4) }"
                  >
                  <img v-if="imageUrl4" :src="imageUrl4" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>

                </el-form-item>

                  <el-form-item label="寄出时间：" prop="postDate4">
                    <el-date-picker v-model="postDate4" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />
                  </el-form-item>

             </el-col>
             <el-col :span="8"  v-if="tableStagesList.length == 6 || tableStagesList.length > 6">
               <el-form-item  label="6期发票" prop="scenePhoto5">
                <el-upload
                  class="avatar-uploader"
                  :headers="headers"
                  :auto-upload="true"
                  :show-file-list="false"
                  :action="uploadImageUrl"
                  :on-success="(response,file)=>{ return handleAvatarSuccess(response,file, 5) }"
                  >
                  <img v-if="imageUrl5" :src="imageUrl5" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>

                </el-form-item>

                  <el-form-item label="寄出时间：" prop="postDate5">
                    <el-date-picker v-model="postDate5" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />
                  </el-form-item>

             </el-col>

          </el-row>

          <el-row>
            <el-col :span="8"  v-if="tableStagesList.length == 7 || tableStagesList.length > 7">
               <el-form-item  label="7期发票" prop="scenePhoto6">
                <el-upload
                  class="avatar-uploader"
                  :headers="headers"
                  :auto-upload="true"
                  :show-file-list="false"
                  :action="uploadImageUrl"

                  :on-success="(response,file)=>{ return handleAvatarSuccess(response,file, 6) }"
                  >
                  <img v-if="imageUrl6" :src="imageUrl6" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>
                </el-form-item>
                <el-form-item label="寄出时间：" prop="postDate6">
                    <el-date-picker v-model="postDate6" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />
                  </el-form-item>
             </el-col>
             <el-col :span="8"  v-if="tableStagesList.length == 8 || tableStagesList.length > 8">
               <el-form-item  label="8期发票" prop="scenePhoto7">
                <el-upload
                  class="avatar-uploader"
                  :headers="headers"
                  :auto-upload="true"
                  :show-file-list="false"
                  :action="uploadImageUrl"
                  :on-success="(response,file)=>{ return handleAvatarSuccess(response,file, 7) }"
                  >
                  <img v-if="imageUrl7" :src="imageUrl7" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>

                </el-form-item>

                  <el-form-item label="寄出时间：" prop="postDate7">
                    <el-date-picker v-model="postDate7" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />
                  </el-form-item>

             </el-col>
             <el-col :span="8"  v-if="tableStagesList.length == 9 || tableStagesList.length > 9">
               <el-form-item  label="9期发票" prop="scenePhoto8">
                <el-upload
                  class="avatar-uploader"
                  :headers="headers"
                  :auto-upload="true"
                  :show-file-list="false"
                  :action="uploadImageUrl"
                  :on-success="(response,file)=>{ return handleAvatarSuccess(response,file, 8) }"
                  >
                  <img v-if="imageUrl8" :src="imageUrl8" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>

                </el-form-item>

                  <el-form-item label="寄出时间：" prop="postDate8">
                    <el-date-picker v-model="postDate8" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />
                  </el-form-item>

             </el-col>

          </el-row>
          <el-row>
             <el-col :span="8"  v-if="tableStagesList.length == 10 || tableStagesList.length > 10">
               <el-form-item  label="10期发票" prop="scenePhoto9">
                <el-upload
                  class="avatar-uploader"
                  :headers="headers"
                  :auto-upload="true"
                  :show-file-list="false"
                  :action="uploadImageUrl"
                  :on-success="(response,file)=>{ return handleAvatarSuccess(response,file, 9) }"
                  >
                  <img v-if="imageUrl9" :src="imageUrl9" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>

                </el-form-item>

                  <el-form-item label="寄出时间：" prop="postDate9">
                    <el-date-picker v-model="postDate9" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />
                  </el-form-item>

             </el-col>

          </el-row>

        </el-form>
        <div slot="footer" class="dialog-footer">


          <el-button class="cancelClose" @click="dialog_close()">关闭</el-button>

          <el-button v-if="  create.dialogStatus==='update'" class="success" :disabled="isokDisable" @click="form_edit_save()">保存</el-button>
        </div>
      </div>
    </el-dialog>

    <!-- 查看/反馈 -->
    <el-dialog  title="合同详情" :visible.sync="createSee.dialogFormVisible" :close-on-click-modal="false" width="95%" :before-close="dialog_close_see">
      <div class="app-add">
        <el-tabs v-model="activeName" type="card" >
          <el-tab-pane label="合同信息" name="first">
              <ContractMoreDetail :conmore-data="conmoreData"  />

          </el-tab-pane>
          <el-tab-pane label="合同履历" name="second">
              <ContractCustomerDetail :concustomer-data="concustomerData"  />


          </el-tab-pane>
        </el-tabs>
        <div slot="footer" class="dialog-footer">
          <!-- <el-button class="cancelClose" @click="dialog_close_see()">催进度</el-button> -->
          <el-button class="cancelClose" @click="dialog_close_see()">关闭</el-button>


        </div>
      </div>
    </el-dialog>


     <!-- 查看/反馈 -->
    <el-dialog  title="发票详情" :visible.sync="createSeeNums.dialogFormVisible" :close-on-click-modal="false" width="95%">
      <div class="app-add">
        <el-row>
            <el-col :span="6"  v-for="(item,index) in tableInvocieList ">
                <el-col :span="24">
                  <el-image style="width: 150px; height: 150px;display:inline-block"  :src="item.picname"></el-image>
                </el-col>
                <el-col :span="24">
                  寄出时间：{{item.postDate}}
                </el-col>
             </el-col>
          </el-row>
        <div slot="footer" class="dialog-footer">
          <el-button class="cancelClose" @click="createSeeNums.dialogFormVisible = false;">关闭</el-button>
        </div>
      </div>
    </el-dialog>


     <!-- 确认回收 -->
    <el-dialog title="确认是否已回收合同" :visible.sync="sure.dialogFormVisible" :close-on-click-modal="false" width="50%">
      <div class="app-add">
        <el-form ref="suretemp" :rules="sure.rules" :model="sure.temp" label-position="right" label-width="150px" style="width: 70%;margin:0 auto 50px">

          <el-form-item label="回收时间：" prop="recoveryDate">

            <el-date-picker v-model="sure.temp.recoveryDate" type="date" placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%;" :clearable="false"   />

          </el-form-item>


        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button class="cancelClose" @click="sure.dialogFormVisible = false;get_table_data()">关闭</el-button>
          <el-button class="success" @click="form_sure_save()">确认</el-button>
        </div>
      </div>
    </el-dialog>

    <!-- 撤销 -->
    <el-dialog title="确认是否撤销" :visible.sync="revoke.dialogFormVisible" :close-on-click-modal="false" width="50%">
      <div class="app-add">
        <el-form ref="revoketemp" :rules="revoke.rules" :model="revoke.temp" label-position="right" label-width="150px" style="width: 70%;margin:0 auto 50px">

          <el-form-item label="撤销原因：" prop="revokeReason">
            <el-input ref="remark" v-model="revoke.temp.revokeReason" type="textarea" :autosize="{ minRows: 4, maxRows: 8} "  :rows="8" placeholder="请输入备注，最多200个字" maxlength="200" class="filter-item" style="width: 100%;"   />
          </el-form-item>


        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button class="cancelClose" @click="revoke.dialogFormVisible = false;get_table_data()">关闭</el-button>
          <el-button class="success" @click="form_revoke_save()">确认</el-button>
        </div>
      </div>
    </el-dialog>


  </div>
</template>

<script>


import { GetDataByName, PostDataByName, failproccess, ExecDataByConfig, GetDataByNames, checkButtons, calculativeWidth } from '@/api/common'
import Cookies from 'js-cookie'
import { parseTime, json2excel } from '@/utils/index.js'
// import littleTable from './components/littleTable'
import { getToken } from '@/utils/auth'
import Pagination from '@/components/Pagination'
import { MessageBox } from 'element-ui'

import ContractMoreDetail from '@/componentView/ContractMoreDetail.vue'
import ContractCustomerDetail from '@/componentView/ContractCustomerDetail.vue'
import { constants } from 'zlib';


export default {
  name: 'ContractInfo',
  components: { Pagination , ContractCustomerDetail, ContractMoreDetail},
  data() {
    return {
      myHeight:document.documentElement.clientHeight - 85 - 220,
      employeid: Cookies.get('employeid'),
      disabled: false,

      rowData:{},
      isHome:"",


      dialogImageUrl: '',
      dialogVisible: false,
      dialogImageUrl2: '',
      dialogVisible2: false,


      autoWidth: 130,
      //图片请求地址
      uploadImageUrl: process.env.VUE_APP_BASE_API + 'authdata/uploaderimage',
      //图片请求头
      headers: {
        optname: 'insertcustompic',
        id: 1,
        token: getToken() // 从cookie里获取token，并赋值token
      },

      headers2: {
        optname: 'insertcustompic',
        id: 1,
        token: getToken() // 从cookie里获取token，并赋值token
      },
      //图片路径
      fileList: [],
      fileList2: [],


      //图片文件请求地址
      uploadFileUrl: process.env.VUE_APP_BASE_API + 'uploadfileCRM',
      uploadfileList1: [],

      isRoleEdit: [],isContractinfoAdd: [],


      activeName:'first',

      //客户资料详情组件
      conmoreData:{ id:"" },
      concustomerData:{ id:"" },


      customerNameList: [], // 客户名称
      groupNameList: [], // 集团
      //经销商 - 下拉框
      dealNameList: [
        // {id: 253, name: "无"},
        // {id: 207, name: "星连星牧业"},
        // {id: 208, name: "海高牧业"},
        // {id: 254, name: "完达山"}
      ],

       // 下拉框 - 创建人
      createrNameList: [],

      // 下拉框 - 合同状态
      recordStatusNameList: [
        { "name": "已备案", "id": "已备案" },
        { "name": "未备案", "id": "未备案" },
      ],


      recoveryStatusNameList: [
        { "name": "已回收", "id": "已回收" },
        { "name": "未回收", "id": "未回收" },
      ],

      // 下拉框 -款项分期
      moneyStepList: [
        { "name": "1", "id": "1" },
        { "name": "2", "id": "2" },
        { "name": "3", "id": "3" },
        { "name": "4", "id": "4" },
        { "name": "5", "id": "5" },
        { "name": "6", "id": "6" },
        { "name": "7", "id": "7" },
        { "name": "8", "id": "8" },
        { "name": "9", "id": "9" },
        { "name": "10", "id": "10" },
      ],


      //表格 - 列表 - 查询
      tableObj: {
        getdataListParm: {
          name: 'getContract',
          page: 1,
          offset: 1,
          pagecount: parseInt(Cookies.get('pagecount')),
          returntype: 'Map',
          parammaps: {
            roleId: Cookies.get('g_roleId'),
            userId: Cookies.get('g_userId'),
            contractCode: "",
            customerName: "",
            customerId: "",
            groupId: "",
            contractStatus: "",
            createrId: "",
            beginContractMoney: "",
            endContractMoney: "",
            beginMoneyStep: "",
            endMoneyStep: "",
            recordStatus: "",
             recoveryStatus: "",
             dealerId: '',
            inputDatetime1: "",
            inputDatetime2: "",
            inputDatetime3: "",
            inputDatetime4: "",

            beginContractBeginDate: "",
            endContractBeginDate: "",
            beginContractEndDate: "",
            endContractEndDate: "",
            beginCreaterDate: "",
            endCreaterDate: "",
             beginRecoveryDate: "",
            endRecoveryDate: "",


          }
        },
        tableKey: 0,
        list: [],
        total: 0,
        listLoading: true,
        temp: {}
      },


      tableSumMoney:1000,

      download: {
        getdataListParm: {
          name: 'getContract',
          page: 1,
          offset: 1,
          pagecount: 0,
          returntype: 'Map',
          parammaps: {
            roleId: Cookies.get('g_roleId'),
            userId: Cookies.get('g_userId'),
            contractCode: "",
            customerName: "",
            customerId: "",
            groupId: "",
            contractStatus: "",
            createrId: "",
            beginContractMoney: "",
            endContractMoney: "",
            beginMoneyStep: "",
            endMoneyStep: "",
            recordStatus: "",
             recoveryStatus: "",

            inputDatetime1: "",
            inputDatetime2: "",
            inputDatetime3: "",
            inputDatetime4: "",

            beginContractBeginDate: "",
            endContractBeginDate: "",
            beginContractEndDate: "",
            endContractEndDate: "",
            beginCreaterDate: "",
            endCreaterDate: "",
             beginRecoveryDate: "",
            endRecoveryDate: "",


          }
        },
        tableKey: 0,
        list: [],
        total: 0,
        listLoading: true,
        temp: {}
      },

      dialogImageUrl: '',
      imageIsShow: false,


      // 新增/编辑
      create: {
        dialogFormVisible: false,
        dialogStatus: '',
        temp: {  contractStatus: '',    customerId: '', groupId: '', groupName: '', serviceCode: '', contractBeginDate: parseTime(new Date(), '{y}-{m}-{d}'), contractEndDate: parseTime(new Date(), '{y}-{m}-{d}'), createrId:  Cookies.get('employeid'), createrName:  Cookies.get('employename'),moneyStep: '1',contractMoney: '', businessLicense: -1,picname1: '',fileId:"",fileName:""},

        rules: {
          // customerName: [{ required: true, message: '必填', trigger: 'blur' }],
          // serviceCode: [{ required: true, message: '必填', trigger: 'blur' }],
          // serviceBeginDate: [{ required: true, message: '必填', trigger: 'blur' }],
          // employeeId: [{ required: true, message: '必填', trigger: 'blur' }],
          // serviceTypeName: [{ required: true, message: '必填', trigger: 'blur' }],
          // serviceResult: [{ required: true, message: '必填', trigger: 'blur' }],
          // describe: [{ required: true, message: '必填', trigger: 'blur' }],
          // receiverName: [{ required: true, message: '必填', trigger: 'blur' }],
          // receiverTel: [{ required: true, message: '必填', trigger: 'blur' }],

          // businessLicense: [{ required: true, message: '必填', trigger: 'blur' }],

        },
        // 客户名称
        getdataListParmCust: {
          name: 'getCustomerByGroupId',
          returntype: 'Map',
          parammaps: { groupId: "" }
        },
        customerNameList:[],

        // 款项信息 - 表格
        getdataListParmStages: {
          name: 'getContractCost',
          returntype: 'Map',
          parammaps: { id: "" }
        },
        // 货物信息 - 表格
        getdataListParmStock: {
          name: 'getContractGoodsByCid2',
          returntype: 'Map',
          parammaps: { id: "" }
        },
      },

      //发票信息
      tableInvocieList :[],

      createSee:{
        dialogFormVisible: false,
      },

      createSeeNums:{
        dialogFormVisible: false,
      },

      //款项期数表格
      tableStagesList:[],
      //下拉框 - 备货
      receProductNameList:[],
      //备货表格
      tableStockList:[],
      stockSumPrice:0,


      textMap: {
        create: '新增',
        see: '查看',
        update: '编辑'
      },


      //备货ID集合
      stockupIdArr: [],
      //备货表格集合
      tableArrList: [],


      imageUrl0:"",
      imageUrl1:"",
      imageUrl2:"",
      imageUrl3:"",
      imageUrl4:"",
      imageUrl5:"",
      imageUrl6:"",
      imageUrl7:"",
      imageUrl8:"",
      imageUrl9:"",

      imageUrlId0:"",
      imageUrlId1:"",
      imageUrlId2:"",
      imageUrlId3:"",
      imageUrlId4:"",
      imageUrlId5:"",
      imageUrlId6:"",
      imageUrlId7:"",
      imageUrlId8:"",
      imageUrlId9:"",

      postDate0: parseTime(new Date(), '{y}-{m}-{d}'),
      postDate1: parseTime(new Date(), '{y}-{m}-{d}'),
      postDate2: parseTime(new Date(), '{y}-{m}-{d}'),
      postDate3: parseTime(new Date(), '{y}-{m}-{d}'),
      postDate4: parseTime(new Date(), '{y}-{m}-{d}'),
      postDate5: parseTime(new Date(), '{y}-{m}-{d}'),
      postDate6: parseTime(new Date(), '{y}-{m}-{d}'),
      postDate7: parseTime(new Date(), '{y}-{m}-{d}'),
      postDate8: parseTime(new Date(), '{y}-{m}-{d}'),
      postDate9: parseTime(new Date(), '{y}-{m}-{d}'),

      // 撤销
      revoke: {
        dialogFormVisible: false,
        dialogStatus: '',
        temp: { revokeReason: '',  id: '' },
        rules: {
          revokeReason: [{ required: true, message: '必填', trigger: 'blur' }],
        }
      },

      // 确认回收
      sure: {
        dialogFormVisible: false,
        dialogStatus: '',
        temp: { recoveryDate: '',  id: '' },
        // rules: {
        //   revokeReason: [{ required: true, message: '必填', trigger: 'blur' }],
        // }
      },


      moneyShow:true,
      //获取反馈记录
      getFeedRecordParm:{
          name: 'getServiceFeedbackById',
          page: 1,
          offset: 1,
          pagecount: 10,
          returntype: 'Map',
          parammaps: { id: "" }
      },
      //保存反馈记录
      feedRecordTemp:{
          name: 'insertServiceFeedback',
          page: 1,
          offset: 1,
          pagecount: 1000,
          returntype: 'Map',
          parammaps: {
            serviceId:"",
            createrId:"",
            remark:"",

          }

      },
      //反馈记录
      feedRecordList:[
        // {id:1, num: 1, txt: '主板缺失零件，疫情关系，无法采购，延期1天',   director:'epans', date:"2022-12-01"},
        // {id:1, num: 1, txt: '主板缺失零件，疫情关系，无法采购，延期1天',   director:'epans', date:"2022-12-01"},
        // {id:1, num: 1, txt: '主板缺失零件，疫情关系，无法采购，延期1天',   director:'epans', date:"2022-12-01"},
      ],

      requestParam: {},
      isokDisable: false,
      selectList: [],
      rowStyle: { maxHeight: 50 + 'px', height: 45 + 'px' },
      cellStyle: { padding: 0 + 'px' }
    }
  },

  watch: {


    // tableStagesList: {
    //   deep: true,
    //   handler: function (item) {
    //      //计算价格比例
    //       var contractMoney = this.create.temp.contractMoney
    //       var tableStagesList = this.tableStagesList
    //       for (let i = 0; i < tableStagesList.length; i++) {
    //         tableStagesList[i].planCost = parseFloat(tableStagesList[i].planCostRate) * contractMoney  * 0.01
    //       }
    //       this.tableStagesList = tableStagesList


    //   }
    // },


    tableStockList: {
      deep: true,
      handler: function (item) {
          //计算总价格
          var sum = 0
          this.tableStockList.forEach(function(i){
              sum = parseInt(i.nums) * parseFloat(i.price) + sum
          })
          this.stockSumPrice = sum

      }
    },

  },

  created() {

    this.get_select_list()
    this.get_auto_buttons()


    var num = this.$route.params.num
    console.log(num)
    if(num !== null && num !== "" && num !== undefined){
      this.tableObj.getdataListParm.parammaps.contractCode = num
    }


    var rowData = this.$route.params.rowData
    var isHome = this.$route.params.isHome
    var codeNum = this.$route.params.codeNum

    console.log("rowData",rowData,"======isHome",isHome,"======codeNum",codeNum)


    if(isHome == 'home'){
      this.rowData = rowData
      this.isHome = isHome
      this.tableObj.getdataListParm.parammaps.contractCode = codeNum
      this.get_table_data()

    } else {
      this.rowData = {}
      this.isHome = ""


      this.get_table_data()
    }
  },


  methods: {
    handlePreview(file) {
        console.log(file);
      },
     handleExceed(files, fileList) {
        this.$message.warning(`限制只能上传一个文件，请删除原文件后再上传新的原件`);
      },
    handlefileSuccess(response, file, fileList) {
        console.log(response, file, fileList)
        this.create.temp.fileId = response.data.LastInsertId
        this.create.temp.fileName = file.name
        this.$refs.temp.resetFields()

        console.log(file.name)
        console.log(response.data.LastInsertId)


        console.log("this.uploadfileList1",this.uploadfileList1)
      },

    handleAvatarSuccess(res, file,indexList ) {
      console.log(indexList)
      console.log(file.raw)
       console.log(file)
       if(indexList == 0){
        this.imageUrl0 = URL.createObjectURL(file.raw);
        console.log(this.imageUrl0)
        this.imageUrlId0 = file.response.execresult.LastInsertId
       }
        if(indexList == 1){
        this.imageUrl1 = URL.createObjectURL(file.raw);
        this.imageUrlId1 = file.response.execresult.LastInsertId
       }
       if(indexList == 2){
        this.imageUrl2 = URL.createObjectURL(file.raw);
        this.imageUrlId2 = file.response.execresult.LastInsertId
       }
        if(indexList == 3){
        this.imageUrl3 = URL.createObjectURL(file.raw);
        this.imageUrlId3 = file.response.execresult.LastInsertId
       }
        if(indexList == 4){
        this.imageUrl4 = URL.createObjectURL(file.raw);
        this.imageUrlId4 = file.response.execresult.LastInsertId
       }
        if(indexList == 5){
        this.imageUrl5 = URL.createObjectURL(file.raw);
        this.imageUrlId5 = file.response.execresult.LastInsertId
       }
        if(indexList == 6){
        this.imageUrl6 = URL.createObjectURL(file.raw);
        this.imageUrlId6 = file.response.execresult.LastInsertId
       }
       if(indexList == 7){
        this.imageUrl7 = URL.createObjectURL(file.raw);
        this.imageUrlId7 = file.response.execresult.LastInsertId
       }
       if(indexList == 8){
        this.imageUrl8 = URL.createObjectURL(file.raw);
        this.imageUrlId8 = file.response.execresult.LastInsertId
       }
        if(indexList == 9){
        this.imageUrl9 = URL.createObjectURL(file.raw);
        this.imageUrlId9 = file.response.execresult.LastInsertId
       }


      },


    //获取按钮权限
    get_auto_buttons() {
      const Edit = 'ContractInfo'
      const isRoleEdit = checkButtons(JSON.parse(sessionStorage.getItem('buttons')), Edit)
      this.isRoleEdit = isRoleEdit

      const ContractinfoAdd = 'contract:contractinfo:add'
      const isContractinfoAdd = checkButtons(this.$store.state.user.buttons, ContractinfoAdd)
      this.isContractinfoAdd = isContractinfoAdd
    },
    //获取所有下拉框的内容
    get_select_list() {


       var  send_select_list = [
        { name: 'getDictListSelect', offset: 0, pagecount: 0, parammaps: { "pid": "54" } },
        { name: 'getUsersSelect', offset: 0, pagecount: 0, parammaps: {} },
         { name: 'getProductsEnable', offset: 0, pagecount: 0, parammaps: {} },
         { name: 'getDealerSelect', offset: 0, pagecount: 0, parammaps: {  } },
      ]

      GetDataByNames( send_select_list).then(response => {
        // this.customerNameList = response.data.getCustomerSelect.list
        // console.log("客户名称下拉框", this.houseNameList)
        this.groupNameList = response.data.getDictListSelect.list
        console.log("集团下拉框", this.groupNameList)

        this.dealNameList = response.data.getDealerSelect.list
        console.log("经销商下拉框", this.dealNameList)

        this.createrNameList = response.data.getUsersSelect.list
        console.log("创建人下拉框", this.createrNameList)


        response.data.getProductsEnable.list.map(function (i) {
          return (i.customerId = "")
        })
        response.data.getProductsEnable.list.map(function (i) {
          return (i.nums = "")
        })
        response.data.getProductsEnable.list.map(function (i) {
          return (i.remark = "")
        })
        this.receProductNameList = response.data.getProductsEnable.list
        console.log("收件货品下拉框", this.receProductNameList)


      })

    },
    //加载表格
    get_table_data() {
      var me = this

      this.tableObj.listLoading = true
      console.log("this.tableObj.getdataListParm======>", this.tableObj.getdataListParm)
      GetDataByName(this.tableObj.getdataListParm).then(response => {
        console.log('table数据======>', response.data.list)
        if (response.data.list !== null) {


          for (let i = 0; i < response.data.list.length; i++) {
            var url = process.env.VUE_APP_BASE_API + response.data.list[i].picname1
            this.$set(response.data.list[i], 'imgUrlDetil', url )
          }

          this.tableObj.list = response.data.list
          this.tableObj.pageNum = response.data.pageNum
          this.tableObj.pageSize = response.data.pageSize
          this.tableObj.total = response.data.total

           //计算操作栏宽度
           var btnNum = 0
              var arrList = response.data.list
              arrList.forEach(function(row){
                  var itemBtnNum = 0
                  if(me.isContractinfoAdd && row.isRecord == '1'){
                    itemBtnNum = itemBtnNum + 1
                  }
                  if(me.isContractinfoAdd && row.isRevokeRecovery  == '1'){
                    itemBtnNum = itemBtnNum + 1
                  }
                  if(me.isContractinfoAdd && row.isRecovery  == '1'){
                    itemBtnNum = itemBtnNum + 1
                  }


                  console.log(itemBtnNum)
                  if(itemBtnNum > btnNum){
                    btnNum = itemBtnNum
                  }
              })
              console.log("btnNum=============",btnNum)
              me.autoWidth = btnNum * 90


          console.log('table数据======>', this.tableObj.list)
        } else {
          this.tableObj.list = []
        }
        setTimeout(() => {
          this.tableObj.listLoading = false
        }, 100)
      })


      var send_price = {
        name: 'getContractOfPrice2',
        parammaps: this.tableObj.getdataListParm.parammaps
      }

      GetDataByName(send_price).then(response => {
        console.log('table总价格数据======>', response )
        if (response.data.list !== null) {
          this.tableSumMoney = response.data.list[0].totlePrice
        } else {
          this.tableSumMoney = ""
        }
      })


    },
    form_search() {
      console.log('点击了查询')

      if (this.tableObj.getdataListParm.parammaps.inputDatetime1 !== '' && this.tableObj.getdataListParm.parammaps.inputDatetime1 !== null) {
        this.tableObj.getdataListParm.parammaps.beginContractBeginDate = parseTime(this.tableObj.getdataListParm.parammaps.inputDatetime1[0], '{y}-{m}-{d}')
        this.tableObj.getdataListParm.parammaps.endContractBeginDate = parseTime(this.tableObj.getdataListParm.parammaps.inputDatetime1[1], '{y}-{m}-{d}')
      } else {
        this.tableObj.getdataListParm.parammaps.inputDatetime1 = ''
        this.tableObj.getdataListParm.parammaps.beginContractBeginDate = ''
        this.tableObj.getdataListParm.parammaps.endContractBeginDate = ''
      }

      if (this.tableObj.getdataListParm.parammaps.inputDatetime2 !== '' && this.tableObj.getdataListParm.parammaps.inputDatetime2 !== null) {
        this.tableObj.getdataListParm.parammaps.beginContractEndDate = parseTime(this.tableObj.getdataListParm.parammaps.inputDatetime2[0], '{y}-{m}-{d}')
        this.tableObj.getdataListParm.parammaps.endContractEndDate = parseTime(this.tableObj.getdataListParm.parammaps.inputDatetime2[1], '{y}-{m}-{d}')
      } else {
        this.tableObj.getdataListParm.parammaps.inputDatetime2 = ''
        this.tableObj.getdataListParm.parammaps.beginContractEndDate = ''
        this.tableObj.getdataListParm.parammaps.endContractEndDate = ''
      }

      if (this.tableObj.getdataListParm.parammaps.inputDatetime3 !== '' && this.tableObj.getdataListParm.parammaps.inputDatetime3 !== null) {
        this.tableObj.getdataListParm.parammaps.beginCreaterDate = parseTime(this.tableObj.getdataListParm.parammaps.inputDatetime3[0], '{y}-{m}-{d}')
        this.tableObj.getdataListParm.parammaps.endCreaterDate = parseTime(this.tableObj.getdataListParm.parammaps.inputDatetime3[1], '{y}-{m}-{d}')
      } else {
        this.tableObj.getdataListParm.parammaps.inputDatetime3 = ''
        this.tableObj.getdataListParm.parammaps.beginCreaterDate = ''
        this.tableObj.getdataListParm.parammaps.endCreaterDate = ''
      }


      this.tableObj.getdataListParm.offset = 1
      this.get_table_data()
    },
    form_clear() {
      console.log('点击了重置')

      this.tableObj.getdataListParm.parammaps.customerName = ''
      this.tableObj.getdataListParm.parammaps.contractCode = ''
      this.tableObj.getdataListParm.parammaps.customerId = ''
      this.tableObj.getdataListParm.parammaps.groupId = ''
      this.tableObj.getdataListParm.parammaps.dealerId = ''
      this.tableObj.getdataListParm.parammaps.contractStatus = ''
      this.tableObj.getdataListParm.parammaps.createrId = ''
      this.tableObj.getdataListParm.parammaps.beginContractMoney = ''
      this.tableObj.getdataListParm.parammaps.endContractMoney = ''
      this.tableObj.getdataListParm.parammaps.beginMoneyStep = ''
      this.tableObj.getdataListParm.parammaps.endMoneyStep = ''
      this.tableObj.getdataListParm.parammaps.recordStatus = ''
      this.tableObj.getdataListParm.parammaps.recoveryStatus = ''

      this.tableObj.getdataListParm.parammaps.inputDatetime1 = ''
      this.tableObj.getdataListParm.parammaps.inputDatetime2 = ''
      this.tableObj.getdataListParm.parammaps.inputDatetime3 = ''
      this.tableObj.getdataListParm.parammaps.inputDatetime4 = ''

       this.tableObj.getdataListParm.parammaps.beginContractBeginDate = ''
      this.tableObj.getdataListParm.parammaps.endContractBeginDate = ''
      this.tableObj.getdataListParm.parammaps.beginContractEndDate = ''
       this.tableObj.getdataListParm.parammaps.endContractEndDate = ''
      this.tableObj.getdataListParm.parammaps.beginCreaterDate = ''
      this.tableObj.getdataListParm.parammaps.endCreaterDate = ''
      this.tableObj.getdataListParm.parammaps.beginRecoveryDate = ''
      this.tableObj.getdataListParm.parammaps.endRecoveryDate = ''
      this.tableObj.getdataListParm.offset = 1
      this.get_table_data()


    },

    // 新增
    form_reset() {
      this.create.temp =   {  contractStatus: '',    customerId: '', groupId: '', groupName: '', serviceCode: '', contractBeginDate: parseTime(new Date(), '{y}-{m}-{d}'), contractEndDate: parseTime(new Date(), '{y}-{m}-{d}'), createrId:  Cookies.get('employeid'), createrName:  Cookies.get('employename'),moneyStep: '1',contractMoney: '', businessLicense: -1,picname1: '',fileId:"",fileName:""},

      this.fileList = []

      this.tableStagesList = []
      this.tableStockList = []

      this.imageUrl0 = ""
      this.imageUrl1 = ""
      this.imageUrl2 = ""
      this.imageUrl3 = ""
      this.imageUrl4 = ""
      this.imageUrl5 = ""
      this.imageUrl6 = ""
      this.imageUrl7 = ""
      this.imageUrl8 = ""
      this.imageUrl9 = ""

      this.imageUrlId0 = ""
      this.imageUrlId1 = ""
      this.imageUrlId2 = ""
      this.imageUrlId3 = ""
      this.imageUrlId4 = ""
      this.imageUrlId5 = ""
      this.imageUrlId6 = ""
      this.imageUrlId7 = ""
      this.imageUrlId8 = ""
      this.imageUrlId9 = ""


      this.postDate0 = parseTime(new Date(), '{y}-{m}-{d}')
      this.postDate1 = parseTime(new Date(), '{y}-{m}-{d}')
      this.postDate2 = parseTime(new Date(), '{y}-{m}-{d}')
      this.postDate3 = parseTime(new Date(), '{y}-{m}-{d}')
      this.postDate4 = parseTime(new Date(), '{y}-{m}-{d}')
      this.postDate5 = parseTime(new Date(), '{y}-{m}-{d}')
      this.postDate6 = parseTime(new Date(), '{y}-{m}-{d}')
      this.postDate7 = parseTime(new Date(), '{y}-{m}-{d}')
      this.postDate8 = parseTime(new Date(), '{y}-{m}-{d}')
      this.postDate9 = parseTime(new Date(), '{y}-{m}-{d}')


    },


    //客户失去焦点
    customer_search_blur(item) {
      console.log("客户失去焦点")
      this.tableObj.getdataListParm.parammaps.customerId = ""
      this.tableObj.getdataListParm.parammaps.customerName = ""
      this.customerNameList = []
    },


    //模糊查询客户
    customer_search(queryString, cb) {
      console.log('模糊查询输入值', queryString)
      GetDataByName({ name: 'getCustomerNameFuzzy', page: 1, offset: 1, pagecount: 10, returntype: 'Map', parammaps: { inputvalue: queryString } }).then(response => {
        this.customerNameList = response.data.list
        console.log("客户名称下拉框", response)
        cb(response.data.list)
      })
    },

    //模糊查询客户选择
    change_customer_select(item) {
      console.log('客户名称模糊查询选中值', item)
      this.tableObj.getdataListParm.parammaps.customerId = item.id
      this.tableObj.getdataListParm.parammaps.customerName = item.name
      this.$forceUpdate()
    },

    //清空客户选择
    clear_customer_select(item) {
      document.activeElement.blur()
      this.tableObj.getdataListParm.parammaps.customerId = ""
      this.tableObj.getdataListParm.parammaps.customerName = ""
    },


    //监听 - 集团
    change_group(item) {
      console.log(item)
      console.log(this.create.temp.groupId)
      this.create.temp.groupId = item
      this.create.getdataListParmCust.parammaps.groupId = item

      this.create.temp.customerName = ""
      this.create.temp.customerId = ""
      this.create.customerNameList = []

      this.get_customer_list()
      this.$forceUpdate()

    },
    // 弹窗中的客户
    get_customer_list() {
      GetDataByName(this.create.getdataListParmCust).then(response => {
        if (response.data.list !== null) {
          this.create.customerNameList = response.data.list
          console.log('弹窗中的客户数据', response.data.list)
        } else {
          this.create.customerNameList = []
        }
      })
    },


    //监听 - 下拉中客户名称
    change_customer(item) {
      console.log(item)
      this.create.temp.customerId = item


    },


    // 款项信息表格
    getStagesTableList() {
      GetDataByName(this.create.getdataListParmStages).then(response => {
        if (response.data.list !== null) {
          this.tableStagesList   = response.data.list
          console.log('款项信息表格数据', response.data.list)
        } else {
          this.tableStagesList = []
        }
      })
    },

    // 备货信息表格
    getStockTableList() {
      GetDataByName(this.create.getdataListParmStock).then(response => {
        if (response.data.list !== null) {
          this.tableStockList  = response.data.list
          console.log('备货信息表格数据', response.data.list)
        } else {
          this.tableStockList  = []
        }
      })
    },


    //小表格中的删除单号
    form_deleteCode(item, index) {
      console.log('小表格中的删除单号', item)
      this.tableArrList.splice(index, 1)
      this.stockupIdArr.splice(this.stockupIdArr.indexOf(item.stockupId), 1)
      console.log("stockupIdArr===>", this.stockupIdArr)

    },


    //图片展示
    show_pic1() {
      this.imageIsShow = true
    },


    // 查看
    form_see(row) {


      this.form_reset()

      this.concustomerData.id = row.id
      this.conmoreData.id = row.id


      console.log('点击了查看')

      this.createSee.dialogFormVisible = true


    },


    // 查看
    form_see_nums(row) {


      var send_data = {
          name: 'getContractInvoice',
          returntype: 'Map',
          parammaps: { id: row.id }
      }


      GetDataByName(send_data).then(response => {
        if (response.data.list !== null) {


          for (let i = 0; i < response.data.list.length; i++) {
            var url = process.env.VUE_APP_BASE_API + response.data.list[i].picname
            this.$set(response.data.list[i], 'picname', url )
          }


          this.tableInvocieList    = response.data.list
          console.log('分期图片数据', this.tableInvocieList )
        } else {
          this.tableInvocieList  = []
        }
      })


      this.createSeeNums.dialogFormVisible = true


    },


    // 编辑
    form_edit(row) {


      this.form_reset()

      console.log('点击了编辑', row)

      this.create.temp = Object.assign({}, row)
      this.create.temp.id = row.id

      this.create.getdataListParmCust.parammaps.groupId = row.groupId
      this.get_customer_list()


      this.create.getdataListParmStages.parammaps.id = row.id
      this.getStagesTableList()

      this.create.getdataListParmStock.parammaps.id = row.id
      this.getStockTableList()


      //上传文件的内容

      if(this.create.temp.fileName){
        var urlObj = { "name": this.create.temp.fileName, "url": process.env.VUE_APP_BASE_API + this.create.temp.fileName, "response": { "execresult": { "LastInsertId": this.create.temp.fileId } } }
        this.uploadfileList1 = [urlObj]
      } else {
        this.uploadfileList1 = []
      }


      this.create.temp.picname1 =  process.env.VUE_APP_BASE_API + this.create.temp.picname1


      //发票
      var send_data = {
          name: 'getContractInvoice',
          returntype: 'Map',
          parammaps: { id: row.id }
      }


      GetDataByName(send_data).then(response => {
        if (response.data.list !== null) {
            console.log('分期图片数据', response.data.list )
            if(response.data.list[0].photoId){
              this.imageUrl0 =  process.env.VUE_APP_BASE_API + response.data.list[0].picname
              this.imageUrlId0 = response.data.list[0].photoId
              this.postDate0 = response.data.list[0].postDate
            }
            if(response.data.list[1].photoId){
              this.imageUrl1 =  process.env.VUE_APP_BASE_API + response.data.list[1].picname
              this.imageUrlId1 = response.data.list[1].photoId
              this.postDate1 = response.data.list[1].postDate
            }
            if(response.data.list[2].photoId){
              this.imageUrl2 =  process.env.VUE_APP_BASE_API + response.data.list[2].picname
              this.imageUrlId2 = response.data.list[2].photoId
              this.postDate2 = response.data.list[2].postDate
            }
            if(response.data.list[3].photoId){
              this.imageUrl3 =  process.env.VUE_APP_BASE_API + response.data.list[3].picname
              this.imageUrlId3 = response.data.list[3].photoId
              this.postDate3 = response.data.list[3].postDate
            }
            if(response.data.list[4].photoId){
              this.imageUrl4 =  process.env.VUE_APP_BASE_API + response.data.list[4].picname
              this.imageUrlId4 = response.data.list[4].photoId
              this.postDate4 = response.data.list[4].postDate
            }
            if(response.data.list[5].photoId){
              this.imageUrl5 =  process.env.VUE_APP_BASE_API + response.data.list[5].picname
              this.imageUrlId5 = response.data.list[5].photoId
              this.postDate5 = response.data.list[5].postDate
            }
            if(response.data.list[6].photoId){
              this.imageUrl6 =  process.env.VUE_APP_BASE_API + response.data.list[6].picname
              this.imageUrlId6 = response.data.list[6].photoId
              this.postDate6 = response.data.list[6].postDate
            }
            if(response.data.list[7].photoId){
              this.imageUrl7 =  process.env.VUE_APP_BASE_API + response.data.list[7].picname
              this.imageUrlId7 = response.data.list[7].photoId
              this.postDate7 = response.data.list[7].postDate
            }
            if(response.data.list[8].photoId){
              this.imageUrl8 =  process.env.VUE_APP_BASE_API + response.data.list[8].picname
              this.imageUrlId8 = response.data.list[8].photoId
              this.postDate8 = response.data.list[8].postDate
            }
            if(response.data.list[9].photoId){
              this.imageUrl9 =  process.env.VUE_APP_BASE_API + response.data.list[9].picname
              this.imageUrlId9 = response.data.list[9].photoId
              this.postDate9 = response.data.list[9].postDate
            }


        } else {

        }
      })

      // var imgList = []
      //       if(this.imageUrl0 !== "" || this.imageUrlId0 !== ""){
      //         imgList[0] = {"invoicePhoto":this.imageUrlId0,"postDate":this.postDate0,"invoiceId":this.tableStagesList[0].id}
      //       }
      //       if(this.imageUrl1 !== "" || this.imageUrlId1 !== ""){
      //         imgList[1] = {"invoicePhoto":this.imageUrlId1,"postDate":this.postDate1,"invoiceId":this.tableStagesList[1].id}
      //       }
      //       if(this.imageUrl2 !== "" || this.imageUrlId2 !== ""){
      //         imgList[2] = {"invoicePhoto":this.imageUrlId2,"postDate":this.postDate2,"invoiceId":this.tableStagesList[2].id}
      //       }
      //       if(this.imageUrl3 !== "" || this.imageUrlId3 !== ""){
      //         imgList[3] = {"invoicePhoto":this.imageUrlId3,"postDate":this.postDate3,"invoiceId":this.tableStagesList[3].id}
      //       }
      //       if(this.imageUrl4 !== "" || this.imageUrlId4 !== ""){
      //         imgList[4] = {"invoicePhoto":this.imageUrlId4,"postDate":this.postDate4,"invoiceId":this.tableStagesList[4].id}
      //       }
      //       if(this.imageUrl5 !== "" || this.imageUrlId5 !== ""){
      //         imgList[5] = {"invoicePhoto":this.imageUrlId5,"postDate":this.postDate5,"invoiceId":this.tableStagesList[5].id}
      //       }
      //       if(this.imageUrl6 !== "" || this.imageUrlId6 !== ""){
      //         imgList[6] = {"invoicePhoto":this.imageUrlId6,"postDate":this.postDate6,"invoiceId":this.tableStagesList[6].id}
      //       }
      //       if(this.imageUrl7 !== "" || this.imageUrlId7 !== ""){
      //         imgList[7] = {"invoicePhoto":this.imageUrlId7,"postDate":this.postDate7,"invoiceId":this.tableStagesList[7].id}
      //       }
      //       if(this.imageUrl8 !== "" || this.imageUrlId8 !== ""){
      //         imgList[8] = {"invoicePhoto":this.imageUrlId8,"postDate":this.postDate8,"invoiceId":this.tableStagesList[8].id}
      //       }
      //       if(this.imageUrl9 !== "" || this.imageUrlId9 !== ""){
      //         imgList[9] = {"invoicePhoto":this.imageUrlId9,"postDate":this.postDate9,"invoiceId":this.tableStagesList[9].id}
      //       }


      // // 营业执照
      // const urlArray = []
      // const urlArrayId = []
      // const fileList = []
      // if (this.create.temp.picname1 != undefined) {
      //   urlArray.push(process.env.VUE_APP_BASE_API + this.create.temp.picname1)
      //   urlArrayId.push(this.create.temp.businessLicense)
      // }

      // console.log("urlArray", urlArray)
      // console.log("urlArrayId", urlArrayId)


      // for (let i = 0; i < urlArray.length; i++) {
      //   var urlObj = { "url": "", "response": { "execresult": { "LastInsertId": "" } } }
      //   urlObj.url = urlArray[i]
      //   // this.$set(urlObj, 'url', urlArray[i])
      //   // this.$set(urlObj, 'response', 15)
      //   urlObj.response.execresult.LastInsertId = urlArrayId[i]
      //   fileList.push(urlObj)
      // }

      // this.fileList = fileList

      // console.log("fileList", fileList)


      //document.getElementById('uploadPic').lastChild.style.display = "none"


      this.create.dialogStatus = 'update'
      this.create.dialogFormVisible = true
    },


    // 编辑保存
    form_edit_save() {
      this.isokDisable = true
      setTimeout(() => {
        this.isokDisable = false
      }, 1000)
      this.$refs['temp'].validate(valid => {
        if (valid) {
          this.isokDisable = true
          setTimeout(() => {
            this.isokDisable = false
          }, 1000)


          // if (this.imageUrl0  == "") {
          //   var isEmpty = true
          // } else {
          //   var isEmpty = false
          // }

          if (false) {
            //this.$message({ type: 'error', message: '请上传合同或发票！', duration: 2000 })
          } else {


            var imgList = []
            if(this.imageUrl0 !== "" || this.imageUrlId0 !== ""){
              imgList[0] = {"invoicePhoto":this.imageUrlId0,"postDate":this.postDate0,"invoiceId":this.tableStagesList[0].id}
            }
            if(this.imageUrl1 !== "" || this.imageUrlId1 !== ""){
              imgList[1] = {"invoicePhoto":this.imageUrlId1,"postDate":this.postDate1,"invoiceId":this.tableStagesList[1].id}
            }
            if(this.imageUrl2 !== "" || this.imageUrlId2 !== ""){
              imgList[2] = {"invoicePhoto":this.imageUrlId2,"postDate":this.postDate2,"invoiceId":this.tableStagesList[2].id}
            }
            if(this.imageUrl3 !== "" || this.imageUrlId3 !== ""){
              imgList[3] = {"invoicePhoto":this.imageUrlId3,"postDate":this.postDate3,"invoiceId":this.tableStagesList[3].id}
            }
            if(this.imageUrl4 !== "" || this.imageUrlId4 !== ""){
              imgList[4] = {"invoicePhoto":this.imageUrlId4,"postDate":this.postDate4,"invoiceId":this.tableStagesList[4].id}
            }
            if(this.imageUrl5 !== "" || this.imageUrlId5 !== ""){
              imgList[5] = {"invoicePhoto":this.imageUrlId5,"postDate":this.postDate5,"invoiceId":this.tableStagesList[5].id}
            }
            if(this.imageUrl6 !== "" || this.imageUrlId6 !== ""){
              imgList[6] = {"invoicePhoto":this.imageUrlId6,"postDate":this.postDate6,"invoiceId":this.tableStagesList[6].id}
            }
            if(this.imageUrl7 !== "" || this.imageUrlId7 !== ""){
              imgList[7] = {"invoicePhoto":this.imageUrlId7,"postDate":this.postDate7,"invoiceId":this.tableStagesList[7].id}
            }
            if(this.imageUrl8 !== "" || this.imageUrlId8 !== ""){
              imgList[8] = {"invoicePhoto":this.imageUrlId8,"postDate":this.postDate8,"invoiceId":this.tableStagesList[8].id}
            }
            if(this.imageUrl9 !== "" || this.imageUrlId9 !== ""){
              imgList[9] = {"invoicePhoto":this.imageUrlId9,"postDate":this.postDate9,"invoiceId":this.tableStagesList[9].id}
            }


            imgList.forEach(function(item){
              item.userId = Cookies.get('g_userId')
            })


            var send_data = {
              "common": {"returnmap": "0"},
              "data": [
                {
                  "name": "uploadContractRecord",
                  "type": "e","parammaps": {
                    "fileId": this.create.temp.fileId, //合同原件照片（备案照片）id
                    "fileName": this.create.temp.fileName,
                    "id":this.create.temp.id,
                    "userId":Cookies.get('g_userId')
                  }
                },
                {
                  "name": "uploadContractInvoice",
                  "resultmaps": {
                    "list": imgList
                    },
                  "children": [{
                    "name": "uploadContractInvoice",
                    "type": "e",
                    "parammaps": {
                    "invoicePhoto":  "@uploadContractInvoice.invoicePhoto",
                      "postDate": "@uploadContractInvoice.postDate",
                      "invoiceId": "@uploadContractInvoice.invoiceId",
                      "userId":"@uploadContractInvoice.userId"

                    }
                  }]
                }]
              }


            console.log('编辑保存发送参数', send_data)


              ExecDataByConfig(send_data).then(response => {
                console.log('编辑保存发送参数', this.requestParam)
                if (response.msg !== 'fail') {
                  this.$notify({ title: '成功', message: '保存成功', type: 'success', duration: 2000 })
                  this.create.dialogFormVisible = false
                  this.get_table_data()
                  if(this.isHome == 'home'){
                      // 返回首页
                        this.$router.push({ name: 'Dashboard', params: { isTodo: 'record' }})
                      }
                } else {
                  this.$notify({ title: '失败', message: '保存失败' + response.data, type: 'error', duration: 2000 })
                }
              })


          }


        }
      })
    },


    // 确认回收
    form_sure(row) {
      console.log('点击了撤销', row)
      this.reset_sure()
      this.sure.temp.id = row.id
      this.sure.dialogFormVisible = true
    },
    // 确认回收 - 重置
    reset_sure() {
      this.sure.temp.recoveryDate = ""
    },

    // 确认回收 - 确认
    form_sure_save() {
      this.$refs['suretemp'].validate(valid => {
        if (valid) {


          this.sure.temp.userId = Cookies.get('g_userId')
          var send_data =  {
              name: 'recoveryContract',
              parammaps: this.sure.temp

          }


                 PostDataByName(send_data).then(response => {
                    console.log('确认回收参数', send_data)
                    if (response.msg !== 'fail') {
                      this.$notify({ title: '成功', message: '提交成功', type: 'success', duration: 2000 })
                      this.sure.dialogFormVisible = false
                      this.get_table_data()
                    } else {
                      this.$notify({ title: '失败', message: '提交失败' + response.data, type: 'error', duration: 2000 })
                    }
                  })


        }
      })
    },


    // 撤销
    form_revoke(row) {
      console.log('点击了撤销', row)
      this.reset_revoke()

      this.revoke.temp.id = row.id
      this.revoke.dialogFormVisible = true
    },
    // 撤销 - 重置
    reset_revoke() {
      this.revoke.temp.revokeReason = ""
    },

    // 撤销 - 确认
    form_revoke_save() {
      this.$refs['revoketemp'].validate(valid => {
        if (valid) {
          var send_data =  {
              name: 'revokeRecoveryContract',
              parammaps: this.revoke.temp

          }


            this.$confirm('是否撤销该条记录?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {

                 PostDataByName(send_data).then(response => {
                    console.log('撤销发送参数', send_data)
                    if (response.msg !== 'fail') {
                      this.$notify({ title: '成功', message: '撤销成功', type: 'success', duration: 2000 })
                      this.revoke.dialogFormVisible = false
                      this.get_table_data()
                    } else {
                      this.$notify({ title: '失败', message: '撤销失败' + response.data, type: 'error', duration: 2000 })
                    }
                  })

            }).catch(() => {
              this.$message({
                type: 'info',
                message: '已取消删除'
              });
            });


        }
      })
    },

    dialog_close(){
      this.create.dialogFormVisible = false
      this.get_table_data()
      if(this.isHome == 'home'){
       // 返回首页
       this.$router.push({ name: 'Dashboard', params: { isTodo: 'record' }})
      }
    },


    dialog_close_see(){
      this.createSee.dialogFormVisible = false
      this.conmoreData.id = ""
      this.get_table_data()
      if(this.isHome == 'home'){
       // 返回首页
       this.$router.push({ name: 'Dashboard', params: { isTodo: 'record' }})
      }
    },


    // 导出
    form_export(item) {

       this.download.getdataListParm.parammaps = this.tableObj.getdataListParm.parammaps

       GetDataByName(this.download.getdataListParm).then(response => {
         if (response.data.list !== null) {
           this.download.list = response.data.list
         } else {
           this.download.list = []
         }
         var excelDatas = [
           {
             tHeader: ['序号', '合同编号', '备案状态', '回收状态', '已开发票数', '客户名称', '客户集团', '经销商', '合同金额（元）', '款项分期', '合同开始时间', '合同结束时间', '创建人', '创建时间', '备注'],
             filterVal: ['sort', 'contractCode', 'recordStatus', 'recoveryStatus', 'invoiceNums', 'customerName', 'groupName','dealerName ', 'contractMoney', 'moneyStep', 'contractBeginDate', 'contractEndDate', 'createrName', 'createrDate', 'remark'],
             tableDatas: this.download.list,
             sheetName: 'Sheet1'
           }
         ]
         json2excel(excelDatas, '合同信息', true, 'xlsx')
       })

     },

    // 导入
    form_inport() {
      console.log('点击了导入')
    }

  }
}
</script>
<style lang="scss" scoped>
.search {
  padding-top: 10px;
  clear: both;
}
.table {
  margin-top: 10px;
}

#uploadPic {
  width: 700px;
}


 .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }

// #uploadPic .el-upload-list--picture-card .el-upload-list__item {
//   width: 70px;
//   height: 70px;
// }
// #uploadPic .el-upload--picture-card {
//   width: 70px;
//   height: 70px;
//   line-height: 70px;
// }
// #uploadPic .hide .el-upload--picture-card {
//   display: none;
// }

// // 查看 隐藏删除
// #uploadPicSee {
//   height: 70px;
// }
// #uploadPicSee .el-upload-list--picture-card .el-upload-list__item {
//   width: 70px;
//   height: 70px;
// }
// #uploadPicSee .el-upload--picture-card {
//   width: 70px;
//   height: 70px;
//   line-height: 70px;
// }
// #uploadPicSee
//   .el-upload-list--picture-card
//   .el-upload-list__item-actions
//   .el-upload-list__item-delete {
//   display: none;
// }

/deep/ .el-input.is-disabled .el-input__inner {color: #000000!important;}
/deep/ .el-textarea.is-disabled .el-textarea__inner {color: #000000!important;}
/deep/ .el-radio__input.is-disabled+span.el-radio__label {color: #000000!important;}
/deep/ .el-checkbox__input.is-disabled+span.el-checkbox__label { color: #000000!important;}

</style>
