sgxt_web/src/views/backOfficeSystem/ExcavationResearch/PreliminaryExcavations/index.vue

<template>
  <div class="statistical-analysis">
    <!-- 左侧树形菜单 -->
    <div class="left-menu">
      <CheckBox
        :data="checkData"
        customClass="all"
        @changeData="changeData"
      ></CheckBox>
    </div>
    <!-- 右侧内容区 -->
    <div class="right-content">
      <Search :searchArr="searchConfiger" @submit="onSearch"> </Search>
      <div class="tableCnt1 mb10 pl10 pr10">
        <PageTitle title="发掘内容" style="color: #333">
          <el-button type="primary" size="small" @click="handleData('add', '')">
            <el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
            <span style="vertical-align: middle" @click="handleData('add', '')"
              >新增</span
            >
          </el-button>
          <!-- <el-button type="primary" size="small" @click="showText = true">
            <span style="vertical-align: middle">导入内容</span>
          </el-button> -->
          <el-button type="primary" size="small" @click="isImport = true">
            <span style="vertical-align: middle">导入内容</span>
          </el-button>
          <el-button type="danger" size="small" @click="deleteRow(idsTop)">
            <el-icon style="vertical-align: middle"><Delete /></el-icon>
            <span style="vertical-align: middle">批量删除</span>
          </el-button>
        </PageTitle>
        <MyTable
          :tableData="pageData.tableData"
          :tableColumn="pageData.tableColumn"
          :tableHeight="pageData.tableHeight"
          :key="pageData.keyCount"
          :tableConfiger="pageData.tableConfiger0"
          :controlsWidth="pageData.controlsWidth"
          @chooseData="chooseDataTop"
        >
          <template #fjLx="{ row }">
            <DictTag :tag="false" :value="row.fjLx" :options="D_GS_RQFJ_LX" />
          </template>
          <!-- 操作 -->
          <template #controls="{ row }">
            <el-link
              size="small"
              type="success"
              @click="handleData('edit', row)"
              >编辑</el-link
            >
            <el-link
              size="small"
              type="primary"
              @click="handleData('info', row)"
              >查看</el-link
            >
            <el-link size="small" type="danger" @click="deleteRow([row.id])"
              >删除</el-link
            >
          </template>
        </MyTable>
        <div class="ww100 flex just-center mt8">
          <el-button type="primary" @click="intelligent">智能解析</el-button>
        </div>
      </div>
      <div class="tableCnt mb10 pl10 pr10">
        <PageTitle
          title="模型智能识别/LP解析结果"
          style="color: #333"
        ></PageTitle>
        <div ref="searchBox" class="mb8">
          <el-button
            :type="it == '批量删除' ? 'danger' : 'primary'"
            size="small"
            v-for="it in btnsList"
            :key="it"
            @click="chooseType(it)"
          >
            {{ it }}
          </el-button>
        </div>
        <div>
          <MyTable
            :tableData="pageData.tableData2"
            :tableColumn="pageData.tableColumn2"
            :tableHeight="pageData.tableHeight2"
            :key="pageData.keyCount"
            :tableConfiger="pageData.tableConfiger"
            :controlsWidth="pageData.controlsWidth"
            @chooseData="chooseDataBottom"
          >
            <template #bqList="{ row }">
              <div v-if="row.bqList">
                <el-tag v-for="(it, idx) in row.bqList" :key="idx"
                  >{{ it.bqMc }}、</el-tag
                >
              </div>
            </template>
            <template #fxDj="{ row }">
              <DictTag
                :tag="false"
                :value="row.fxDj"
                :options="D_GS_RQFJ_FXDJ"
              />
            </template>
            <template #fxLb="{ row }">
              <DictTag
                :tag="false"
                :value="row.fxLb"
                :options="D_GS_RQFJ_FXLB"
              />
            </template>
            <template #sfGz="{ row }">
              <DictTag :tag="false" :value="row.sfGz" :options="D_BZ_SF" />
            </template>
            <template #sfZbkry="{ row }">
              <DictTag :tag="false" :value="row.sfZbkry" :options="D_BZ_SF" />
            </template>
            <template #sfZzdry="{ row }">
              <DictTag :tag="false" :value="row.sfZzdry" :options="D_BZ_SF" />
            </template>
            <!-- 操作 -->
            <template #controls="{ row }">
              <el-link
                size="small"
                type="danger"
                @click="deleteRowBottom(row.id)"
                >删除</el-link
              >
              <el-link size="small" type="primary" @click="viewDetails(row)"
                >查看</el-link
              >
            </template>
          </MyTable>
          <Pages
            @changeNo="changeNo"
            @changeSize="changeSize"
            :tableHeight="pageData.tableHeight2"
            :pageConfiger="{
              ...pageData.pageConfiger,
              total: pageData.total
            }"
          ></Pages>
        </div>
      </div>
    </div>
    <!-- 弹窗智能分析 -->
    <IntelligentParsing
      :tableData="pageData.tableData"
      ref="IntelligentParsingRef"
      @upadate="getModelList"
    />
    <addForm ref="addFormDiloag" @onSearch="onSearch" />
    <Model
      v-model="isShow"
      :type="chooselx"
      :ids="ids"
      @change="getModelList"
      :dic="{ D_GS_RQFJ_FXDJ }"
    ></Model>
    <Export
      :show="isImport"
      lx="fjnr"
      @closeImport="isImport = false"
      @handleImport="getList"
    />
    <!-- 文字解析 -->
    <ExtractionText
      v-if="showText"
      v-model="showText"
      @change="getText"
    ></ExtractionText>
  </div>
