<template>
  <div>
    <TitleWithCircle title="模版" style="margin-bottom: 20px;" />
    <el-form :model="mbinfo" :rules="rulesmbinfo" ref="rulesmbinfoForm" label-width="130px" class="demo-ruleForm">
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="模板" prop="type">
            <el-select filterable v-model="mbinfo.type" placeholder="请选择" style="width: 100%;" @change="changeRelatedMerchants">
              <el-option :label="item.templateName" :value="index" v-for="(item,index) in mbData" :key="index"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <TitleWithCircle title="合同信息" style="margin-bottom: 20px;" />
    <mbadd v-if="isshow" ref="rulesallForm" :list1="list1" />
    <div style="margin-top: 20px;margin-left: 65px;">
      <el-button @click="close()" class="buttonHover" style="color: #606266;border: 1px solid #DBDBDB;background-color: #fff;">取消</el-button>
      <el-button @click="add()" style="background-color: #3F9B6A;color: #fff;">确定</el-button>
      <el-button @click="ylht()" style="background-color: #3F9B6A;color: #fff;">预览</el-button>
    </div>
  </div>
</template>
<script>
  import TitleWithCircle from '@/components/top/index';
  import mbadd from '@/components/change/mbadd';
  import {contractinsertAdd} from '@/api/manage.js'
  import {
    cereContractTemplate,cerePlatformMerchant
  } from '@/api/newly.js'
  import {
    dataInprotDocument
  } from '@/api/newly.js'
