Merge branch 'main' of http://120.76.84.145:10101/gitblit/r/H5/chongzhouRes...

pyt

2025-03-25 d1f38394b96a0ca52524f02c95d757cda2a2a998

Merge branch 'main' of http://120.76.84.145:10101/gitblit/r/H5/chongzhouResettle

 src/views/applicationBatchList/components/ApprovalDialog.vue

@@ -1,207 +1,307 @@
<template>
  <el-dialog :title="type === 'audit' ? '审批安置户申请信息' : '安置户申请信息'" :visible.sync="dialogVisible" width="80%"
    :close-on-click-modal="false" :append-to-body="true">
  <el-dialog
    :title="type === 'audit' ? '审批安置户申请信息' : '安置户申请信息'"
    :visible.sync="dialogVisible"
    width="80%"
    :close-on-click-modal="false"
    :append-to-body="true"
  >
    <div class="approval-content">
      <!-- 左侧表格区域 -->
      <div class="table-container">
        <el-table 
        <el-table
          v-loading="loading"
          element-loading-text="加载中..."
          element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(255, 255, 255, 0.8)"
          :data="tableData" 
          border 
          style="width: 100%" 
          :data="tableData"
          border
          style="width: 100%"
          :row-class-name="tableRowClassName"
          height="400"
        >
          <el-table-column type="index" label="序号" width="50" align="center" />
          <el-table-column prop="street" label="镇（街道）" align="center" width="80">
          <el-table-column
            type="index"
            label="序号"
            width="50"
            align="center"
          />
          <el-table-column
            prop="street"
            label="镇（街道）"
            align="center"
            width="80"
          >
            <template slot-scope="scope">
              {{ scope.row.street }}
              <el-tooltip v-if="scope.row.streetWarn" placement="top">
                <div slot="content">{{ scope.row.streetWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="projectName" label="拆迁项目名称" align="center" width="150">
          <el-table-column
            prop="projectName"
            label="拆迁项目名称"
            align="center"
            width="150"
          >
            <template slot-scope="scope">
              {{ scope.row.projectName }}
              <el-tooltip v-if="scope.row.projectNameWarn" placement="top">
                <div slot="content">{{ scope.row.projectNameWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="community" label="所在村（社区）" align="center" width="100">
          <el-table-column
            prop="community"
            label="所在村（社区）"
            align="center"
            width="100"
          >
            <template slot-scope="scope">
              {{ scope.row.community }}
              <el-tooltip v-if="scope.row.communityWarn" placement="top">
                <div slot="content">{{ scope.row.communityWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="demolitionTime" label="拆迁时间" align="center" width="100">
          <el-table-column
            prop="demolitionTime"
            label="拆迁时间"
            align="center"
            width="100"
          >
            <template slot-scope="scope">
              {{ scope.row.demolitionTime }}
              <el-tooltip v-if="scope.row.demolitionTimeWarn" placement="top">
                <div slot="content">{{ scope.row.demolitionTimeWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="householdHead" label="户主名称" align="center" width="80">
          <el-table-column
            prop="householdHead"
            label="户主名称"
            align="center"
            width="80"
          >
            <template slot-scope="scope">
              {{ scope.row.householdHead }}
              <el-tooltip v-if="scope.row.householdHeadWarn" placement="top">
                <div slot="content">{{ scope.row.householdHeadWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="idCard" label="身份证号" align="center" width="180">
          <el-table-column
            prop="idCard"
            label="身份证号"
            align="center"
            width="180"
          >
            <template slot-scope="scope">
              {{ scope.row.idCard }}
              <el-tooltip v-if="scope.row.idCardExistsWarn == 1" placement="top">
              <el-tooltip
                v-if="scope.row.idCardExistsWarn == 1"
                placement="top"
              >
                <div slot="content">{{ "身份证不在安置库" }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
                <i
                  class="el-icon-warning-outline"
                  style="color: #e6a23c; margin-left: 5px"
                ></i>
              </el-tooltip>
              <el-tooltip v-if="scope.row.idCardNoWarn == 1" placement="top">
                <div slot="content">{{ "身份证重复" }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
                <i
                  class="el-icon-warning-outline"
                  style="color: #e6a23c; margin-left: 5px"
                ></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="mobile" label="联系电话" align="center" width="120">
          <el-table-column
            prop="mobile"
            label="联系电话"
            align="center"
            width="120"
          >
            <template slot-scope="scope">
              {{ scope.row.mobile }}
              <el-tooltip v-if="scope.row.mobileWarn" placement="top">
                <div slot="content">{{ scope.row.mobileWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column label="本次安置人数（人）" align="center">
            <el-table-column prop="currentCollectiveNum" label="集体经济组织成员" align="center" width="120">
            <el-table-column
              prop="currentCollectiveNum"
              label="集体经济组织成员"
              align="center"
              width="120"
            >
              <template slot-scope="scope">
                {{ scope.row.currentCollectiveNum }}
                <el-tooltip v-if="scope.row.currentCollectiveNumWarn" placement="top">
                  <div slot="content">{{ scope.row.currentCollectiveNumWarn }}</div>
                  <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
                </el-tooltip>
              </template>
            </el-table-column>
            <el-table-column prop="currentNoCollectiveNum" label="非集体经济组织成员" align="center" width="120">
            <el-table-column
              prop="currentNoCollectiveNum"
              label="非集体经济组织成员"
              align="center"
              width="120"
            >
              <template slot-scope="scope">
                {{ scope.row.currentNoCollectiveNum }}
                <el-tooltip v-if="scope.row.currentNoCollectiveNumWarn" placement="top">
                  <div slot="content">{{ scope.row.currentNoCollectiveNumWarn }}</div>
                  <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
                </el-tooltip>
              </template>
            </el-table-column>
            <el-table-column prop="currentCount" label="合计" align="center" width="60">
            <el-table-column
              prop="currentCount"
              label="合计"
              align="center"
              width="60"
            >
              <template slot-scope="scope">
                {{ scope.row.currentCount }}
                <el-tooltip v-if="scope.row.currentCountWarn" placement="top">
                  <div slot="content">{{ scope.row.currentCountWarn }}</div>
                  <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
                </el-tooltip>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column prop="waitFamilyNames" label="待安置家庭成员姓名" align="center" width="120">
          <el-table-column
            prop="waitFamilyNames"
            label="待安置家庭成员姓名"
            align="center"
            width="120"
          >
            <template slot-scope="scope">
              {{ scope.row.waitFamilyNames }}
              <el-tooltip v-if="scope.row.waitFamilyNamesWarn" placement="top">
                <div slot="content">{{ scope.row.waitFamilyNamesWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              <el-tooltip
                v-if="scope.row.waitFamilyNamesWarn == 1"
                placement="top"
              >
                <div slot="content">{{ "身份信息存在重复数据" }}</div>
                <i
                  class="el-icon-warning-outline"
                  style="color: #e6a23c; margin-left: 5px"
                ></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="waitFamilyArea" label="待安置人员应安置面积合计（㎡）" align="center" width="120">
          <el-table-column
            prop="waitFamilyArea"
            label="待安置人员应安置面积合计（㎡）"
            align="center"
            width="120"
          >
            <template slot-scope="scope">
              {{ scope.row.waitFamilyArea }}
              <el-tooltip v-if="scope.row.waitFamilyAreaWarn" placement="top">
                <div slot="content">{{ scope.row.waitFamilyAreaWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              <el-tooltip
                v-if="scope.row.waitFamilyAreaWarn == 1"
                placement="top"
              >
                <div slot="content">{{ "应补偿面积数据异常" }}</div>
                <i
                  class="el-icon-warning-outline"
                  style="color: #e6a23c; margin-left: 5px"
                ></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column label="补偿金额（万元）" align="center">
            <el-table-column prop="compensationNewAmount" label="新建商品住房、商业用房、停车位" align="center" width="100">
            <el-table-column
              prop="compensationNewAmount"
              label="新建商品住房、商业用房、停车位"
              align="center"
              width="100"
            >
              <template slot-scope="scope">
                {{ scope.row.compensationNewAmount }}
                <el-tooltip v-if="scope.row.compensationNewAmountWarn" placement="top">
                  <div slot="content">{{ scope.row.compensationNewAmountWarn }}</div>
                  <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
                <el-tooltip
                  v-if="scope.row.compensationAmountWarn == 1"
                  placement="top"
                >
                  <div slot="content">
                    {{ "检测到多个购房情况，请人工核对" }}
                  </div>
                  <i
                    class="el-icon-warning-outline"
                    style="color: #e6a23c; margin-left: 5px"
                  ></i>
                </el-tooltip>
              </template>
            </el-table-column>
            <el-table-column prop="compensationOldAmount" label="二手住房" align="center" width="80">
            <el-table-column
              prop="compensationOldAmount"
              label="二手住房"
              align="center"
              width="80"
            >
              <template slot-scope="scope">
                {{ scope.row.compensationOldAmount }}
                <el-tooltip v-if="scope.row.compensationOldAmountWarn" placement="top">
                  <div slot="content">{{ scope.row.compensationOldAmountWarn }}</div>
                  <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
                </el-tooltip>
              </template>
            </el-table-column>
            <el-table-column prop="compensationSum" label="合计" align="center" width="60">
            <el-table-column
              prop="compensationSum"
              label="合计"
              align="center"
              width="60"
            >
              <template slot-scope="scope">
                {{ scope.row.compensationSum }}
                <el-tooltip v-if="scope.row.compensationSumWarn" placement="top">
                  <div slot="content">{{ scope.row.compensationSumWarn }}</div>
                  <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
                <el-tooltip
                  v-if="scope.row.compensationSumWarn == 1"
                  placement="top"
                >
                  <div slot="content">{{ "金额超出补偿标准" }}</div>
                  <i
                    class="el-icon-warning-outline"
                    style="color: #e6a23c; margin-left: 5px"
                  ></i>
                </el-tooltip>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column prop="downPaymentAmount" label="25%首付款（万元）" align="center" width="130">
          <el-table-column
            prop="downPaymentAmount"
            label="25%首付款（万元）"
            align="center"
            width="130"
          >
            <template slot-scope="scope">
              {{ scope.row.downPaymentAmount }}
              <el-tooltip v-if="scope.row.downPaymentAmountWarn" placement="top">
                <div slot="content">{{ scope.row.downPaymentAmountWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="quarterPayAmount" label="每季度需支付款项（万元）" align="center" width="120">
          <el-table-column
            prop="quarterPayAmount"
            label="每季度需支付款项（万元）"
            align="center"
            width="120"
          >
            <template slot-scope="scope">
              {{ scope.row.quarterPayAmount }}
              <el-tooltip v-if="scope.row.quarterPayAmountWarn" placement="top">
                <div slot="content">{{ scope.row.quarterPayAmountWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              <el-tooltip
                v-if="scope.row.quarterPayAmountWarn == 1"
                placement="top"
              >
                <div slot="content">{{ "季度款金额异常" }}</div>
                <i
                  class="el-icon-warning-outline"
                  style="color: #e6a23c; margin-left: 5px"
                ></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="subsidyAmount" label="过渡补贴（万元）" align="center" width="60">
          <el-table-column
            prop="subsidyAmount"
            label="过渡补贴（万元）"
            align="center"
            width="60"
          >
            <template slot-scope="scope">
              {{ scope.row.subsidyAmount }}
              <el-tooltip v-if="scope.row.subsidyAmountWarn" placement="top">
                <div slot="content">{{ scope.row.subsidyAmountWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              <el-tooltip
                v-if="scope.row.subsidyAmountWarn == 1"
                placement="top"
              >
                <div slot="content">{{ "过度补贴数据异常" }}</div>
                <i
                  class="el-icon-warning-outline"
                  style="color: #e6a23c; margin-left: 5px"
                ></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="remark" label="备注" align="center" width="60">
            <template slot-scope="scope">
              {{ scope.row.remark }}
              <el-tooltip v-if="scope.row.remarkWarn" placement="top">
                <div slot="content">{{ scope.row.remarkWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="situation" label="购房差异情况" align="center" width="60">
          <el-table-column
            prop="situation"
            label="购房差异情况"
            align="center"
            width="60"
          >
            <template slot-scope="scope">
              {{ scope.row.situation }}
              <el-tooltip v-if="scope.row.situationWarn" placement="top">
                <div slot="content">{{ scope.row.situationWarn }}</div>
                <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
              </el-tooltip>
            </template>
          </el-table-column>
        </el-table>
@@ -214,17 +314,25 @@
          <template v-if="type === 'audit'">
            <div class="timeline-item">
              <div class="timeline-icon">
                <el-avatar size="small" icon="el-icon-user" :style="{ background: '#6d78ff' }"></el-avatar>
                <el-avatar
                  size="small"
                  icon="el-icon-user"
                  :style="{ background: '#6d78ff' }"
                ></el-avatar>
              </div>
              <div class="timeline-content info-box">
                <div class="info-line">
                  <div class="approver-info">
                    <div class="approver-title">提交人：</div>
                    <div class="approver-name">{{ approvalInfo.createUser }}</div>
                    <div class="approver-name">
                      {{ approvalInfo.createUser }}
                    </div>
                  </div>
                  <div class="approval-time-info">
                    <div class="approval-time-title">提交时间：</div>
                    <div class="approval-time">{{ approvalInfo.createTime }}</div>
                    <div class="approval-time">
                      {{ approvalInfo.createTime }}
                    </div>
                  </div>
                </div>
              </div>
@@ -232,10 +340,16 @@
            <div class="timeline-divider"></div>
            <div class="timeline-item">
              <div class="timeline-icon">
                <el-avatar size="small" icon="el-icon-time" :style="{ background: '#909399' }"></el-avatar>
                <el-avatar
                  size="small"
                  icon="el-icon-time"
                  :style="{ background: '#909399' }"
                ></el-avatar>
              </div>
              <div class="timeline-content">
                <el-button size="small" disabled class="waiting-btn">等待审核</el-button>
                <el-button size="small" disabled class="waiting-btn"
                  >等待审核</el-button
                >
              </div>
            </div>
          </template>
@@ -243,17 +357,25 @@
          <template v-else>
            <div class="timeline-item">
              <div class="timeline-icon">
                <el-avatar size="small" icon="el-icon-user" :style="{ background: '#6d78ff' }"></el-avatar>
                <el-avatar
                  size="small"
                  icon="el-icon-user"
                  :style="{ background: '#6d78ff' }"
                ></el-avatar>
              </div>
              <div class="timeline-content info-box">
                <div class="info-line">
                  <div class="approver-info">
                    <div class="approver-title">提交人：</div>
                    <div class="approver-name">{{ approvalInfo.createUser }}</div>
                    <div class="approver-name">
                      {{ approvalInfo.createUser }}
                    </div>
                  </div>
                  <div class="approval-time-info">
                    <div class="approval-time-title">提交时间：</div>
                    <div class="approval-time">{{ approvalInfo.createTime }}</div>
                    <div class="approval-time">
                      {{ approvalInfo.createTime }}
                    </div>
                  </div>
                </div>
              </div>
@@ -261,17 +383,25 @@
            <div class="timeline-divider"></div>
            <div class="timeline-item">
              <div class="timeline-icon">
                <el-avatar size="small" icon="el-icon-user" :style="{ background: '#6d78ff' }"></el-avatar>
                <el-avatar
                  size="small"
                  icon="el-icon-user"
                  :style="{ background: '#6d78ff' }"
                ></el-avatar>
              </div>
              <div class="timeline-content info-box">
                <div class="info-line">
                  <div class="approver-info">
                    <div class="approver-title">审核人：</div>
                    <div class="approver-name">{{ approvalInfo.approveName }}</div>
                    <div class="approver-name">
                      {{ approvalInfo.approveName }}
                    </div>
                  </div>
                  <div class="approval-time-info">
                    <div class="approval-time-title">审核时间：</div>
                    <div class="approval-time">{{ approvalInfo.approveTime }}</div>
                    <div class="approval-time">
                      {{ approvalInfo.approveTime }}
                    </div>
                  </div>
                </div>
              </div>
@@ -294,26 +424,28 @@
        <div class="result-label">审核结果</div>
        <div class="result-options">
          <el-button-group>
            <el-button 
            <el-button
              :disabled="type === 'detail'"
              :type="form.auditResult === '通过' ? 'primary' : ''" 
              :type="form.auditResult === '通过' ? 'primary' : ''"
              @click="form.auditResult = '通过'"
            >通过</el-button>
            <el-button 
              >通过</el-button
            >
            <el-button
              :disabled="type === 'detail'"
              :type="form.auditResult === '驳回' ? 'primary' : ''" 
              :type="form.auditResult === '驳回' ? 'primary' : ''"
              @click="form.auditResult = '驳回'"
            >驳回</el-button>
              >驳回</el-button
            >
          </el-button-group>
        </div>
      </div>

      <div class="audit-comment">
        <div class="comment-label">审批意见</div>
        <el-input 
          type="textarea" 
          :rows="4" 
          placeholder="请输入审批意见" 
        <el-input
          type="textarea"
          :rows="4"
          placeholder="请输入审批意见"
          v-model="form.auditComment"
          :disabled="type === 'detail'"
        ></el-input>
@@ -329,7 +461,7 @@
</template>

<script>
import { geDetailTabletList,approve } from "@/api/application-batch"
import { geDetailTabletList, approve } from "@/api/application-batch";
export default {
  name: "ApprovalDialog",
  props: {
@@ -347,8 +479,8 @@
    id: {
      type: [Number],
      required: true,
      default: 0
    }
      default: 0,
    },
  },
  data() {
    return {
@@ -367,8 +499,8 @@
        operatorName: "",
        submitTime: "",
        auditorName: "",
        auditTime: ""
      }
        auditTime: "",
      },
    };
  },
  watch: {
@@ -380,7 +512,7 @@
    },
    dialogVisible(val) {
      this.$emit("update:visible", val);
    }
    },
  },
  methods: {
    async getTableData() {
@@ -389,27 +521,39 @@
        const res = await geDetailTabletList({
          applyId: this.id,
          pageNum: 1,
          pageSize: 999
          pageSize: 99999,
        });
        if (res.code === 200) {
          this.tableData = res.data.records.map(item => ({
          this.tableData = res.data.records.map((item) => ({
            ...item,
            hasError: Object.keys(item).some(key => key.endsWith('Warn') && item[key])
            hasError: Object.keys(item).some(
              (key) => key.endsWith("Warn") && item[key]
            ),
          }));
          this.hasWarning = this.tableData.some(item => item.hasError);
          this.approvalInfo = {...res.data.placementApply};
          this.form.auditResult = this.approvalInfo.status === 1 ? '通过' : '驳回';
          this.hasWarning = this.tableData.some((item) => item.hasError);
          this.approvalInfo = { ...res.data.placementApply };
          this.form.auditResult =
            this.approvalInfo.status === 1 ? "通过" : "驳回";
          this.form.auditComment = this.approvalInfo.reason;
        }
      } catch (error) {
        console.error('获取表格数据失败:', error);
        this.$message.error('获取数据失败，请稍后重试');
        console.error("获取表格数据失败:", error);
        this.$message.error("获取数据失败，请稍后重试");
      } finally {
        this.loading = false;
      }
    },
    tableRowClassName({ row }) {
      if (row.hasError) {
      if (
        row.compensationAmountWarn == 1 ||
        row.waitFamilyNamesWarn == 1 ||
        row.waitFamilyAreaWarn == 1 ||
        row.subsidyAmountWarn == 1 ||
        row.quarterPayAmountWarn == 1 ||
        row.idCardNoWarn == 1 ||
        row.idCardExistsWarn == 1 ||
        row.compensationSumWarn == 1
      ) {
        return "warning-row";
      }
      return "";
@@ -423,13 +567,13 @@
        this.$message.warning("请输入审批意见");
        return;
      }
      

      const params = {
        applyId: Number(this.id),  // 确保是数字类型
        applyId: Number(this.id), // 确保是数字类型
        reason: this.form.auditComment.trim(),
        status: Number(this.form.auditResult === '通过' ? 1 : 2)  // 确保是数字类型
        status: Number(this.form.auditResult === "通过" ? 1 : 2), // 确保是数字类型
      };
      

      try {
        const res = await approve(params);
        if (res.code === 200) {
@@ -441,7 +585,7 @@
          this.$message.error(res.msg || "审批失败");
        }
      } catch (error) {
        console.error('审批失败:', error);
        console.error("审批失败:", error);
        this.$message.error(error?.response?.data?.message || "审批失败");
      }
    },
@@ -456,6 +600,9 @@
</script>

<style scoped>
::v-deep .warning-row {
  background: #de868f !important;
}
.approval-content {
  display: flex;
  margin-bottom: 20px;
@@ -592,7 +739,7 @@
.audit-comment {
  display: flex;
  align-items: flex-start;
  flex:1;
  flex: 1;
  padding-left: 60px;
}

@@ -609,7 +756,7 @@
}

.el-button-group .el-button:first-child {
  border-right: 1px solid #DCDFE6;
  border-right: 1px solid #dcdfe6;
}

.dialog-footer {
@@ -638,19 +785,12 @@
/* loading样式优化 */
::v-deep .el-loading-spinner .el-icon-loading {
  font-size: 30px;
  color: #409EFF;
  color: #409eff;
}

::v-deep .el-loading-spinner .el-loading-text {
  font-size: 14px;
  margin-top: 8px;
  color: #409EFF;
  color: #409eff;
}
</style>

<style>
/* 全局样式 */
.warning-row {
  background-color: #faa2a2 !important;
}
</style>

 src/views/applicationBatchList/detail.vue

@@ -1,24 +1,34 @@
<template>
  <div class="app-container" v-loading="loading" element-loading-text="加载中...">
  <div
    class="app-container"
    v-loading="loading"
    element-loading-text="加载中..."
  >
    <!-- 头部信息卡片 -->
    <div class="batch-info">
      <div class="header">
        <div class="batch-title">批次号：{{ batchInfo.batchNumber }}</div>
        <div class="back-btn">
          <el-button type="primary" size="small" icon="el-icon-back" @click="goBack">返回</el-button>
          <el-button
            type="primary"
            size="small"
            icon="el-icon-back"
            @click="goBack"
            >返回</el-button
          >
        </div>
      </div>
      <div class="info-cards">
        <el-card class="box-card">
          <div class="card-title">{{ batchInfo.personNum||0 }}</div>
          <div class="card-title">{{ batchInfo.personNum || 0 }}</div>
          <div class="card-desc">申请总人数</div>
        </el-card>
        <el-card class="box-card">
          <div class="card-title">{{ batchInfo.totalAmount||0 }} 万元</div>
          <div class="card-title">{{ batchInfo.totalAmount || 0 }} 万元</div>
          <div class="card-desc">申请总金额</div>
        </el-card>
        <el-card class="box-card">
          <div class="card-title">{{ batchInfo.waitFamilyArea||0 }}㎡</div>
          <div class="card-title">{{ batchInfo.waitFamilyArea || 0 }}㎡</div>
          <div class="card-desc">应安置总面积</div>
        </el-card>
      </div>
@@ -27,7 +37,12 @@
    <!-- 搜索表单 -->
    <el-form :inline="true" :model="queryParams" class="search-form">
      <el-form-item label="镇街">
        <el-select v-model="queryParams.street" placeholder="请选择镇街" clearable size="small">
        <el-select
          v-model="queryParams.street"
          placeholder="请选择镇街"
          clearable
          size="small"
        >
          <el-option
            v-for="item in streetOptions"
            :key="item.dictCode"
@@ -37,169 +52,337 @@
        </el-select>
      </el-form-item>
      <el-form-item label="拆迁项目">
        <el-input v-model="queryParams.projectName" placeholder="请输入" clearable size="small" />
        <el-input
          v-model="queryParams.projectName"
          placeholder="请输入"
          clearable
          size="small"
        />
      </el-form-item>
      <el-form-item label="所在村(社区)">
        <el-input v-model="queryParams.community" placeholder="请输入" clearable size="small" />
        <el-input
          v-model="queryParams.community"
          placeholder="请输入"
          clearable
          size="small"
        />
      </el-form-item>
      <el-form-item label="户主姓名/身份证号">
        <el-input v-model="queryParams.headOrIdCard" placeholder="请输入" clearable size="small" />
        <el-input
          v-model="queryParams.headOrIdCard"
          placeholder="请输入"
          clearable
          size="small"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">查询</el-button>
        <el-button icon="el-icon-refresh" size="small" @click="resetQuery">重置</el-button>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="small"
          @click="handleQuery"
          >查询</el-button
        >
        <el-button icon="el-icon-refresh" size="small" @click="resetQuery"
          >重置</el-button
        >
      </el-form-item>
    </el-form>

    <!-- 操作按钮区域 -->
    <el-row :gutter="10" class="mb8" v-if="batchInfo.status == '0'">
      <el-col :span="1.5">
        <el-button type="primary" size="small" @click="handleAddHousehold">新增安置户信息</el-button>
        <el-button type="primary" size="small" @click="handleAddHousehold"
          >新增安置户信息</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button type="success" size="small" @click="handleDownloadTemplate">下载导入模板</el-button>
        <el-button type="success" size="small" @click="handleDownloadTemplate"
          >下载导入模板</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button type="warning" size="small" @click="handleBatchImport">批量导入</el-button>
        <el-button type="warning" size="small" @click="handleBatchImport"
          >批量导入</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button type="danger" size="small" @click="handleExportIssueData">问题数据导出</el-button>
        <el-button type="danger" size="small" @click="handleExportIssueData"
          >问题数据导出</el-button
        >
      </el-col>
    </el-row>

    <el-row :gutter="10" class="mb8" v-else>
      <el-col :span="1.5">
        <el-button type="primary" size="small" @click="handleExportAll">全部导出为Excel</el-button>
        <el-button type="primary" size="small" @click="handleExportAll"
          >全部导出为Excel</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button type="danger" size="small" @click="handleExportIssueData">问题数据导出</el-button>
        <el-button type="danger" size="small" @click="handleExportIssueData"
          >问题数据导出</el-button
        >
      </el-col>
    </el-row>

    <!-- 表格区域 -->
    <el-table :data="tableData" border style="width: 100%" :row-class-name="tableRowClassName">
    <el-table
      :data="tableData"
      border
      style="width: 100%"
      :row-class-name="tableRowClassName"
    >
      <el-table-column type="index" label="序号" width="50" align="center" />
      <el-table-column prop="street" label="镇（街道）" align="center" width="80">
      <el-table-column
        prop="street"
        label="镇（街道）"
        align="center"
        width="80"
      >
        <template slot-scope="scope">
          {{ scope.row.street }}
        </template>
      </el-table-column>
      <el-table-column prop="projectName" label="拆迁项目名称" align="center" width="150">
      <el-table-column
        prop="projectName"
        label="拆迁项目名称"
        align="center"
        width="150"
      >
        <template slot-scope="scope">
          {{ scope.row.projectName }}
        </template>
      </el-table-column>
      <el-table-column prop="community" label="所在村（社区）" align="center" width="100">
      <el-table-column
        prop="community"
        label="所在村（社区）"
        align="center"
        width="100"
      >
        <template slot-scope="scope">
          {{ scope.row.community }}
        </template>
      </el-table-column>
      <el-table-column prop="demolitionTime" label="拆迁时间" align="center" width="100">
      <el-table-column
        prop="demolitionTime"
        label="拆迁时间"
        align="center"
        width="100"
      >
        <template slot-scope="scope">
          {{ scope.row.demolitionTime }}
        </template>
      </el-table-column>
      <el-table-column prop="householdHead" label="户主名称" align="center" width="80">
      <el-table-column
        prop="householdHead"
        label="户主名称"
        align="center"
        width="80"
      >
        <template slot-scope="scope">
          {{ scope.row.householdHead }}
        </template>
      </el-table-column>
      <el-table-column prop="idCard" label="身份证号" align="center" width="180">
      <el-table-column
        prop="idCard"
        label="身份证号"
        align="center"
        width="180"
      >
        <template slot-scope="scope">
          {{ scope.row.idCard }}
          <el-tooltip v-if="scope.row.idCardExistsWarn == 1" placement="top">
            <div slot="content">{{ "身份证不在安置库" }}</div>
            <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
            <i
              class="el-icon-warning-outline"
              style="color: #e6a23c; margin-left: 5px"
            ></i>
          </el-tooltip>
          <el-tooltip v-if="scope.row.idCardNoWarn == 1" placement="top">
            <div slot="content">{{ "身份证重复" }}</div>
            <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
            <i
              class="el-icon-warning-outline"
              style="color: #e6a23c; margin-left: 5px"
            ></i>
          </el-tooltip>
        </template>
      </el-table-column>
      <el-table-column prop="mobile" label="联系电话" align="center" width="120">
      <el-table-column
        prop="mobile"
        label="联系电话"
        align="center"
        width="120"
      >
        <template slot-scope="scope">
          {{ scope.row.mobile }}
        </template>
      </el-table-column>
      <el-table-column label="本次安置人数（人）" align="center">
        <el-table-column prop="currentCollectiveNum" label="集体经济组织成员" align="center" width="120">
        <el-table-column
          prop="currentCollectiveNum"
          label="集体经济组织成员"
          align="center"
          width="120"
        >
          <template slot-scope="scope">
            {{ scope.row.currentCollectiveNum }}
          </template>
        </el-table-column>
        <el-table-column prop="currentNoCollectiveNum" label="非集体经济组织成员" align="center" width="120">
        <el-table-column
          prop="currentNoCollectiveNum"
          label="非集体经济组织成员"
          align="center"
          width="120"
        >
          <template slot-scope="scope">
            {{ scope.row.currentNoCollectiveNum }}
          </template>
        </el-table-column>
        <el-table-column prop="currentCount" label="合计" align="center" width="60">
        <el-table-column
          prop="currentCount"
          label="合计"
          align="center"
          width="60"
        >
          <template slot-scope="scope">
            {{ scope.row.currentCount }}
          </template>
        </el-table-column>
      </el-table-column>
      <el-table-column prop="waitFamilyNames" label="待安置家庭成员姓名" align="center" width="120">
      <el-table-column
        prop="waitFamilyNames"
        label="待安置家庭成员姓名"
        align="center"
        width="120"
      >
        <template slot-scope="scope">
          {{ scope.row.waitFamilyNames }}
          <el-tooltip v-if="scope.row.waitFamilyNamesWarn" placement="top">
            <div slot="content">{{ scope.row.waitFamilyNamesWarn }}</div>
            <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
          <el-tooltip v-if="scope.row.waitFamilyNamesWarn == 1" placement="top">
            <div slot="content">{{ "身份信息存在重复数据" }}</div>
            <i
              class="el-icon-warning-outline"
              style="color: #e6a23c; margin-left: 5px"
            ></i>
          </el-tooltip>
        </template>
      </el-table-column>
      <el-table-column prop="waitFamilyArea" label="待安置人员应安置面积合计（㎡）" align="center" width="120">
      <el-table-column
        prop="waitFamilyArea"
        label="待安置人员应安置面积合计（㎡）"
        align="center"
        width="120"
      >
        <template slot-scope="scope">
          {{ scope.row.waitFamilyArea }}
          <el-tooltip v-if="scope.row.waitFamilyAreaWarn" placement="top">
            <div slot="content">{{ scope.row.waitFamilyAreaWarn }}</div>
            <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
          <el-tooltip v-if="scope.row.waitFamilyAreaWarn == 1" placement="top">
            <div slot="content">{{ "应补偿面积数据异常" }}</div>
            <i
              class="el-icon-warning-outline"
              style="color: #e6a23c; margin-left: 5px"
            ></i>
          </el-tooltip>
        </template>
      </el-table-column>
      <el-table-column label="补偿金额（万元）" align="center">
        <el-table-column prop="compensationNewAmount" label="新建商品住房、商业用房、停车位" align="center" width="100">
        <el-table-column
          prop="compensationNewAmount"
          label="新建商品住房、商业用房、停车位"
          align="center"
          width="100"
        >
          <template slot-scope="scope">
            {{ scope.row.compensationNewAmount }}
            <!-- 重新对接字段 -->
            <el-tooltip
              v-if="scope.row.compensationAmountWarn == 1"
              placement="top"
            >
              <div slot="content">{{ "检测到多个购房情况，请人工核对" }}</div>
              <i
                class="el-icon-warning-outline"
                style="color: #e6a23c; margin-left: 5px"
              ></i>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column prop="compensationOldAmount" label="二手住房" align="center" width="80">
        <el-table-column
          prop="compensationOldAmount"
          label="二手住房"
          align="center"
          width="80"
        >
          <template slot-scope="scope">
            {{ scope.row.compensationOldAmount }}
          </template>
        </el-table-column>
        <el-table-column prop="compensationSum" label="合计" align="center" width="60">
        <el-table-column
          prop="compensationSum"
          label="合计"
          align="center"
          width="60"
        >
          <template slot-scope="scope">
            {{ scope.row.compensationSum }}
            <el-tooltip v-if="scope.row.compensationSumWarn" placement="top">
              <div slot="content">{{ scope.row.compensationSumWarn }}</div>
              <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
            <el-tooltip
              v-if="scope.row.compensationSumWarn == 1"
              placement="top"
            >
              <div slot="content">{{ "金额超出补偿标准" }}</div>
              <i
                class="el-icon-warning-outline"
                style="color: #e6a23c; margin-left: 5px"
              ></i>
            </el-tooltip>
          </template>
        </el-table-column>
      </el-table-column>
      <el-table-column prop="downPaymentAmount" label="25%首付款（万元）" align="center" width="130">
      <el-table-column
        prop="downPaymentAmount"
        label="25%首付款（万元）"
        align="center"
        width="130"
      >
        <template slot-scope="scope">
          {{ scope.row.downPaymentAmount }}
        </template>
      </el-table-column>
      <el-table-column prop="quarterPayAmount" label="每季度需支付款项（万元）" align="center" width="120">
      <el-table-column
        prop="quarterPayAmount"
        label="每季度需支付款项（万元）"
        align="center"
        width="120"
      >
        <template slot-scope="scope">
          {{ scope.row.quarterPayAmount }}
          <el-tooltip v-if="scope.row.quarterPayAmountWarn" placement="top">
          <el-tooltip
            v-if="scope.row.quarterPayAmountWarn == 1"
            placement="top"
          >
            <div slot="content">
              {{ scope.row.quarterPayAmountWarn }}
              {{ "季度款金额异常" }}
            </div>
            <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
            <i
              class="el-icon-warning-outline"
              style="color: #e6a23c; margin-left: 5px"
            ></i>
          </el-tooltip>
        </template>
      </el-table-column>
      <el-table-column prop="subsidyAmount" label="过渡补贴（万元）" align="center" width="60">
      <el-table-column
        prop="subsidyAmount"
        label="过渡补贴（万元）"
        align="center"
        width="60"
      >
        <template slot-scope="scope">
          {{ scope.row.subsidyAmount }}
          <el-tooltip v-if="scope.row.subsidyAmountWarn" placement="top">
            <div slot="content">{{ scope.row.subsidyAmountWarn }}</div>
            <i class="el-icon-warning" style="color: #e6a23c; margin-left: 5px"></i>
          <el-tooltip v-if="scope.row.subsidyAmountWarn == 1" placement="top">
            <div slot="content">{{ "过度补贴数据异常" }}</div>
            <i
              class="el-icon-warning-outline"
              style="color: #e6a23c; margin-left: 5px"
            ></i>
          </el-tooltip>
        </template>
      </el-table-column>
@@ -208,17 +391,37 @@
          {{ scope.row.remark }}
        </template>
      </el-table-column>
      <el-table-column prop="situation" label="购房差异情况" align="center" width="60">
      <el-table-column
        prop="situation"
        label="购房差异情况"
        align="center"
        width="60"
      >
        <template slot-scope="scope">
          {{ scope.row.situation }}
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" width="150" fixed="right">
        <template slot-scope="scope">
          <el-button size="mini" type="text" @click="handleHouseholdDetail(scope.row)">详情</el-button>
          <el-button
            size="mini"
            type="text"
            @click="handleHouseholdDetail(scope.row)"
            >详情</el-button
          >
          <template v-if="batchInfo.status == '0'">
            <el-button size="mini" type="text" @click="handleHouseholdEdit(scope.row)">编辑</el-button>
            <el-button size="mini" type="text" @click="handleHouseholdDelete(scope.row)">删除</el-button>
            <el-button
              size="mini"
              type="text"
              @click="handleHouseholdEdit(scope.row)"
              >编辑</el-button
            >
            <el-button
              size="mini"
              type="text"
              @click="handleHouseholdDelete(scope.row)"
              >删除</el-button
            >
          </template>
        </template>
      </el-table-column>
@@ -226,34 +429,46 @@

    <!-- 分页 -->
    <div class="pagination-container">
      <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
        :current-page="queryParams.pageNum" :page-sizes="[10, 20, 30, 50]" :page-size="queryParams.pageSize"
        layout="total, sizes, prev, pager, next, jumper" :total="total" />
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="queryParams.pageNum"
        :page-sizes="[10, 20, 30, 50]"
        :page-size="queryParams.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      />
    </div>

    <!-- 上传组件 -->
    <upload-dialog ref="uploadDialog" :info="batchInfo" :visible.sync="uploadDialogVisible"
      @success="handleUploadSuccess" />
    <upload-dialog
      ref="uploadDialog"
      :info="batchInfo"
      :visible.sync="uploadDialogVisible"
      @success="handleUploadSuccess"
    />

    <!-- 详情弹窗 -->
    <DetailDialog 
      :visible.sync="detailDialogVisible"
      :id="currentId"
    />
    <DetailDialog :visible.sync="detailDialogVisible" :id="currentId" />
  </div>
</template>

<script>
import { geDetailTabletList,delDetail,getDictList } from "@/api/application-batch";
import {
  geDetailTabletList,
  delDetail,
  getDictList,
} from "@/api/application-batch";
import { downLoad, exportExcell } from "@/utils";
import UploadDialog from "./components/UploadDialog.vue";
import DetailDialog from './components/DetailDialog.vue'
import DetailDialog from "./components/DetailDialog.vue";

export default {
  name: "ApplicationBatchDetail",
  components: {
    UploadDialog,
    DetailDialog
    DetailDialog,
  },
  data() {
    return {
@@ -309,7 +524,7 @@
  methods: {
    /** 获取镇街选项 */
    getStreetOptions() {
      getDictList().then(res => {
      getDictList().then((res) => {
        this.streetOptions = res.data;
      });
    },
@@ -378,7 +593,7 @@
      // 实现全部导出逻辑  /api/placement-apply/problem-export
      let res = await exportExcell(
        "安置数据表.xlsx",
        {...this.queryParams,applyId:this.batchInfo.id},
        { ...this.queryParams, applyId: this.batchInfo.id },
        "/placement-apply/exports"
      );
      if (res) {
@@ -390,7 +605,7 @@
      // 实现问题数据导出逻辑
      let res = await exportExcell(
        "安置数据表.xlsx",
        {...this.queryParams,applyId:this.batchInfo.id},
        { ...this.queryParams, applyId: this.batchInfo.id },
        "/placement-apply/problem-export"
      );
      if (res) {
@@ -399,7 +614,7 @@
    },
    /** 安置户详情 */
    handleHouseholdDetail(row) {
      if(this.batchInfo.status == '0'){
      if (this.batchInfo.status == "0") {
        this.$router.push({
          path: "/applicationBatchList/detailInfo",
          query: {
@@ -408,7 +623,7 @@
            id: row.id,
          },
        });
      }else{
      } else {
        this.currentId = row.id;
        this.detailDialogVisible = true;
      }
@@ -434,14 +649,14 @@
      })
        .then(() => {
          // 实现删除逻辑
          delDetail({id:row.id}).then(res=>{
            if(res){
          delDetail({ id: row.id }).then((res) => {
            if (res) {
              this.$message.success("删除成功");
              this.getList();
            }
          })
          });
        })
        .catch(() => { });
        .catch(() => {});
    },
    /** 每页显示条数变化 */
    handleSizeChange(val) {
@@ -456,7 +671,16 @@
    /** 设置行的className */
    tableRowClassName({ row }) {
      console.log(row, "11111111111");
      if (row.compensationAmountWarn === 1) {
      if (
        row.compensationAmountWarn == 1 ||
        row.waitFamilyNamesWarn == 1 ||
        row.waitFamilyAreaWarn == 1 ||
        row.subsidyAmountWarn == 1 ||
        row.quarterPayAmountWarn == 1 ||
        row.idCardNoWarn == 1 ||
        row.idCardExistsWarn == 1 ||
        row.compensationSumWarn == 1
      ) {
        return "warning-row";
      }
      return "";
@@ -536,7 +760,7 @@
}

::v-deep .warning-row {
  background-color: #faa2a2 !important;
  background: #de868f !important;
}

/* ::v-deep .warning-row:hover > td {

 src/views/placement-batch/components/ApprovalDialog.vue

@@ -455,6 +455,9 @@
</script>

<style scoped>
::v-deep .warning-row {
  background: #DE868F !important;
}
.approval-content {
  display: flex;
  margin-bottom: 20px;