sgxt_web/src/views/backOfficeSystem/SemanticAnalysis/components/showDetails.vue

<template>
  <div style="padding: 10px 15px;">
    <div class="flex align-center just-between" style="width: 100%;">
      <div class="searchToolTitle">
        {{ title }}
      </div>
      <div>
        <el-button type="primary" plain @click="handleClose">关闭</el-button>

      </div>
    </div>
    <div v-for="(item, index) in model" :key="index">
      <div class="searchTsubTitle">{{ data[item.value] }}</div>
      <formNewModel v-model="item.model" :formList="item.inputs" ref="elform" :rules="rules" />
    </div>
  </div>
</template>

<script setup>
import { ref, reactive, toRaw, computed, watch, nextTick, onMounted,getCurrentInstance } from "vue";
import formNewModel from "./formNewModel.vue"
import emitter from "@/utils/eventBus.js";
const { proxy } = getCurrentInstance()
const rules = ref([])
const elform = ref()
const props = defineProps({
  listData: {
    type: String,
    default: ''
  }, title: {
    type: String,
    default: ''
  }

})
const data = {
  10: "实体识别分析",
  20: "事件识别分析",
  30: "关系识别分析",
  40: "特征识别分析",
}
const model = ref()
function simpleExtractJSON(text) {
  // 找到第一个 [
  const startIndex = text.indexOf('[');
  if (startIndex === -1) return null;

  // 找到最后一个完整的 }
  let lastBraceIndex = text.lastIndexOf('}');
  if (lastBraceIndex === -1) return null;

  // 确保 } 后面没有其他字符（除了空格和换行）
  let endIndex = lastBraceIndex + 1;

  // 截取从 [ 到最后一个 } 的内容，然后加上 ]
  let jsonString = text.substring(startIndex, endIndex) + ']';

  try {
    return JSON.parse(jsonString);
  } catch (error) {
    console.error("修改JSON格式复失败:", error);
    return null;
  }
}
onMounted(() => {
  const json =props.listData ;
const jsonString = JSON.parse(json);
  if (jsonString) {
    const jsonObject = jsonString;
    console.log(jsonObject);
    model.value = jsonObject.reduce((acc, cur) => {
      const key = Object.keys(cur)[0];
      const prefix = key.substring(0, 2);
      if (!acc[prefix] && prefix !== '50' && prefix !== '60') {
        acc[prefix] = {
          inputs: [],
          model: {},
          value: prefix
        };
      }
      if (prefix === '50' || prefix === '60') {
        acc[10].inputs.push({ label: cur[key].name, prop: key, type: "input", width: "33%" });
        acc[10].model[key] = cur[key].content? cur[key].content : '-';
      } else {
        acc[prefix].inputs.push({ label: cur[key].name, prop: key, type: "input", width: "33%" });
        acc[prefix].model[key] = cur[key].content=='-'||cur[key].content==''||cur[key].content=='无'?  '/':cur[key].content ;
      }

      return acc;
    }, {});
  } else {
    model.value = []
    proxy.$message({ type: "error", message: "解析失败" });
  }
})
const handleClose = () => {
  emitter.emit('showDetails', true)
}
</script>

<style lang="scss" scoped>
.searchToolTitle {
  font-size: 18px;
  font-family: 'verdana';
  position: relative;
  color: #000;
}

.searchToolTitle::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 80px;
  border-radius: 5px;
  height: 4px;
  background-color: #0386fb;
  background: linear-gradient(90deg, #0aa1ff 2%, #ffffff 100%);
}

.searchTsubTitle {
  font-size: 16px;
  font-family: 'verdana';
  color: #000;
  margin: 10px 0;
}
</style>