知识库界面

src/api/liswork/xmKnowledge/xmKnowledgeApi.ts

@@ -20,4 +20,22 @@ export function queryDetailService(xmdh: string){
          xmdh
       }
     })
+}
+
+//新增数据
+export function addService(params:any){
+   return request({
+      url: '/xmKnowledge/add',
+      method: 'post',
+      params
+    })
+}
+
+//删除数据
+export function delService(params:any){
+   return request({
+      url: '/xmKnowledge/del',
+      method: 'get',
+      params
+    })
 }

src/views/liswork/xmKnowledge/Modify.vue

@@ -1,12 +1,12 @@
 <template>
   <!-- 修改界面 -->
-<el-dialog v-model="visible" width="600px">
+<el-dialog v-model="visible" width="600px" @open="open">
   <template #header>
     {{ title }}
   </template>
   <span class="text-span">项目信息：</span>
   <el-divider style="margin: 5px 0;"/>
-  <el-form ref="form" :model="formData" size="small" class="form-inline" inline label-width="60px">
+  <el-form ref="form" :model="formData" size="small" class="form-inline" inline label-width="70px">
     <el-form-item label="项目代号" prop="xmdh">
       <el-input placeholder="项目代号" v-model="formData.xmdh"></el-input>
     </el-form-item>
@@ -47,12 +47,23 @@
       <el-input placeholder="备注" v-model="formData.bz"></el-input>
     </el-form-item>
     <el-form-item prop="xsbz">
-      <el-checkbox v-model="formData.xsbz" label="显示标志"></el-checkbox> 
+      <el-checkbox v-model="xsbzCheck" label="显示标志"></el-checkbox> 
     </el-form-item> 
   </el-form>
   <span class="text-span">知识库条目：</span>
   <el-divider style="margin: 5px 0;"/>
-  <TableRight :style-config="styleConfig"/>
+  <CustomTable ref="tableRefRight" :data="dataList" :columns="columnsRight" :enable-column-drag="true" @column-drag-end="handleColumnDragEnd"
+      :config="tableConfig" :show-overflow-tooltip="true">
+    <template #reserve="{row}">
+      {{ reserve(row.reserve) }}
+    </template>    
+    <template #textresult="{row}">
+      <el-input v-model="row.textresult" type="textarea" class="full-width-input"></el-input>
+    </template>
+    <template #zd="{row}">
+      <el-input v-model="row.zd" type="textarea" class="full-width-input"></el-input>
+    </template>
+  </CustomTable>  
   <template #footer>
     <div class="dialog-footer">
        <el-button @click="handleCancel">取 消</el-button>
@@ -64,16 +75,22 @@
 </template>
 
 <script setup lang="ts">
-import TableRight from './TableData.vue'
+import CustomTable from '@/components/elTable/index.vue'
+import { addService } from '@/api/liswork/xmKnowledge/xmKnowledgeApi'
+import { ElMessage } from 'element-plus'
 
 const props = defineProps({
   title:{
     type: String,
     default: ''
+  },
+  type: {
+    type: String,
+    default: ''
   }
 })
-
 const visible = defineModel()
