<template>
  <div class="statistical-analysis">
    <!-- 左侧树形菜单 -->
    <div class="left-menu">
      <el-radio-group :disabled="isEdit" v-model="active" @change="changeRadio">
        <el-radio :label="it.dm" v-for="it in D_GS_RQFJ_LX" :key="it.dm">{{ it.zdmc }}</el-radio>
      </el-radio-group>
      <div class="cancelBtn" @click="active = ''">取消</div>
    </div>
    <!-- 右侧内容区 -->
    <div class="right-content">
      <Search :searchArr="searchConfiger" @submit="onSearch"> </Search>
      <div class="tableCnt1 mb10 pl10 pr10">
        <PageTitle title="发掘内容" style="color: #333"></PageTitle>
        <MyTable 
          :tableData="pageData.tableData" 
          :tableColumn="pageData.tableColumn" 
          :tableHeight="pageData.tableHeight"
          :key="pageData.keyCount" 
          :tableConfiger="pageData.tableConfigerTop" 
          :controlsWidth="pageData.controlsWidth">
          <template #sjly="{ row }">
            <DictTag :tag="false" :value="row.sjly" :options="D_GS_RQFJ_LX" />
          </template>
          <!-- 操作 -->
          <template #controls="{ row}">
            <el-link size="small" type="success" @click="handleData(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" v-loading="btnLoading" @click="intelligent">智能解析 </el-button><span v-if="btnLoading" class="f12 ml5 mt15" style="color: #333;">解析中。。。</span>
        </div>
      </div>
      <div class="tableCnt mb10 pl10 pr10">
        <PageTitle title="解析结果" 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.tableHeight" 
            :pageConfiger="{
            ...pageData.pageConfiger,
            total: pageData.total
          }"></Pages>
        </div>
      </div>
    </div>
    <!-- 新增 -->
    <addForm ref="addFormDiloag" v-if="showEdit" @updateDate="updateDate" :dic="{D_GS_RQFJ_LX,D_BZ_SF}" />
    <!-- 弹窗 -->
    <ListDialog ref="modelList" v-model="showDialog" v-if="showDialog" @submit="handelSub" @cancel="active = ''" :dic="{D_GS_RQFJ_LX,D_BZ_SF}"></ListDialog>
  </div>
</template>

<script setup>
import { getItem } from "@/utils/storage";
import ListDialog from './components/listDialog.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 { ElMessage } from "element-plus";
import { qcckGet, qcckDelete,ParsingText } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance, nextTick } 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 showDialog = ref(false)
const btnLoading = ref(false)
const modelList = ref()
const searchConfiger = ref([
  {
    label: "管辖部门",
    prop: "ssbm",
    placeholder: "请选择管辖部门",
    showType: "department"
  },
  {
    label: "是否关注",
    prop: "sfgz",
    placeholder: "请选择是否关注",
    showType: "select",
    options: D_BZ_SF
  }
]);
const active = ref('');
const btnsList = reactive(["级别变更","警种变更","指定分配","添加标签","导出","批量删除"]);
const chooselx = ref("");
const ids = ref([]);
const addFormDiloag = ref();
const showEdit = ref(false);
const searchBox = ref();
const queryFrom = ref({});
const pageData = reactive({
  tableData: [],
  tableData2: [],
  keyCount: 0,
  tableConfigerTop: {
    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: "sjly",showSolt:true},
    { label: "数据时间", prop: "sj", showOverflowTooltip: true,},
    { label: "指向地点", prop: "dd", showOverflowTooltip: true,},
    { label: "数据内容", prop: "nr", 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", showSolt: true, showOverflowTooltip: 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;
};

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


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


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 "导出":
      let fjrSfzh = getItem("idEntityCard");
      window.open('/mosty-api/mosty-gsxt/tbGsxtRqfjRy/exportRyfjFxjg?fjrSfzh='+fjrSfzh,'_self')
      break;
    case "批量删除":
      if (ids.value.length == 0) return ElMessage.warning("请选择对应删除的数据");
      ids.value.forEach((id) => { deleteRowBottom(id); });
      break;
  }
};


const changeRadio = () =>{
  showDialog.value = true;
  nextTick(()=>{
    modelList.value.init(active.value)
  })
}


//删除操作
const deleteRow = (id) => {
  pageData.tableData = pageData.tableData.filter(v=>v.id != id);
};

const updateDate = (val) =>{
  let index = pageData.tableData.findIndex(v=>v.id == val.id);
  if(index != -1) pageData.tableData[index] = val;
}

const handelSub = (val) =>{
  pageData.tableData = val;
}

// 智能解析
const intelligent = () => {
  if(pageData.tableData.length == 0) return proxy.$message({ type: "warning", message: "请先选择数据" });
  let content = pageData.tableData[0].nr;
  let obj = {
    "model": "deepseek-reasoner",
    "messages": [
      {
        "role": "system",
        "content":  "# 角色定位\n你是一名资深警务人员，尤其擅长对警情、案件、线索等非结构化文本数据进行阅读理解，并从中提取各种对象特征信息进行结构化，并总结各种对象之间的关联关系。\n##   - person:人物   - id:唯一值   - ryXm:姓名   - rySjhm:手机号   - rySfzh:身份证号   - ryHjdz:户籍地   - ryHzhm:护照号码   - ryXzdz:现居住地址   "
      },
      {
        "role": "user",
        "content": "# 任务\n根据警情信息识别对象信息，以及对象之间的关联关系。最后以json形式输出，不要做任何解释。直接给出完整的json\n## 注意\n- 各种不同类型的对象分别用对象数组存储；\n- 对象之间的关系存储在relation数组中；\n\n# 警情信息\n  - "
      }
  ],
    "max_tokens": 4096,
    "stream": false
  }
  obj.messages[0].content += content + "## 注意点\n- 地址信息能够根据上下文信息按照省、市、县、街道/乡镇、路名分段补全并标准化。例如:四川省 成都市 高新区 桂溪街道 交子大道11号\n- 对象之间的关联关系由对象类型、对象id、关系类型、目标对象类型、目标对象id 5个属性组成。\n"
  btnLoading.value = true;
  ParsingText( obj,(res)=>{
    console.log(res,'===========系欸小蜀');
    
    btnLoading.value = false;
    let content = res.data.choices[0].message.content;
    let message = null;
    try{
      message = content ? JSON.parse(content):''
    }catch(err){
      proxy.$message({ type: "danger",  message: "解析异常，请重新上传解析" });
    }
    if(!message) return proxy.$message({ type: "danger",  message: "解析异常，请重新上传解析" });
    console.log(message,'============params上手');
  })
};


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

onMounted(() => {
  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 .el-radio-group{
      display: flex;
      flex-direction: column;
      padding-left: 10px;
      box-sizing: border-box;
    }
    ::v-deep .el-radio{
      width: 100%;
      margin-right: 0;
      color: #333;
    }
    .cancelBtn{
      text-align: center;
      height: 40px;
      line-height: 40px;
      background: #6da4e8;
      color: #fff;
      border-radius: 4px;
      margin: 10px;
      cursor: pointer;
    }
  }

  .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>
