feat: 事件管理

src/renderer/views/knowledge/components/EventManager/index.vue

@@ -2,7 +2,7 @@
  * @Author: kongbeiwu lishaohua-520@qq.com
  * @Date: 2025-12-22 01:11:57
  * @LastEditors: kongbeiwu lishaohua-520@qq.com
- * @LastEditTime: 2025-12-29 13:20:57
+ * @LastEditTime: 2026-01-03 22:09:31
  * @FilePath: /project/zn-ai/src/renderer/views/knowledge/components/EventManagement/index.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
@@ -23,10 +23,10 @@
         </el-table-column>
         <el-table-column label="操作" align="center" width="150">
           <template #default="scope">
-            <el-button link size="small" type="primary">
+            <el-button link size="small" type="primary" @click="emits('change', '查看图片', scope.row)">
               查看图片
             </el-button>
-            <el-button link size="small" type="primary">
+            <el-button link size="small" type="primary" @click="uploadImageChange(scope.row)">
               上传图片
             </el-button>
           </template>
@@ -35,44 +35,21 @@
     </div>
   </div>
   <!-- 添加事件弹窗 -->
-  <el-dialog v-model="dialogVisible" title="添加事件" width="500" :before-close="handleClose" :modal="false"
-    :close-on-click-modal="false" :close-on-press-escape="false">
-    <div class="p-[20px]">
-      <el-form ref="ruleFormRef" style="max-width: 600px" :model="ruleForm" :rules="rules" label-position="top"
-        label-width="auto">
-        <el-form-item label="事件名称" prop="name">
-          <el-input v-model="ruleForm.name" placeholder="请输入" />
-        </el-form-item>
-        <el-form-item label="事件描述" prop="des">
-          <el-input v-model="ruleForm.des" placeholder="请输入" />
-        </el-form-item>
-        <el-form-item label="生效时间段" prop="time">
-          <el-date-picker type="daterange" v-model="ruleForm.time" range-separator="至" start-placeholder="开始日期"
-            end-placeholder="结束日期">
-            <template #suffix>
-              <el-icon class="el-input__icon">
-                <calendar />
-              </el-icon>
-            </template>
-          </el-date-picker>
-        </el-form-item>
-      </el-form>
-    </div>
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button @click="dialogVisible = false">取消</el-button>
-        <el-button type="primary" @click="submitForm(ruleFormRef)">
-          确认
-        </el-button>
-      </div>
-    </template>
-  </el-dialog>
+  <AddDialog v-model="dialogVisible" />
+  <!-- 上传图片弹窗 -->
+  <UploadImage v-model="dialogVisibleUploadImage" width="80%" />
 </template>
 
 <script setup lang="ts">
 import { ref, reactive } from 'vue';
 import { Plus } from '@element-plus/icons-vue';
-import type { FormInstance } from 'element-plus'
+import AddDialog from './addDialog.vue';
+import UploadImage from './UploadImage.vue';
+
+const emits = defineEmits(["update:change"]);
+
+const dialogVisible = ref(false);
+
 type TableData = {
   address: string
   date: string
@@ -94,45 +71,10 @@ const tableData: TableData[] = [
   },
 ];
 
-
-interface RuleForm {
-  name: string
-  des: string
-  time: string[]
-}
-const ruleFormRef = ref<any>();
-const rules = ref<any>({
-  name: [
-    { required: true, message: '请输入活动名称', trigger: 'blur' },
-    { min: 3, max: 50, message: '长度在 3 到 50 个字符', trigger: 'blur' },
-  ],
-  des: [
-    { required: true, message: '请输入活动描述', trigger: 'blur' },
-    { min: 3, max: 50, message: '长度在 3 到 50 个字符', trigger: 'blur' },
-  ],
-  time: [
-    { required: true, message: '请选择生效时间段', trigger: 'change' },
-  ],
-});
-const ruleForm = reactive<RuleForm>({
-  name: '',
-  des: '',
-  time: [],
-});
-const dialogVisible = ref(false);
-const handleClose = (done: () => void) => {
-  done();
-  // dialogVisible.value = false;
-}
-const submitForm = async (formEl: FormInstance | undefined) => {
-  if (!formEl) return
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      console.log('submit!')
-    } else {
-      console.log('error submit!', fields)
-    }
-  })
+// 上传图片弹窗
+const dialogVisibleUploadImage = ref(false);
+const uploadImageChange = (row) => {
+  dialogVisibleUploadImage.value = true;  
 }
 </script>