sgxt_web/src/views/backOfficeSystem/HumanIntelligence/FollowLeads/addForm.vue

<template>
  <div class="dialog" v-if="dialogForm">
    <div class="head_box">
      <span class="title">线索{{ title }}</span>
      <div>
        <el-button @click="close">关闭</el-button>
      </div>
    </div>
    <div style="display: flex;width: 100%;" v-loading="loading">
      <div class="form_cnt">
        <FormMessage :disabled="disabled" v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
        </FormMessage>
      </div>
    </div>
  </div>
</template>

<script setup>

import FormMessage from "@/components/aboutTable/FormMessage.vue";
import { qbcjAdd, qbcjUpdate, qbcjSelectByid } from "@/api/Intelligence.js";
import pursueContent from "@/views/backOfficeSystem/HumanIntelligence/components/pursueContent.vue";
import { ref, defineExpose, onMounted, defineEmits, watch, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance()
const emit = defineEmits(["getList"]);
const props = defineProps({
  dict: Object,
  titleData: {
    type: String,
    default: ""
  },
});
const loading = ref(false)
const dialogForm = ref(false); //弹窗
const formData = ref();


watch(() => dialogForm.value, (val) => {
  if (val) {
    formData.value = [
      { label: "情报标题", prop: "qbmc", type: "input", width: '45%' },
      { label: "转线索时间", prop: "zxssj", type: "datetime", width: '45%' },
      { label: "线索编号", prop: "xsBh", type: "input", width: '45%' },
      { label: "采集类型", prop: "cjLx", type: "select", options: props.dict.D_GS_XS_LX, width: '45%' },
      { label: "情报类型", prop: "qblx", type: "select", options: props.dict.D_GS_XS_LX, width: '45%' },
      { label: "情报内容", prop: "qbnr", type: "textarea", width: '100%' },
    ]
  }
}, { deep: true })
const listQuery = ref({}); //表单
const elform = ref();
onMounted(() => {
})
const addForm = ref()
const msgeDat = ref()
const title = ref("")
const showPj = ref(false)
const disabled = ref(false)
// 初始化数据
const init = (type, row) => {
  console.log(row,"测试");

  title.value = type == "add" ? "新增" : type == "info" ? "详情" : "编辑"
  disabled.value = type == 'info' ? true : false
  dialogForm.value = true;
  if (type == 'info' || type == 'edit') {
    showPj.value = true
    listQuery.value = row
  }
};

const close = () => {
  dialogForm.value = false;
};

defineExpose({ init });
</script>

<style lang="scss" scoped>
@import "~@/assets/css/layout.scss";
@import "~@/assets/css/element-plus.scss";

::v-deep .el-tabs--card>.el-tabs__header .el-tabs__item.is-active {
  color: #0072ff;
  background: rgba(0, 114, 255, 0.3);
}

.boxlist {
  width: 99%;
  height: 225px;
  margin-top: 10px;
  overflow: hidden;
}

::v-deep .avatar-uploader {
  display: flex;
  align-items: center;
}

::v-deep .el-upload-list {
  margin-left: 20px;
  display: flex;
  align-items: center;
}

::v-deep .el-upload-list__item-name .el-icon {
  top: 3px;
}

.form_cnt {
  // width: 75%;
  flex: 1;
}

.person {
  padding-left: 20px;
  width: 25%;
  // height: 100vh;
}

/* 补充信息样式 */
.supplement-title {
  font-size: 14px;
  font-weight: 500;
  color: #333;
  margin: 16px 0 10px 0;
  padding-left: 5px;
  border-left: 3px solid #24b6dd;
}

.supplement-list {
  margin-left: 5px;
}

.supplement-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  background-color: #f5f7fa;
  border: 1px solid #e4e7ed;
  border-radius: 4px;
  margin-bottom: 8px;
  margin-right: 10px;
  transition: all 0.3s ease;
}

.supplement-item:hover {
  background-color: #ecf5ff;
  border-color: #c6e2ff;
}

.supplement-content {
  flex: 1;
  font-size: 14px;
  color: #606266;
  line-height: 1.5;
}

.supplement-actions {
  display: flex;
  gap: 12px;
}

.action-icon {
  font-size: 16px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.edit-icon {
  color: #24b6dd;
}

.edit-icon:hover {
  color: #409eff;
  transform: scale(1.1);
}

.delete-icon {
  color: #f56c6c;
}

.delete-icon:hover {
  color: #f78989;
  transform: scale(1.1);
}
::v-deep  .el-textarea.is-disabled .el-textarea__inner{
  color: #000;
}
</style>