import { add } from '@/api/activityBz';
  export default {
    components: {
      TitleWithCircle,
      mbadd
    },
    data() {
      return {
        mbinfo:{
          type:''
        },
        onmbinfo:{},
        mbData:[],
        list1: [],
        rulesmbinfo:{
          type: [{
            required: true,
            message: '请选择模板',
            trigger: 'change'
          }],
        },
        isshow: false,
        formInline: {
          // 合同类型
          contractType: '',
          // 合同编号
          contractNumber: '',
          // 标段号
          sectionNumber: '',
          // 合同名称
          contractName: '',
          // 押金
          earnestMoney: '',
          // 合同签订日期
          contractSigningDate: '',
          // 合同终止日期
          contractTerminationDate: '',
          // 起租日期
          leaseStartDate: '',
          // 付款周期
          paymentCycle: '',
          // 合同金额（租金）
          contractAmount: '',
          // 付款日
          paymentDay: '',
          // 承租人名称
          tenantName: '',
          // 承租人联系电话
          tenantTelephone: '',
          // 承租人银行账号
          tenantBankAccount: '',
          // 关联商家
          relatedMerchants: '',
          // 商铺编号(绑定资源)
          shopNumber: '',
          // 合同附件
          appendicesContract: '',
          //合同状态
          dataStatus: '1',
          //模版信息
          templateInformation:''
        },
      }
    },
    async created() {
      this.getmb()
    },
    methods: {
      async add() {
        let ismb = false
        await this.$refs.rulesmbinfoForm.validate((valid) => {
          if (valid) {
            ismb = true
            

          } else {
            this.$message({
              message: '请填写完整信息',
              type: 'error'
            })
            ismb = false
          }
        })
        let isjx = await this.$refs.rulesallForm.yanzhen()
        console.error(ismb,isjx)
        if(ismb && isjx) {
          console.error(']]]]]')
          this.addinfo()
        }
      },
      close() {
        this.$emit('removeonaction', '1')
      },
      async addinfo(){
        let info1 = {}
        for (let index = 0; index < this.list1.length; index++) {
          const element = this.list1[index];
          console.error({...element})
          if(element.type == '资源') {
            if(element.value && typeof element.value == 'object') {
              if (element.value.shopName) {
                info1.shopNumber = 'sp' + element.value.id
              } else if (element.value.advertisingType) {
                info1.shopNumber = 'gg' + element.value.id
              } else {
                info1.shopNumber = 'cd' + element.value.id
              }
            }
          }else if(element.type == '商家') {
            info1.relatedMerchants = element.value
          } else{
            info1[element.key] = element.value+''
          }
          
        }
        console.error(info1)
        for (let key in info1) {
          if (this.formInline.hasOwnProperty(key)) {
            this.formInline[key] = info1[key];
          }
        }
        this.formInline.templateInformation = JSON.stringify(this.list1)
        let info = await this.culfj()
        console.error(info)
        // return
        let c1 =  {
          documentAddress: "http://172.16.61.237:9000" + this.onmbinfo.templateAttachment,
          insertData: JSON.stringify(info)
        }
        dataInprotDocument(c1).then(res => {
          console.error(res)
          if(res.code == 200 && res.data) {
            this.formInline.appendicesContract = res.data
            contractinsertAdd({
              ...this.formInline,
              createDate:this.updateCurrentTime(),
              createUser: localStorage.getItem('roleName')
            }).then(res => {
              console.error(res)
              if (res.code == 200) {
                this.$message({
                  message: '添加成功',
                  type: 'success'
                })
                this.$emit('removeonaction', '1')
              } else {
                this.$message({
                  message: res.msg,
                  type: 'error'
                })
              }
            })
          } else {
            this.$message({
              type: 'error',
              message: '附件生成失败'
            })

          }
        })
        console.error({...this.formInline})
      },
      changeRelatedMerchants(e) {
        console.error(e)
        this.isshow = false
        console.error(this.mbData[e])
        this.onmbinfo = this.mbData[e]
        //判断是否是字符串
        if (typeof this.mbData[e].otherInfo == 'string') {
          this.list1 = JSON.parse(this.mbData[e].otherInfo)
        } else {
          this.list1 = this.mbData[e].otherInfo
        }
        //延迟2秒
        setTimeout(() => {
          this.isshow = true
        }, 100)
      },
      async getmb() {
        const res = await cereContractTemplate({ pageNumber: 0,pageSize: 100})
        this.mbData = res.data.content
      },
      async culfj(){
        let info = {}
        for (let index = 0; index < this.list1.length; index++) {
          const element = this.list1[index];
          // console.error({...element})
          if(element.type == '资源') {
            if(element.value && typeof element.value == 'object') {
              info['资源名称'] =''+ element.value.shopName?element.value.shopName:element.value.advertisingName?element.value.advertisingName:element.value.venueName?element.value.venueName:'暂无'
              info['资源类型'] = ''+ element.value.shopName?'商铺':element.value.advertisingType?element.value.advertisingType:element.value.venueName?'场地':'暂无'
              info['详细地址'] = element.value.detailedLocation?element.value.detailedLocation:'暂无'
              info['实际使用面积'] = element.value.actualArea?element.value.actualArea:element.value.actualUsableArea?element.value.actualUsableArea:'暂无'
            } else {
              info['资源名称'] = '暂无'
              info['资源类型'] = '暂无'
              info['详细地址'] = '暂无'
              info['实际使用面积'] = '暂无'
            }
          } else if(element.type == '商家') {
            if(element.value){
              await cerePlatformMerchant({
                checkState: '2',
                pageNumber: 0,
                pageSize: 1000,
                id: element.value
              }).then(res => {
                console.error(res)
                info[element.name] = res.data.content.length>0?res.data.content[0].name:'暂无'
              })
            } else {
              info[element.name] = '暂无'
            }
            
          } else{
            info[element.name] = element.value?element.value+'':'暂无'
          }
          
        }
        return info
      },
      async ylht(){
        let info = await this.culfj()
        console.error(info)
        let c1 =  {
          documentAddress: "http://172.16.61.237:9000" + this.onmbinfo.templateAttachment,
          insertData: JSON.stringify(info)
        }
        dataInprotDocument(c1).then(res => {
          console.error(res)
          if(res.code == 200 && res.data) {
            this.openfile(this.$baseURL+res.data)
          } else {
            this.$message({
              type: 'error',
              message: '预览失败'
            })

          }
        })
      },
      openfile(e) {
        if (e) {
          const fullUrl = e;
          try {
            window.open(fullUrl, '_blank'); // 在新标签页中打开文件
          } catch (error) {
            console.error('打开文件失败:', error);
          }
        } else {
          console.error('无文件可查看');
        }
      },
      async mingShow() {
        this.addzy = true
      },
        //获取当前时间
      updateCurrentTime() {
          const now = new Date();
          const year = now.getFullYear();
          const month = (now.getMonth() + 1).toString().padStart(2, '0');
          const day = now.getDate().toString().padStart(2, '0');
          const hours = now.getHours().toString().padStart(2, '0');
          const minutes = now.getMinutes().toString().padStart(2, '0');
          const seconds = now.getSeconds().toString().padStart(2, '0');

          return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
      },
    }
  }
</script>
<style lang="css">
  .el-upload {
    display: block;
    text-align: left;
  }

  .el-dialog__header {
    background-color: #F2F3F5;
    text-align: left;
  }

  .el-dialog__title {
    line-height: 30px;
    font-size: 15px;
    color: #303133;
  }

  .iterem {
    z-index: 99;
    margin-left: 10px;
    height: 40px;
    line-height: 25px;
  }
</style>
