<!-- 合同 -->
<template>
  <div class="context">
    <div style="text-align: right;margin-bottom: 20px;">
      <el-button type="primary" @click="newcontract = !newcontract">
        新增合同
      </el-button> 
    </div>
    <div>
      <el-table
        :data="tableData"
        border
        size='small'
        :header-cell-style="{'text-align':'center'}"
        :cell-style="{'text-align':'center'}"
        style="width: 100%;">
        <el-table-column
        type="index"
        label="序号"
        width="50">
        </el-table-column>
        <el-table-column
        prop="hetong"
        label="合同名称"
        width="200">
        </el-table-column>
        <el-table-column
        prop="kehu"
        label="客户名称"
        width="">
        </el-table-column>
        <el-table-column
        prop="jiner"
        label="合同金额"
        width="80">
        </el-table-column>
        <el-table-column
        prop="signing_time"
        label="签约时间"
        width="100">
        </el-table-column>
        <el-table-column
        prop="caozuo"
        label="签约人"
        width="80">
        </el-table-column>
        <el-table-column
        prop="examine"
        label="审核人"
        width="80">
        </el-table-column>
        <el-table-column
        prop="address"
        label="操作"
        width="">
        <template slot-scope="scope">
          <el-button type="primary" @click="cahkan_click(scope.row)">查看</el-button>
          <span v-if="scope.row.examine ==''" style="display: inline-block;margin-left:10px ;">
            <el-button type="primary" @click="edit_open(scope.row)">修改</el-button>
            <el-button type="danger" @click="delet_open(scope.row)">删除</el-button>
          </span>
          <span v-else style="display: inline-block;margin-left:10px ;">
            <el-button type="primary" @click="Download_word(scope.row)">word下载</el-button>
            <el-button type="primary" @click="Download_pdf(scope.row)">pdf下载</el-button>
          </span>
        </template>
        </el-table-column>
      </el-table>
    </div>

     <!-- 弹窗 -->
     <div>
      <!-- 新增 -->
      <el-dialog
        title="新增合同"
        :visible.sync="newcontract"
        :modal-append-to-body="true"
        width="60%"
        >
        <div style="height: 50vh;overflow: overlay;">
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span>合同编码：</span>
              <el-input v-model="contraobj.code" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
            <div style="flex: 1;">
              <span>合同名称：</span>
              <el-input v-model="contraobj.name" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span>客户名称：</span>
              <el-input v-model="contraobj.customer_name" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
            <div style="flex: 1;">
              <span>合同金额：</span>
              <el-input v-model="contraobj.sumamt" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span>合同开始时间：</span>
              <el-date-picker
                v-model="contraobj.start_time"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </div>
            <div style="flex: 1;">
              <span>合同结束时间：</span>
              <el-date-picker
                v-model="contraobj.end_time"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </div>
           
          </div>
          <div class="xinxi">
            <div style="flex: 1;">
              <span>签约人员：</span>
              <el-input v-model="contraobj.signing_per" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
            <div style="flex: 1;"></div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
                <span style="display: inline-block;">word文件：</span>
                <el-upload
                  :data='uploadData'
                  class="upload-demo"
                  action="https://upload.qiniup.com"
                  :on-success="handleAvatarSuccess"
                  :before-upload="beforeAvatarUpload"
                  :limit="1"
                  :file-list="fileList"
                >
                  <el-button size="small" type="primary" >点击上传</el-button>
                  <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                </el-upload>
                <el-button type="text" @click="preview_word = true">预览</el-button>
                <el-button type="text" @click="word_Download">下载</el-button>
                <el-dialog
                  title="word文件预览"
                  :visible.sync="preview_word"
                  width="50%"
                  :append-to-body="true"
                >
                  <div>
                    <vue-office-docx 
                      :src="contraobj.word_file_url"
                      style="height: 400px;width: 100%;"
                      @rendered="rendered"/>
                  </div>
                  <span slot="footer" class="dialog-footer">
                    <el-button @click="preview_word = false">取 消</el-button>
                    <el-button type="primary" @click="preview_word = false">确 定</el-button>
                  </span>
                </el-dialog>
               
            </div>
            <div style="flex: 1;">
              <span>pdf文件：</span>
              <!-- <el-input v-model="contraobj.pdf_file_url" placeholder="请输入内容" style="width: 150px;"></el-input> -->
                <el-upload
                  :data='uploadData'
                  class="upload-demo"
                  action="https://upload.qiniup.com"
                  :on-success="handleAvatarSuccess2"
                  :before-upload="beforeAvatarUpload"
                  :limit="1"
                  :file-list="fileList"
                >
                  <el-button size="small" type="primary" >点击上传</el-button>
                  <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                </el-upload>
                <el-button type="text" @click="preview_pdf = true">预览</el-button>
                <el-button type="text" @click="pdf_Download">下载</el-button>
                <el-dialog
                  title="pdf文件预览"
                  :visible.sync="preview_pdf"
                  width="50%"
                  :append-to-body="true"
                >
                  <div>
                    <vue-office-pdf 
                      :src="contraobj.pdf_file_url"
                      style="height: 400px;width: 100%;"
                    />
                  </div>
                  <span slot="footer" class="dialog-footer">
                    <el-button @click="preview_pdf = false">取 消</el-button>
                    <el-button type="primary" @click="preview_pdf = false">确 定</el-button>
                  </span>
                </el-dialog>
            </div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span style="position: relative;bottom: 20px;left: 0;">
                  备注：
              </span>
              <el-input type="textarea" :row="2" v-model="contraobj.remark" placeholder="请输入内容" style="width: 80%;"></el-input>
            </div>
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="newcontract = false">取 消</el-button>
          <el-button type="primary" @click="contra_add">确 定</el-button>
        </span>
      </el-dialog>
      <!-- 查看 -->
      <el-dialog title="查看合同" :visible.sync="view_dialog"
        :modal-append-to-body="false" width="60%"
       >
        <div style="height: 50vh;overflow: overlay;">
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span>合同编码：</span>
              <el-input v-model="contraview.code" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
            <div style="flex: 1;">
              <span>合同名称：</span>
              <el-input v-model="contraview.name" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span>客户名称：</span>
              <el-input v-model="contraview.customer_name" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
            <div style="flex: 1;">
              <span>合同金额：</span>
              <el-input v-model="contraview.sumamt" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span>合同开始时间：</span>
              <el-date-picker
                v-model="contraview.start_time"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </div>
            <div style="flex: 1;">
              <span>合同结束时间：</span>
              <el-date-picker
                v-model="contraview.end_time"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </div>
          </div>
          <div class="xinxi">
            <div style="flex: 1;">
              <span>签约人员：</span>
              <el-input v-model="contraview.signing_per" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
            <div style="flex: 1;"></div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
                <span>word文件：</span>
                 <span>{{ contraview.docx_name }}</span>&nbsp;&nbsp; 
                <el-button type="text" @click="preview_word2 = true">预览</el-button>
                <el-dialog
                  title="word文件预览"
                  :visible.sync="preview_word2"
                  width="50%"
                  :append-to-body="true"
                >
                  <div>
                    
                    <vue-office-docx 
                      :src="contraview.word_file_url"
                      style="height: 400px;width: 100%;"
                      @rendered="rendered"/>
                  </div>
                  <span slot="footer" class="dialog-footer">
                    <el-button @click="preview_word2 = false">取 消</el-button>
                    <el-button type="primary" @click="preview_word2 = false">确 定</el-button>
                  </span>
                </el-dialog>
                <!-- <el-input v-model="contraview.word_file_url" placeholder="请输入内容" style="width: 150px;"></el-input> -->
            </div>
            <div style="flex: 1;">
              <span>pdf文件：</span>
              <span>{{ contraview.pdf_name }}</span>&nbsp;&nbsp;
              <el-button type="text" @click="preview_pdf2 = true">预览</el-button>
              <el-dialog
                title="pdf文件预览"
                :visible.sync="preview_pdf2"
                width="50%"
                :append-to-body="true"
              >
                <div>
                  <vue-office-pdf 
                    :src="contraview.pdf_file_url"
                    style="height: 400px;width: 100%;"
                  />
                </div>
                <span slot="footer" class="dialog-footer">
                  <el-button @click="preview_pdf2 = false">取 消</el-button>
                  <el-button type="primary" @click="preview_pdf2 = false">确 定</el-button>
                </span>
              </el-dialog>
              <!-- <el-input v-model="contraview.pdf_file_url" placeholder="请输入内容" style="width: 150px;"></el-input> -->
            </div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span style="position: relative;bottom: 20px;left: 0;">
                  备注：
              </span>
              <el-input type="textarea" :row="2" v-model="contraview.remark" placeholder="请输入内容" style="width: 80%;"></el-input>
            </div>
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="view_dialog = false">取 消</el-button>
          <el-button type="primary" @click="view_dialog = false">确 定</el-button>
        </span>
      </el-dialog>
      <!-- 修改 -->
      <el-dialog title="编辑合同" :visible.sync="edit_dialog"
        :modal-append-to-body="false" width="60%"
       >
        <div style="height: 50vh;overflow: overlay;">
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span>合同编码：</span>
              <el-input v-model="contraview.code" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
            <div style="flex: 1;">
              <span>合同名称：</span>
              <el-input v-model="contraview.name" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span>客户名称：</span>
              <el-input v-model="contraview.customer_name" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
            <div style="flex: 1;">
              <span>合同金额：</span>
              <el-input v-model="contraview.sumamt" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span>合同开始时间：</span>
              <el-date-picker
                v-model="contraview.start_time"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </div>
            <div style="flex: 1;">
              <span>合同结束时间：</span>
              <el-date-picker
                v-model="contraview.end_time"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </div>
          </div>
          <div class="xinxi">
            <div style="flex: 1;">
              <span>签约人员：</span>
              <el-input v-model="contraview.signing_per" placeholder="请输入内容" style="width: 60%;"></el-input>
            </div>
            <div style="flex: 1;"></div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
                <span style="display: inline-block;">word文件：</span>
                <el-upload
                  :data='uploadData'
                  class="upload-demo"
                  action="https://upload.qiniup.com"
                  :on-success="handleAvatarSuccess3"
                  :before-upload="beforeAvatarUpload"
                  :limit="1"
                  :file-list="fileList_word"
                >
                  <el-button size="small" type="primary" >点击上传</el-button>
                  <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                </el-upload>
                <el-button type="text" @click="preview_word3 = true">预览</el-button>
                <el-button type="text" @click="word_Download2">下载</el-button>
                <el-dialog
                  title="word文件预览"
                  :visible.sync="preview_word3"
                  width="50%"
                  :append-to-body="true"
                >
                  <div>
                    <!-- .split(',')[1] -->
                    <vue-office-docx 
                      :src="contraview.word_file_url"
                      style="height: 400px;width: 100%;"
                      @rendered="rendered"/>
                  </div>
                  <span slot="footer" class="dialog-footer">
                    <el-button @click="preview_word3 = false">取 消</el-button>
                    <el-button type="primary" @click="preview_word3 = false">确 定</el-button>
                  </span>
                </el-dialog>
               
            </div>
            <div style="flex: 1;">
              <span>pdf文件：</span>
              <!-- <el-input v-model="contraobj.pdf_file_url" placeholder="请输入内容" style="width: 150px;"></el-input> -->
                <el-upload
                  :data='uploadData'
                  class="upload-demo"
                  action="https://upload.qiniup.com"
                  :on-success="handleAvatarSuccess4"
                  :before-upload="beforeAvatarUpload"
                  :limit="1"
                  :file-list="fileList_pdf"
                >
                  <el-button size="small" type="primary" >点击上传</el-button>
                  <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                </el-upload>
                <el-button type="text" @click="preview_pdf3 = true">预览</el-button>
                <el-button type="text" @click="pdf_Download2">下载</el-button>
                <el-dialog
                  title="pdf文件预览"
                  :visible.sync="preview_pdf3"
                  width="50%"
                  :append-to-body="true"
                >
                  <div>
                    <vue-office-pdf 
                      :src="contraview.pdf_file_url"
                      style="height: 400px;width: 100%;"
                    />
                  </div>
                  <span slot="footer" class="dialog-footer">
                    <el-button @click="preview_pdf3 = false">取 消</el-button>
                    <el-button type="primary" @click="preview_pdf3 = false">确 定</el-button>
                  </span>
                </el-dialog>
            </div>
          </div>
          <div class="xinxi"  style="">
            <div style="flex: 1;">
              <span style="position: relative;bottom: 20px;left: 0;">
                  备注：
              </span>
              <el-input type="textarea" :row="2" v-model="contraview.remark" placeholder="请输入内容" style="width: 80%;"></el-input>
            </div>
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="edit_dialog = false">取 消</el-button>
          <el-button type="primary" @click="edit_click">确 定</el-button>
        </span>
      </el-dialog>
      <!-- 删除 -->
      <el-dialog
        title="提示"
        :visible.sync="dele_dialog"
        width="30%">
        <span>确认删除该数据</span>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dele_dialog = false">取 消</el-button>
          <el-button type="primary" @click="delete_click">确 定</el-button>
        </span>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import {getcontractadd,getcontractget,getcontractlist,getcontractdelete,getcontractedit} from '../../../api/index'