</template>

<script setup>
import { download } from "@/utils/request";
import ExtractionText from "@/components/ExtractionText/index.vue";
import Export from "@/components/export/index.vue";
import CheckBox from "@/components/checkBox/index.vue";
import PageTitle from "@/components/aboutTable/PageTitle.vue";
import MyTable from "@/components/aboutTable/MyTable.vue";
import Pages from "@/components/aboutTable/Pages.vue";
import Search from "@/components/aboutTable/Search.vue";
import addForm from "./components/addForm.vue";
import Model from "./components/model.vue";
import IntelligentParsing from "./components/IntelligentParsing.vue";
import { ElMessage } from "element-plus";
import { qcckGet, qcckDelete } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
const { D_GS_RQFJ_LX, D_GS_RQFJ_FXDJ, D_BZ_SF, D_GS_RQFJ_FXLB } = proxy.$dict(
  "D_GS_RQFJ_FXDJ",
  "D_GS_RQFJ_LX",
  "D_GS_RQFJ_FXDJ",
  "D_BZ_SF",
  "D_GS_RQFJ_FXLB"
); //获取字典数据
const showText = ref(false);
const searchConfiger = ref([
  {
    label: "管辖部门",
    prop: "ssbm",
    placeholder: "请选择管辖部门",
    showType: "department"
  },
  {
    label: "是否关注",
    prop: "sfgz",
    placeholder: "请选择是否关注",
    showType: "select",
    options: D_BZ_SF
  }
]);
const isImport = ref(false);
const checkData = reactive({
  hasChoose: ["警情"],
  list: ["警情", "人力情报", "线索", "民警处置文本", "交通事故"]
});
const btnsList = reactive([
  "级别变更",
  "警种变更",
  "指定分配",
  "添加标签",
  "导出",
  "批量删除"
]);

const chooselx = ref("");
const isShow = ref(false);
const idsTop = ref([]);
const ids = ref([]);

const addFormDiloag = ref();
const IntelligentParsingRef = ref();
const searchBox = ref();
const queryFrom = ref({});
const pageData = reactive({
  tableData: [],
  tableData2: [],
  keyCount: 0,
  tableConfiger0: {
    rowHieght: 61,
    showSelectType: "checkBox",
    loading: false
  },
  tableConfiger: {
    rowHieght: 61,
    showSelectType: "checkBox",
    loading: false
  },
  tableHeight: 190,
  total: 0,
  pageConfiger: {
    pageSize: 20,
    pageCurrent: 1
  },
  controlsWidth: 160,
  tableColumn: [
    { label: "发掘类型", prop: "fjLx", showSolt: true },
    { label: "发掘文本	", prop: "fjWb", showOverflowTooltip: true }
  ],
  tableColumn2: [
    { label: "姓名", prop: "ryXm", showOverflowTooltip: true },
    { label: "手机号码", prop: "rySjhm", showOverflowTooltip: true },
    { label: "身份证号码", prop: "rySfzh", showOverflowTooltip: true },
    { label: "户籍地址", prop: "ryHjdz", showOverflowTooltip: true },
    { label: "护照号码", prop: "ryHzhm", showOverflowTooltip: true },
    { label: "现住地址", prop: "ryXzdz", showOverflowTooltip: true },
    { label: "附件照片", prop: "ryFjZp", showOverflowTooltip: true },
    { label: "管辖单位", prop: "gxDwDm", showOverflowTooltip: true },
    { label: "管控民警", prop: "gxMj", showOverflowTooltip: true },
    { label: "责任部门", prop: "ssbm", showOverflowTooltip: true },
    {
      label: "标签",
      prop: "bqList",
      showOverflowTooltip: true,
      showSolt: true
    },
    {
      label: "风险等级",
      prop: "fxDj",
      showOverflowTooltip: true,
      showSolt: true
    },
    {
      label: "风险类别",
      prop: "fxLb",
      showOverflowTooltip: true,
      showSolt: true
    },
    {
      label: "是否关注",
      prop: "sfGz",
      showOverflowTooltip: true,
      showSolt: true
    },
    {
      label: "是否转布控人员",
      prop: "sfZbkry",
      showOverflowTooltip: true,
      showSolt: true
    },
    {
      label: "是否转重点人员",
      prop: "sfZzdry",
      showOverflowTooltip: true,
      showSolt: true
    }
  ]
});