+const emit = defineEmits(['closeWithReturn'])
 
 const formData = ref({
   xmdh: '',
@@ -92,18 +109,86 @@ const formData = ref({
   xsbz: ''
 })
 
-const styleConfig = ref({
+
-  textresultWidth: 300,
+const columnsRight = ref([
-  zdWidth: 300,
+  { prop: 'reserve', label: '类别', visible: true, align: 'center',slot: 'reserve', width: 50 ,showOverflowTooltip: false},
-  tableHeight: '40vh'
+  { prop: 'textresult', label: '说明', visible: true, align: 'center',slot: 'textresult', width: 300,showOverflowTooltip: false},
+  { prop: 'zd', label: '指导建议', visible: true, align: 'center',slot: 'zd', width: 200,showOverflowTooltip: false },
+])
+
+const tableConfig = ref({
+  border: true, // 边框
+  height: '40vh', // 高度
+  highlightCurrentRow: true, // 高亮当前行
+  // cellStyle: cellStyleHd
 })
 
+const xsbzCheck = computed({
+  get() {
+    return formData.value.xsbz === '1'
+  },
+  set(checked){
+    formData.value.xsbz = checked ? '1' : '0';
+  }
+})
+
+//退拽属性
+const handleColumnDragEnd = (data: any) => {
+  // 更新列配置
+  columnsRight.value = data.columns;
+}
+
+
+const dataList = ref<any>([])
+
+
+const reserve = (reserve:string) => {
+  switch(reserve){
+    case '1':
+      return '综述'
+    case 'H':
+      return '偏高'
+    case 'L':  
+      return '偏低'
+    case 'P':
+      return '阳性'
+    case 'Q':
+      return '弱阳性'
+    case 'J':
+      return '危机'
+    case 'N':
+      return '阴性'
+  }
+}
+
 const handleCancel = () => {
+  visible.value = false
+}
+
+const handleOk = async () => {
+  //保存数据
+  console.log(formData.value)
+  await addService(formData.value);
+  ElMessage.success('保存成功！')
+  visible.value = false
 
 }
 
-const handleOk = () => {
+const open = () => {
+  if(props.type === '新增'){
+    dataList.value = [
+      {reserve:'1',textresult:'',yxjs:'',cjyy:'',zd:''},
+      {reserve:'H',textresult:'',yxjs:'',cjyy:'',zd:''},
+      {reserve:'L',textresult:'',yxjs:'',cjyy:'',zd:''},
+      {reserve:'P',textresult:'',yxjs:'',cjyy:'',zd:''},
+      {reserve:'Q',textresult:'',yxjs:'',cjyy:'',zd:''},
+      {reserve:'J',textresult:'',yxjs:'',cjyy:'',zd:''},
+      {reserve:'N',textresult:'',yxjs:'',cjyy:'',zd:''},
+    ]
+  }else{
 
+  }
+    
 }
 
 </script>

src/views/liswork/xmKnowledge/index.vue

@@ -25,14 +25,15 @@
   </el-col>
 </el-row>
 
-<Modify v-model="modifyVisible" :title="modifyTitle"/>
+<Modify ref="modifyRef" v-model="modifyVisible" :title="modifyTitle" :type="modifyType" @close-with-return="closeWithReturn"/>
 </template>
 
 <script setup lang="ts">
 import CustomTable from '@/components/elTable/index.vue'
-import {queryService,queryDetailService} from '@/api/liswork/xmKnowledge/xmKnowledgeApi'
+import {queryService,queryDetailService,delService} from '@/api/liswork/xmKnowledge/xmKnowledgeApi'
 import TableRight from './TableData.vue'
 import Modify from './Modify.vue'
+import { ElMessage,ElMessageBox } from 'element-plus';
 
 const dataListLeft = ref([]);
 const dataListRight = ref([]);
@@ -63,7 +64,9 @@ const tableConfig = ref({
 
 const modifyVisible = ref(false)
 const modifyTitle = ref('')
-
+const modifyType = ref('')
+const modifyRef = ref()
+const selectRow = ref()
 
 //退拽属性
 const handleColumnDragEnd = (data: any) => {
@@ -93,6 +96,10 @@ const formData = ref({
   js: ''
 })
 
+const closeWithReturn = () =>{
+  getList()
+}
+
 const handleSubmit = (event: any) => {
   event.preventDefault();
 }
@@ -100,6 +107,7 @@ const handleSubmit = (event: any) => {
 const onClick = async (row:any) => {
   const res = await queryDetailService(row.xmid);
   dataListRight.value = res.data
+  selectRow.value = row
 }
 
 const onDBClick = ()=>{
@@ -109,10 +117,17 @@ const onDBClick = ()=>{
 const onAddClick = ()=> {
   modifyVisible.value = true
   modifyTitle.value = '新增'
+  modifyType.value = '新增'
+
 }
 
-const onDelClick = () => {
+const onDelClick = async () => {
-
+  if(selectRow.value){
+    await ElMessageBox.confirm('是否要删除选中的数据?','警告',{confirmButtonText: '确定',cancelButtonText: '取消',});
+    await delService(selectRow.value.xmid)
+    ElMessage.success('删除成功！')
+  }
+ 
 }
 
 const onQueryClick = () => {