<template>
  <div>
    <div v-show="type == '1'">
      <div style="height:58px;line-height:58px;">
        <div style="color:#0006">
          <span>招商方案管理</span> <span
            style="padding:0 5px;">></span> <span style="color:#000000e6">查看</span>
        </div>
      </div>
      <el-tabs v-model="xiangTab">
        <el-tab-pane label="方案信息" name="first">
          <div style="margin-top: 30px;" class="editcss">
            <TitleWithCircle title="基础信息" />
            <div style="padding: 20px;">
              <el-form :model="editbgid" ref="formInline" label-width="120px" class="demo-ruleForm">
                <el-form-item label="招商方案名称" prop="planName">
                  <div class="duiqi">{{editbgid.planName  || '无'}}</div>
                </el-form-item>
                <el-form-item label="招商政策与条件" prop="investmentPolicy">
                  <div class="duiqi" v-if="editbgid.investmentPolicy" v-html="editbgid.investmentPolicy"></div>
                  <div class="duiqi" v-else>无</div>
                </el-form-item>
                <el-form-item label="方案概述" prop="summary">
                  <div class="duiqi" v-if="editbgid.summary" v-html="editbgid.summary"></div>
                  <div class="duiqi" v-else>无</div>
                </el-form-item>
                <el-form-item label="附件信息" prop="attachmentInfo"  >
                  <div class="duiqi" :class="editbgid.attachmentInfo?'greens':''" @click ="editbgid.attachmentInfo?openfile($baseURL+editbgid.attachmentInfo):''">{{editbgid.attachmentInfo?'查看详情':'无'}}</div>
                </el-form-item>
              </el-form>
            </div>
            <TitleWithCircle title="资源策略" />
            <div style="padding: 20px;">
              <el-table :data="datalistzy" :span-method="tableSpanMethod"
              :header-cell-style="{fontSize: '14px',color:'#0009',fontWeight: 'normal',backgroundColor:'#F2F3F5'}"
              tooltip-effect="dark custom-tooltip-effect">
                <el-table-column label="资源名称" prop="name" show-overflow-tooltip>
                  <template slot-scope="scope">
                    {{(scope.row.type == '商铺'?scope.row.info.shopName:scope.row.type == '广告位'?scope.row.info.advertisingName:scope.row.type == '场地'?scope.row.info.venueName:null) || '-'}}
                  </template>
                </el-table-column>
                <el-table-column prop="type" label="资源类型" show-overflow-tooltip>
                  <template slot-scope="scope">
                    {{scope.row.type}}
                  </template>
                </el-table-column>
                <el-table-column label="策略名称" prop="policyName" show-overflow-tooltip>
                  <template slot-scope="scope">
                    {{scope.row.shopinfo.policyName}}
                  </template>
                </el-table-column>
                <el-table-column label="租金价格" prop="rentalPrice" show-overflow-tooltip>
                  <template slot-scope="scope">
                    
					<span v-if="scope.row.type!='广告位'">{{scope.row.shopinfo.rentalPrice}} 元/m²</span>
					<span v-else>{{scope.row.shopinfo.rentalPrice}} 元/{{ scope.row.shopinfo.leaseTerm }}</span>
                  </template>
                </el-table-column>
                <!-- <el-table-column label="付款日" prop="payDay" show-overflow-tooltip>
                  <template slot-scope="scope">
                    {{scope.row.shopinfo.payDay || '-'}}
                  </template>
                </el-table-column> -->
                <el-table-column label="状态" prop="publishStatus" show-overflow-tooltip>
                  <template slot-scope="scope">
                    {{scope.row.info.publishStatus=='0'?'待发布':scope.row.info.publishStatus=='1'?'待审核':scope.row.info.publishStatus=='2'?'已发布':scope.row.info.publishStatus=='3'?'不通过':'-'}}
                  </template>
                </el-table-column>
                <el-table-column label="操作" fixed="right" prop="sh">
                  <template slot-scope="scope">
                    <div @click="details(scope.row)" class="tableBtn greens">查看</div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
        </el-tab-pane>
      
      </el-tabs>
      <div v-if="editbgid.auditStatus == '1' && issp == '2'">
      <TitleWithCircle title="审核情况"/>
      <div style="padding: 20px;">
          <el-form :model="editbgid" label-width="100px" class="demo-ruleForm">
            <el-form-item label="状态">
              <el-radio v-model="radio" label="2">通过</el-radio>
              <el-radio v-model="radio" label="3">不通过</el-radio>
            </el-form-item>
            <el-form-item label="审核意见">
              <el-input maxlength="200" show-word-limit rows="4" v-model="reviewComments" placeholder="请输入审核意见"
                type="textarea" />
            </el-form-item>
          </el-form>
        </div>
      </div>
      <div v-if="editbgid.auditStatus == '2' || editbgid.auditStatus == '3'">
        <TitleWithCircle title="审核结果"/>
        <div style="padding: 20px;">
          <el-form :model="editbgid" label-width="100px" class="demo-ruleForm">
            <el-form-item label="状态">
              <div class="duiqi">{{editbgid.auditStatus=='2'?'通过':editbgid.auditStatus=='3'?'不通过':'无'}}</div>
            </el-form-item>
            <el-form-item label="审核意见">
              <div class="duiqi">{{editbgid.reviewComments || '无'}}</div>
            </el-form-item>
          </el-form>
        </div>
      </div>
      <div>
        <el-button v-if="editbgid.auditStatus == '1' && issp == '2'" @click="minSev"
        style="background-color: #3F9B6A;color: #fff;">确定</el-button>
        <el-button class="buttonHover"
          style="color: #606266;border: 1px solid #dddfe5;background-color: #fff;margin-top: 20px;"
          @click="changetype">返回</el-button>
      </div>
    </div>
    <div v-show="type == '2'">
      <div style="height:58px;line-height:58px;">
        <div style="color:#0006">
          <span>{{detailstype == '商铺'?'商铺基本信息':detailstype == '广告位'?'广告位基本信息管理':detailstype == '场地'?'场地基本信息管理':'-'  }}</span> <span
            style="padding:0 5px;">></span> <span style="color:#000000e6">查看</span>
        </div>
      </div>
      <div v-if="detailstype == '商铺'">
        <resourceCommodity :editbgid="detailsinfo" @removeonaction="removeonaction"></resourceCommodity>
      </div>
      <div v-if="detailstype == '广告位'">
        <chakanmap :editbgid="detailsinfo" @removeonaction="removeonaction"></chakanmap>
      </div>
      <div v-if="detailstype == '场地'">
        <chakancd :editbgid="detailsinfo" @removeonaction="removeonaction"></chakancd>
      </div>
    </div>

  </div>