// 搜索
const onSearch = (val) => {
  queryFrom.value = { ...val };
  pageData.pageConfiger.pageCurrent = 1;
  getList();
};

const changeNo = (val) => {
  pageData.pageConfiger.pageCurrent = val;
  getModelList();
};
const changeSize = (val) => {
  pageData.pageConfiger.pageSize = val;
  getModelList();
};

// 获取内容列表
const getList = () => {
  pageData.tableConfiger.loading = true;
  let data = { ...queryFrom.value };
  let url = "/mosty-gsxt/tbGsxtRqfjNr/selectPage";
  qcckGet(data, url)
    .then((res) => {
      pageData.tableData = res.records || [];
      pageData.tableConfiger.loading = false;
    })
    .catch(() => {
      pageData.tableConfiger.loading = false;
    });
};

//获取模型识别列表
const getModelList = () => {
  let data = { ...pageData.pageConfiger };
  pageData.tableConfiger0.loading = true;
  qcckGet(data, "/mosty-gsxt/tbGsxtRqfjRy/selectPage")
    .then((res) => {
      pageData.tableConfiger0.loading = false;
      pageData.tableData2 = res.records || [];
      pageData.total = res.total;
      ids.value = [];
    })
    .catch(() => {
      pageData.tableConfiger0.loading = false;
    });
};
//新增- 编辑
const handleData = (type, row) => {
  addFormDiloag.value.init(type, row);
};
// 智能解析
const intelligent = () => {
  IntelligentParsingRef.value.init();
};

// 选择数据
const chooseDataTop = (val) => {
  if (Array.isArray(val)) idsTop.value = val.map((item) => item.id);
};

//删除操作
const deleteRow = (ids) => {
  proxy.$confirm("确定要删除", "警告", { type: "warning" }).then(() => {
    ids.forEach((id) => {
      qcckGet({}, "/mosty-gsxt/tbGsxtRqfjNr/closeById/" + id).then((res) => {
        ElMessage.success("删除成功");
        getList();
      });
    });
  });
};
const deleteRowBottom = (id) => {
  proxy.$confirm("确定要删除", "警告", { type: "warning" }).then(() => {
    qcckDelete({}, "/mosty-gsxt/tbGsxtRqfjRy/" + id).then((res) => {
      ElMessage.success("删除成功");
      getModelList();
    });
  });
};

// 选择数据
const chooseDataBottom = (val) => {
  if (Array.isArray(val)) ids.value = val.map((item) => item.id);
};

const chooseType = (val) => {
  chooselx.value = val;
  switch (val) {
    case "级别变更":
    case "警种变更":
    case "指定分配":
    case "添加标签":
      if (ids.value.length == 0) return ElMessage.warning("请选择对应的数据");
      isShow.value = true;
      break;
    case "导出":
      // download("/mosty-api/mosty-gsxt/tbGsxtRqfjRy/exportRyfjFxjg", {"bkBt":"1"},`模型智能识别/LP解析结果_${new Date().getTime()}.xlsx`);
      break;
    case "批量删除":
      if (ids.value.length == 0)
        return ElMessage.warning("请选择对应删除的数据");
      ids.value.forEach((id) => {
        deleteRowBottom(id);
      });
      break;
  }
};

const tabHeightFn = () => {
  pageData.tableHeight2 =
    window.innerHeight - searchBox.value.offsetHeight - 650;
  window.onresize = function () {
    tabHeightFn();
  };
};

onMounted(() => {
  getList();
  tabHeightFn();
  getModelList();
});
</script>

<style lang="scss" scoped>
.statistical-analysis {
  width: 100%;
  height: 100%;
  .left-menu {
    float: left;
    width: 280px;
    height: calc(100% - 10px);
    padding: 20px 4px;
    margin-top: 20px;
    border-radius: 4px;
    background-color: #fff;
    border-right: 1px solid #e8e8e8;
    color: #333;
    line-height: 32px;
    ::v-deep .checkBox {
      flex-direction: column;
      .checkall {
        margin: 0;
      }
    }
    ::v-deep .el-checkbox-group {
      display: flex;
      flex-direction: column;
    }
    ::v-deep .is-checked {
      background: rgb(242, 249, 255);
      margin-bottom: 4px;
    }
    ::v-deep .el-checkbox {
      padding-left: 8px;
      margin-right: 4px;
    }
    .all {
      width: calc(100% - 4px);
    }
  }
  .right-content {
    float: left;
    width: calc(100% - 290px);
    height: 100%;
    padding: 0 20px 0;
    margin-top: 20px;
    margin-left: 10px;
    border-radius: 4px;
    box-sizing: border-box;
    .tableCnt1 {
      height: 290px;
      background: #fff;
      border-radius: 4px;
    }
    .tableCnt {
      height: calc(100vh - 257px - 290px);
      background: #fff;
      border-radius: 4px;
    }
  }
}
</style>