From f4354c5a98c6a3bdb4f355b107e2421848f1426b Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期三, 13 十一月 2024 17:31:52 +0800
Subject: [PATCH] Merge branches 'test' and 'test' of http://47.103.154.90:83/r/WI/Web.Admin.V1.0 into test
---
src/views/project/yw/dataManage/graph/AddGraph.vue | 207 ++++++++++++++++++++++++++++++++-------------------
1 files changed, 129 insertions(+), 78 deletions(-)
diff --git a/src/views/project/yw/dataManage/graph/AddGraph.vue b/src/views/project/yw/dataManage/graph/AddGraph.vue
index 44eb965..b1f1c63 100644
--- a/src/views/project/yw/dataManage/graph/AddGraph.vue
+++ b/src/views/project/yw/dataManage/graph/AddGraph.vue
@@ -1,119 +1,170 @@
<template>
- <el-card shadow="hover" :body-style="{ paddingBottom: '0' }" class="h100 right-card w100">
- <div class="bg-[#fff] mb-[10px] flex items-center">
- <el-button style="margin-left: 8px; width: 40px" text @click="handleExitFlow">
+ <div class="h100 overflow-y-auto p-[16px]">
+ <div class="mb-[10px] flex items-center">
+ <el-button style="margin-left: 8px; width: 40px" link @click="handleExitFlow">
<el-icon style="font-size: 24px !important">
<ArrowLeft />
</el-icon>
</el-button>
<span class="text-[24px] text-[#26244c] font-[700]">{{ state.detailTitle }}</span>
</div>
- <div class="p-[20px] set-form-height">
- <el-form :model="state.categoryForm" label-width="120px" label-position="left">
- <el-form-item label="瀵煎叆绫荤洰:">
- <label>{{ state.categoryForm.ImportCategory }}</label>
- </el-form-item>
- <el-form-item label="绫荤洰绫诲瀷:">
- <label>{{ state.categoryForm.CategoryType }}</label>
- </el-form-item>
- <el-form-item label="瀵煎叆鏂瑰紡:">
- <el-upload
- ref="uploadRef"
- v-model:file-list="fileList"
- class="upload-demo w-[530px]"
- drag
- :multiple="true"
- :auto-upload="false"
- :accept="state.allowType"
- :limit="state.limit"
- :before-upload="beforeAvatarUpload"
- >
- <el-icon class="el-icon--upload"><upload-filled /></el-icon>
- <div class="el-upload__text">
- <em>鐐瑰嚮鎴栨嫋鎷戒笂浼犳枃浠�</em>
- </div>
- <template #tip>
- <div class="el-upload__tip">
- 鏀寔鏍煎紡锛歿{ state.allowType }};闄愬埗澶у皬{{ state.size }}M,鏈�澶氫笂浼爗{ state.limit }}涓枃浠�
- </div>
- </template>
- </el-upload>
- </el-form-item>
- <el-form-item label="鏂囨。璇嗗埆:">
- <div class="bg-[#f6f5ff] border-[1px] border-solid border-[#0062be] py-[12px] w-[215px] px-[16px] rounded-lg cursor-pointer">
- <el-radio-group v-model="state.categoryForm.DocumentRecognition">
- <el-radio value="1" size="large">
- <span class="font-[700] text[14px]">鏂囨。鏅鸿兘瑙ｆ瀽</span>
- </el-radio>
- </el-radio-group>
- <el-tooltip :content="state.demoDesc" placement="top" effect="light" popper-class="set_tooltip_demo">
- <div class="text-[#878aab] text-[12px] mx-0 mt-[2px] mb-0 set-desc">
- {{ state.demoDesc }}
- </div>
- </el-tooltip>
- </div>
- </el-form-item>
- </el-form>
+ <div class="relative">
+ <div class="relative transition-[opacity 0.3s]">
+ <div class="set-form-height">
+ <div class="flex flex-col">
+ <el-form
+ :model="state.categoryForm"
+ label-width="120px"
+ label-position="left"
+ :rules="state.categoryFormRules"
+ ref="categoryFormRef"
+ >
+ <el-form-item label="瀵煎叆绫荤洰:">
+ <label>{{ state.categoryForm.ImportCategory }}</label>
+ </el-form-item>
+ <el-form-item label="绫荤洰绫诲瀷:">
+ <label>{{ state.categoryForm.CategoryType }}</label>
+ </el-form-item>
+ <el-form-item label="瀵煎叆鏂瑰紡:" prop="importType">
+ <el-upload
+ ref="uploadRef"
+ class="upload-demo w-[530px]"
+ :http-request="uploadFile"
+ drag
+ :accept="state.allowType"
+ :on-remove="handleRemove"
+ >
+ <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+ <div class="el-upload__text">
+ <em>鐐瑰嚮鎴栨嫋鎷戒笂浼犳枃浠�</em>
+ </div>
+ <template #tip>
+ <div class="el-upload__tip">鏀寔鏍煎紡锛歿{ state.allowType }};闄愬埗澶у皬{{ state.size }}M</div>
+ </template>
+ </el-upload>
+ </el-form-item>
+ </el-form>
- <div class="set-form-footer">
- <el-button type="primary" @click="onSubmit">纭� 璁�</el-button>
- <el-button>鍙栨秷</el-button>
+ <div class="set-form-footer">
+ <el-button type="primary" @click="onSubmit">纭� 璁�</el-button>
+ <el-button @click="handleExitFlow">鍙栨秷</el-button>
+ </div>
+ </div>
+ </div>
</div>
</div>
- </el-card>
+ </div>
</template>
<script setup lang="ts">
-import { reactive, ref } from 'vue';
-import { useRouter } from 'vue-router';
-import type { FormInstance, UploadProps, UploadUserFile, UploadRawFile } from 'element-plus';
-
+import type { UploadUserFile } from 'element-plus';
+import { ElMessage } from 'element-plus';
+import moment from 'moment';
+import { onMounted, reactive, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { add_knowledge_file } from '/@/api/knowledge/group';
+import mittBus from '/@/utils/mitt';
+import { convertFileSize } from '/@/utils/util';
+const uploadFileChange = (rule, value, callback) => {
+ if (fileList.value.length === 0) {
+ return callback('璇烽�夋嫨闇�瑕佷笂浼犵殑鏂囦欢');
+ } else {
+ return true;
+ }
+};
// 瀹氫箟鍙橀噺鍐呭
const state = reactive({
detailTitle: '瀵煎叆鏁版嵁',
categoryForm: {
- ImportCategory: '榛樿绫荤洰',
+ ImportCategory: '',
CategoryType: '鏈湴绫荤洰',
DocumentRecognition: '1',
},
- allowType: '.pdf,.doc,.docx,.txt,.md,.pptx,.ppt',
+ // allowType: '.pdf,.doc,.docx,.txt,.md,.pptx,.ppt',
+ allowType: 'md',
limit: 5,
size: 5,
- demoDesc: '浣跨敤闃块噷浜戞枃妗ｆ櫤鑳借В鏋愭湇鍔℃嵁瑙ｆ瀽鏂囨。锛屾娊鍙栨枃妗ｅ唴瀹广�佸眰绾х粨鏋勭瓑淇℃伅銆�',
+ categoryFormRules: {
+ importType: [{ required: true, validator: uploadFileChange, trigger: 'change' }],
+ },
+ fileInfo: {} as any,
});
const fileList = ref<UploadUserFile[]>([]);
+const categoryFormRef = ref(null);
+const uploadRef = ref(null);
const router = useRouter();
+const route = useRoute();
//杩斿洖
const handleExitFlow = () => {
//鏄惁鏄剧ず杩斿洖
router.back();
+ categoryFormRef.value.resetFields();
+ uploadRef.value.clearFiles();
+ fileList.value = [];
};
-const flag = ref(true);
-const beforeAvatarUpload = () => {
- fileList.value.forEach((item: any) => {
- console.log(item);
- const type = item.name.split('.')[1];
- if (state.allowType.indexOf(type) == -1) {
- ElMessage({
- type: 'error',
- message: `鏍煎紡閿欒,鏀寔鏍煎紡:${state.allowType}!`,
- });
- flag.value = false;
- return;
- } else if (item.size / 1024 / 1024 > state.size) {
- ElMessage.error(`鏂囦欢鏈�澶�${state.size}MB!`);
- flag.value = false;
- return;
+const uploadFile = (file: UploadUserFile) => {
+ state.fileInfo = file?.file;
+ fileList.value.push(file);
+ categoryFormRef.value.validateField(['importType']); //绉婚櫎涓婁紶鏂囦欢閿欒鎻愮ず!杩欐槸閲嶇偣锛侊紒
+};
+// 鏂囦欢鍒楄〃绉婚櫎鏂囦欢鏃剁殑閽╁瓙
+const handleRemove = (file) => {
+ // 4銆佸垹闄ゆ枃浠舵椂鍚屾椂鍒犻櫎姝ゆ枃浠跺凡涓婁紶鐨勬枃浠秈d锛堟鎿嶄綔瑙嗗叿浣撴儏鍐碉級
+ fileList.value.forEach((item, index) => {
+ if (item.file == file.raw) {
+ fileList.value.splice(index, 1);
}
});
- return flag.value;
};
//纭
-const onSubmit = () => {};
+const onSubmit = async () => {
+ const valid = await categoryFormRef.value.validate().catch(() => {});
+ if (!valid) return;
+ const group_id = route.query.group_id;
+ if (group_id == null || group_id == '' || group_id == undefined) return;
+ const group_name = state.fileInfo?.name;
+ const group_type = group_name.split('.').pop();
+ const group_time = moment(state.fileInfo?.lastModifiedDate).format('YYYY-MM-DD HH:mm:ss');
+ const group_size = convertFileSize(state.fileInfo?.size);
+ const data = new FormData();
+ fileList.value.forEach((item: any) => {
+ data.append('file', item.file);
+ });
+ data.append('group_id', group_id);
+ const res = await add_knowledge_file(data);
+ if (res.json_ok) {
+ ElMessage.success('瀵煎叆鎴愬姛');
+ let obj = {
+ id: res.file_id,
+ name: group_name,
+ type: group_type,
+ time: group_time,
+ size: group_size,
+ };
+
+ mittBus.emit('addGraphObj', obj);
+ router.push({
+ name: 'GraphIndex',
+ });
+ uploadRef.value.clearFiles();
+ } else {
+ ElMessage.error(res.json_msg);
+ }
+};
+onMounted(() => {
+ const group_title = route.query.title;
+ state.categoryForm.ImportCategory = group_title;
+});
</script>
<style scoped lang="scss">
.set-form-height {
height: calc(100% - 62px);
+ background: #fff;
+ border-radius: 16px 16px 0 0;
+ flex: 1;
+ margin: 0 24px 64px;
+ overflow-y: auto;
+ padding: 20px;
}
.set-desc {
-webkit-line-clamp: 2;
--
Gitblit v1.9.3