</template>

<script>
  import MapXian from "@/components/MapContainer/MapXian";
  import TitleWithCircle from '@/components/top/index';
  import {
    cereResourceStrategylist,
    cereBusinessPlan,
    cereBusinessOperationqueryByPage,
    cereContractInformation,
    modifyResourceStatus,
    cereBusinessPlanqueryById
  } from '@/api/newly';
  import newmap from "@/components/newmap/index";
  import {
    fangEdit
  } from '@/api/fangli'
    import resourceCommodity from '@/components/resourceCommodity/index'
      import chakanmap from '@/components/chakan/map'
  import chakancd from '@/components/chakan/cd'
  export default {
    components: {
      TitleWithCircle,
      newmap,
      MapXian,
      chakancd,
      chakanmap,
      resourceCommodity,
    },
    props: {
      leixing: {
        type: Boolean,
        default: true
      },
      editbgid: {
        type: Object,
        default: function() {
          return {};
        },
      },
      issp: {
        type: String,
        default: function() {
          return '1';
        },
      },
    },
    data() {
      return {
        type: '1',
        totalzl:0,
        pagequeryzl:{
          pageNumber: 0,
          pageSize: 10,
          shopNumber: 'cd' + this.editbgid.id
        },
        datalistzl:[],
        reviewComments:'',
        radio: '2',
        datalistzy:[],
        totalsxj:0,
        pagequerysxj:{
          pageNumber: 0,
          pageSize: 10,
          resourceId: 'cd' + this.editbgid.id
        },
        xiangTab: 'first',
        list: [],
        parentMessage: {},
        datalist: [],
        datalist1:[],
        detailsinfo:{},
        detailstype:''
      }
    },
    created() {
      if (this.editbgid.id) {
        cereBusinessPlanqueryById({id:this.editbgid.id}).then(res => {
          console.error(res)
          let c1 = []
          for (let index = 0; index < res.data.resourceList.length; index++) {
            const element = res.data.resourceList[index];
            console.error(element)
            if (element.cereBasicInformationShop.id) {
              for (let i = 0; i < element.cereRentalPolicies.length; i++) {
                var element1 = element.cereRentalPolicies[i];
                var obj = {
                  info: element.cereBasicInformationShop,
                  num: element.cereRentalPolicies.length,
                  shopinfo: element1,
                  type:'商铺',
                  typeid:'sp'+element.cereBasicInformationShop.id
                };
                c1.push(obj);
              }
            }
            if (element.cereAdvertisingInformation.id) {
              for (let i = 0; i < element.cereRentalPolicies.length; i++) {
                var element1 = element.cereRentalPolicies[i];

                var obj = {
                  info: element.cereAdvertisingInformation,
                  num: element.cereRentalPolicies.length,
                  shopinfo: element1,
                  type:'广告位',
                  typeid:'gg'+element.cereAdvertisingInformation.id
                };
                c1.push(obj);
              }
            }
            if (element.cereBasicInformationVenue.id) {
              for (let i = 0; i < element.cereRentalPolicies.length; i++) {
                var element1 = element.cereRentalPolicies[i];

                var obj = {
                  info: element.cereBasicInformationVenue,
                  num: element.cereRentalPolicies.length,
                  shopinfo: element1,
                  type:'场地',
                  typeid:'cd'+element.cereBasicInformationVenue.id
                };
                c1.push(obj);
              }
            }
          }
          console.error(c1)
          this.datalistzy = c1
        })
        // let c1 = {
        //   pageNumber: 0,
        //   pageSize: 10,
        //   resourcesId: 'cd' + this.editbgid.id
        // }
        // cereResourceStrategylist(c1).then(res => {
        //   console.error(res)
        //   this.datalist = res.data
        // })
        // cereBusinessPlan(c1).then(res => {
        //   console.error(res)
        //   this.datalist1 = res.data
        // })
        // this.getAllxsj()
        // this.getAllzl()
      }
      
    },
    computed: {

    },
    methods: {
      removeonaction() {
          this.type = '1'
      },
      details(row) {
        this.detailstype = row.type
        this.detailsinfo = row.info
        this.type = '2'
      },
      tableSpanMethod({row, column, rowIndex }) {
        if (['name','type','publishStatus','sh'].includes(column.property)) {
          // 判断 num 是否相同，合并行
          const num = row.num;
          const typeid = row.typeid;

          const startRowIndex = this.findStartRowIndex(rowIndex, num,typeid);

          return startRowIndex === rowIndex
            ? { rowspan: num, colspan: 1 }
            : { rowspan: 0, colspan: 0 };
        }
      },
      /**
       * 查找当前行的 num 对应的起始行索引
       */
      findStartRowIndex(rowIndex, num,typeid) {
        let startRowIndex = rowIndex;
        for (let i = rowIndex - 1; i >= 0; i--) {
          if (this.datalistzy[i].num === num && this.datalistzy[i].typeid === typeid) {
            startRowIndex = i;
          } else {
            break;
          }
        }
        return startRowIndex;
      },
      open(row) {
        console.error(row)
        this.xiangTab= 'first'
        this.type = '2'
        this.$refs.onhet.open(row)
      },
      minSev() {
        console.error({
          ...this.editbgid,
        })
        // return
        fangEdit({
          id:this.editbgid.id,
          'auditStatus': this.radio,
          reviewComments: this.reviewComments?this.reviewComments:null
        }).then(res => {
          console.error(res)
          if (res.code == 200) {
            this.$message({
              message: '处理成功',
              type: 'success'
            })
            modifyResourceStatus({
              resourcesId: this.editbgid.resourceManagement,
              status:"2"
            }).then(res => {
              console.error(res)
            })
            this.editbgid.publishStatus = this.radio
            this.$emit('removeonaction', '1')
          } else {
            this.$message({
              message: '处理失败',
              type: 'error'
            })
          }
        })
      },
      handleCurrentChange(val,type) {
        this[type].pageNumber = val - 1
        if(type == 'pagequeryzl') {
          this.getAllzl()
        } else if(type == 'pagequerysxj') {
          this.getAllsxj()
        }
       
      },
      handleSizeChange(val,type) {
        this[type].pageSize = val
        this[type].pageNumber = 0
        if(type == 'pagequeryzl') {
          this.getAllzl()
        } else if(type == 'pagequerysxj') {
          this.getAllsxj()
        }
      },
      getAllzl() {
        cereContractInformation(this.pagequeryzl).then(res => {
          console.error(res)
          if (!Array.isArray(res.data.content)) {
            this.datalistzl = [];
            return;
          }
          this.datalistzl = res.data.content
          this.totalzl = res.data.totalElements
        })
      },
      openfile(e) {
        if (e) {
          const fullUrl = e;
          try {
            window.open(fullUrl, '_blank'); // 在新标签页中打开文件
          } catch (error) {
            console.error('打开文件失败:', error);
          }
        } else {
          console.error('无文件可查看');
        }
      },
      changetype() {
        this.xiangTab= 'first'
        if(this.type == '1'){
          this.$emit('removeonaction', '1')
        }else{
          this.type = '1'
        }
      },
    }
  }
</script>
<style>
  .el-form-item__label {
    color: #a2a2a2;
  }

  .greens {
    color: #3F9B6A;
  }
</style>