import VueOfficeDocx from '@vue-office/docx'
import VueOfficePdf from '@vue-office/pdf'
import exportFile from '@/utils/exportFile'
import { uParseTime } from "@/utils/tools";
import '@vue-office/docx/lib/index.css'
  export default{
    props:{
      Message:Object
    },
    components:{
      VueOfficeDocx,
      VueOfficePdf
    },
    data(){
      return{
        input:'',
        textarea:'',
        value1:'',
        tableData: [],
        shenhe:1,
        newcontract:false,
        contract:false,
        view_dialog:false,
        edit_dialog:false,
        docx_name:'',
        pdf_name:'',
        contraobj:{
          code:'',
          name:'',
          sumamt:'',
          customer_name:'',
          start_time:this.getTime(new Date()),
          end_time:this.getTime(new Date()),
          signing_per:'',
          word_file_url:'',
          pdf_file_url:'',
          remark:'',
          docx_name:'',
          pdf_name:'',
          fileList_word:[{name:'',url:''}],
          fileList_pdf:[{name:'',url:''}],
        },
        contraview:{
          code:'',
          name:'',
          sumamt:'',
          customer_name:'',
          start_time:this.getTime(new Date()),
          end_time:this.getTime(new Date()),
          signing_per:'',
          word_file_url:'',
          pdf_file_url:'',
          remark:'',
          docx_name:'',
          pdf_name:'',
          fileList_word:[],
          fileList_pdf:[],
        },
        fileList:[],
        fileList_word:[{name:'',url:''}],
        fileList_pdf:[{name:'',url:''}],
        uploadData: { token: '', key: '' },
        qiniuDomain: 'https://images.shengws.com/',
        num:0,
        preview_word:false,
        preview_word2:false,
        preview_word3:false,
        preview_pdf:false,
        preview_pdf2:false,
        preview_pdf3:false,
        editor_id:0,
        dele_dialog:false,
        delete_id:0,
      }
    },
    created(){
      this.getlist()
    },
    methods:{
      // 查看弹窗
      cahkan_click(row){
        console.log('22222222',row);
        // this.contract = true
        this.view_dialog = true
        getcontractget(row.id).then(res =>{
          const response = res.data.charge_contract
          if(response.word_file_url!=''){
            var word = response.word_file_url.split(',')
            var word1 =word[0]
            var word2 =word[1]
          }
          if(response.pdf_file_url !=''){
            var pdf = response.pdf_file_url.split(',')
            var pdf1 = pdf[0]
            var pdf2 = pdf[1]
          }
          
          this.contraview={
            code:response.code,
            name:response.name,
            sumamt:response.sumamt,
            customer_name:response.custom_name,
            start_time:response.start_time,
            end_time:response.end_time,
            signing_per:response.signing_person,
            // word_file_url:response.word_file_url,
            word_file_url:word2,
            pdf_file_url:pdf2,
            // pdf_file_url:response.pdf_file_url,
            docx_name:word1,
            pdf_name:pdf1,
            remark:response.remark,
          }
          console.log('222221111',res);
        })
      },
      // 新增确认
      contra_add(){
        const contra = this.contraobj
        const data = {
          custom_id:this.Message.id,
          code:contra.code,
          name:contra.name,     
          custom_name:contra.customer_name,
          sumamt:contra.sumamt,
          start_time:contra.start_time,
          end_time:contra.end_time,
          signing_person:contra.signing_per,
          word_file_url:contra.word_file_url,
          pdf_file_url:contra.pdf_file_url,
          remark:contra.remark,
        }
        
        getcontractadd(data).then(res =>{
          console.log('111111133333',res);
          this.getlist()
          this.newcontract = false
        })
        
      },
      //修改
      edit_open(row){
        this.edit_dialog = true
        this.editor_id = row.id
        getcontractget(row.id).then(res =>{
          console.log('222221111wwww',res);
          const response = res.data.charge_contract
          if(response.pdf_file_url !=''){
            const pdf = response.pdf_file_url.split(',')
            var pdf_name = pdf[0]
            var pdf_url = pdf[1]
          }
          if(response.word_file_url !=''){
            const word = response.word_file_url.split(',')
            var word_name = word[0]
            var word_url = word[1]
          }
          // console.log('cccccc',word,pdf);
          this.contraview={
            code:response.code,
            name:response.name,
            sumamt:response.sumamt,
            customer_name:response.custom_name,
            start_time:response.start_time,
            end_time:response.end_time,
            signing_per:response.signing_person,
            word_file_url:word_url,
            
            pdf_file_url:pdf_url,
            remark:response.remark,
          }
         
          this.fileList_pdf[0].name= pdf_name
          this.fileList_pdf[0].url = pdf_url
         
          this.fileList_word[0].name = word_name
          this.fileList_word[0].url = word_url
          console.log('cccccc',this.contraview,this.fileList_pdf,this.fileList_word);
        })
      },
      // 修改确认
      edit_click(){
        const verify = this.contraview
        // const data ={}
        // data[]
        const data={
          id:this.editor_id,
          code: verify.code,
          name:verify.name,
          custom_name:verify.customer_name,
          sumamt:verify.sumamt,
          start_time:verify.start_time,
          end_time:verify.end_time,
          signing_person:verify.signing_per,
          word_file_url:verify.word_file_url,
          pdf_file_url:verify.pdf_file_url,
          remark:verify.remark,
        }
        getcontractedit(data).then(res =>{
          console.log('mmmmmmmmm',res);
          this.getlist()
          this.edit_dialog = false
        })
      },
      // 删除
      delet_open(row){
        this.dele_dialog = true
        this.delete_id =row.id
      },
      // 删除确认
      delete_click(){
        getcontractdelete(this.delete_id).then(res =>{
          this.$message({message:res.data.msg,type:'success'})
          console.log('res',res);
          this.dele_dialog = false
          this.getlist()
        })
      },
      // 数据源
      getlist(){
        getcontractlist().then(res =>{
          const list = res.data.list
          const table = []
          
          list.forEach((item,index) => {
            if(item.is_check==1){
              const arr={
                id:item.id,
                index:index+1,
                hetong:item.name,
                kehu:item.custom_name,
                jiner:item.sumamt,
                signing_time:item.start_time,
                caozuo:item.signing_person,
                examine:item.check_person
              }
              table.unshift(arr)
            }
          });
          this.tableData = table
          console.log('nnnnnn合同',res);
        })
      },
      // 转换时间
      getTime(val) {
        if(val < 0){
          return ""
        }
        if(val == ""){
          return ""
        }else {
          return uParseTime(val, '{y}-{m}-{d}')
        }
      },
      // 上传前
      beforeAvatarUpload(file){
        const FileExt = file.name.replace(/.+\./, "")
        // const isJPG = fileType.indexOf('image') > -1
        const isLt2M = file.size / 1024 / 1024 < 5
        console.log('cccccc',FileExt);
        var date = new Date()
        var key =
          date.getFullYear() +
          '/' +
          (date.getMonth() + 1) +
          '/' +
          date.getDate() +
          '/' +
          date.getHours() +
          '/' +
          date.getMinutes() +
          '/' +
          date.getSeconds() +
          '/' +
          '_s_' +
          file.uid +
          '.' +
          FileExt
        const _self = this
        const token = "-l_Pcc1YJs0gh3w0YwN2uoaZO_5fY5J9SIYnSjg0:u_WcCKb426lS-4RuKGgRfD32xOg=:eyJzY29wZSI6InN5aGNsdWItc3RvcmFnZSIsImRlYWRsaW5lIjoxNzE4MzMzNjgxLCJyZXR1cm5Cb2R5Ijoie1widXJsXCI6XCIkKGtleSlcIixcImhhc2hcIjpcIiQoZXRhZylcIixcInN0YXRlXCI6XCJTVUNDRVNTXCJ9In0="
        // const token = "-l_Pcc1YJs0gh3w0YwN2uoaZO_5fY5J9SIYnSjg0:Z_J9cGOKTCqsWQlaftl4o8DCRNM=:eyJzY29wZSI6InN5aGNsdWItc3RvcmFnZSIsImRlYWRsaW5lIjoxNzE1MzMwNjgxLCJyZXR1cm5Cb2R5Ijoie1widXJsXCI6XCIkKGtleSlcIixcImhhc2hcIjpcIiQoZXRhZylcIixcInN0YXRlXCI6XCJTVUNDRVNTXCJ9In0="
              _self._data.uploadData.token = token
              _self._data.uploadData.key = key
        console.log('file',file);
        // return new Promise((resolve, reject) => {
        //   getToken()
        //     .then(response => {
        //       const token = response.data.data.uptoken
        //       _self._data.uploadData.token = token
        //       _self._data.uploadData.key = key
        //       resolve(true)
        //     })
        //     .catch(err => {
        //       console.log(err)
        //       reject(false)
        //       this.loading.close()
        //     })
        // })
      },
      // 上传成功
      handleAvatarSuccess(res, file){
        // this.contraview.docx_name = file.name
        const name = file.name
        this.contraobj.word_file_url = name+','+ this.qiniuDomain + res.url 
        // this.docx = this.qiniuDomain + res.url 
        console.log('errs333',file);
        const filelist_w =[]
        const filelist_p =[]
        const arr={
          name:this.contraview.docx_name,
          url:this.contraobj.word_file_url
        }
        filelist_w.push(arr)
          this.contraview.fileList_word = filelist_w
        // fileList_word
        // exportFile.getImgURLs(this.docx,'签约合同('+num+')')
      },
      handleAvatarSuccess2(res, file){
        this.pdf_name = file.name
        const name = file.name
        this.contraobj.pdf_file_url =name+','+ this.qiniuDomain + res.url 
        // this.pdf = this.qiniuDomain + res.url 
        console.log('errs',this.contraobj.pdf_file_url);
        // exportFile.getImgURLs(this.docx,'签约合同('+num+')')
      },
      // 修改上传成功word
      handleAvatarSuccess3(res, file){
        const name = file.name
        this.docx_name = file.name
        this.contraview.word_file_url =name +','+ this.qiniuDomain + res.url 
        // this.docx = this.qiniuDomain + res.url 
        console.log('errs333',file,this.contraview.word_file_url);
       
        // exportFile.getImgURLs(this.docx,'签约合同('+num+')')
      },
      // 修改上传成功pdf
      handleAvatarSuccess4(res, file){
        this.pdf_name = file.name
        const name = file.name
        this.contraview.pdf_file_url =name+','+ this.qiniuDomain + res.url 
        // this.pdf = this.qiniuDomain + res.url 
        console.log('errs',this.contraview.pdf_file_url);
        // exportFile.getImgURLs(this.docx,'签约合同('+num+')')
      },
      // 下载word文档
      word_Download(){
        // const num= this.num
        // console.log('uuuuuuu',this.contraobj.word_file_url);
        // if(num == 0){
        //   console.log('uuuuuuu',this.num);
          exportFile.getImgURLs(this.contraobj.word_file_url,'签约合同')
        // }else{
        //   exportFile.getImgURLs(this.contraobj.word_file_url,'签约合同('+num+')')
        // }
        // this.num++
        // var file = new File(["Hello, world!"], "hello world.txt", {type: "text/plain;charset=utf-8"});
      },
      // 下载pdf文件
      pdf_Download(){
          exportFile.getImgURLs(this.contraobj.pdf_file_url,'签约合同')
      },
      // 修改弹窗下载word文档
      word_Download2(){
        exportFile.getImgURLs(this.contraview.word_file_url,'签约合同')
      },
      // 下载pdf文件
      pdf_Download2(){
        exportFile.getImgURLs(this.contraview.pdf_file_url,'签约合同')
      },
     
      // 表格操作的下载word
      Download_word(row){
        getcontractget(row.id).then(res =>{
          const word = res.data.charge_contract
          if(word.word_file_url==''){
            this.$message({message:'没有上传的合同路径',type:'error'})
          }else{
            const url =res.data.charge_contract.word_file_url.split(',')[1]  
            exportFile.getImgURLs(url,word.custom_name+word.name+'签约合同')
            console.log('rowsds',url);
          }
          
        })
      },
      // 表格操作的下载pdf
      Download_pdf(row){
        getcontractget(row.id).then(res =>{
          var pdf = res.data.charge_contract
          console.log('pdf_url',pdf);
          const pdf_url = pdf.pdf_file_url
          if(pdf_url ==''){
              this.$message({message:'没有上传的合同路径',type:'error'})
          }else{
            const url = pdf.pdf_file_url.split(',')[1]
            exportFile.getImgURLs(url,pdf.custom_name+pdf.name+'合同')
            console.log('rowsds',url);
          }
        })
      },
      rendered(){

      }
    }
  }
</script>
<style lang="scss" scoped>
  .context{
    padding: 20px 0;
    .xinxi{
      display: flex;
      margin-bottom: 15px;
    }
  }

</style>