From b01a1c6b97a120c7d7fc2a19a23ae55121277fde Mon Sep 17 00:00:00 2001
From: yangyin <1850366751@qq.com>
Date: 星期五, 06 九月 2024 16:49:15 +0800
Subject: [PATCH] 新增数据管理的字段
---
src/views/project/yw/dataManage/knowledge/viewKnowBase/ViewFile.vue | 187 +++++++++++++++++++++++++++++++---------------
1 files changed, 127 insertions(+), 60 deletions(-)
diff --git a/src/views/project/yw/dataManage/knowledge/viewKnowBase/ViewFile.vue b/src/views/project/yw/dataManage/knowledge/viewKnowBase/ViewFile.vue
index a5cb6dc..53c6ee9 100644
--- a/src/views/project/yw/dataManage/knowledge/viewKnowBase/ViewFile.vue
+++ b/src/views/project/yw/dataManage/knowledge/viewKnowBase/ViewFile.vue
@@ -2,98 +2,137 @@
<div class="flex flex-col h100">
<div class="h100" v-show="!state.showKnowledgeForm">
<div class="mb-[10px] flex flex-shrink-0 items-center">
- <el-button style="margin-left: 8px; width: 40px" link @click="handleExitFlow">
+ <el-button style="margin-left: 8px; width: 40px" link @click="handleShowKnowledge">
<el-icon style="font-size: 24px !important">
<ArrowLeft />
</el-icon>
</el-button>
<span class="text-[24px] text-[#26244c] font-[700]">{{ state.knowledgeInfo.knowledge_title }}</span>
</div>
- <div class="set-table-height"></div>
+ <div class="set-table-height">
+ <div class="mx-0 mt-[12px] mb-[16px] flex justify-between items-center">
+ <div class="flex-col">
+ <el-input
+ v-model="knowledgeFileForm.title"
+ style="width: 230px; margin-right: 10px; background: #ffffff; border-radius: 6px; transition: all 0.2s"
+ placeholder="鎼滅储鐭ヨ瘑搴撳悕绉�"
+ clearable
+ ></el-input>
+ <el-button type="primary" icon="ele-Search" @click="handleQueryTable"> 鏌ヨ </el-button>
+ <el-button icon="ele-Refresh" @click="resetQuery">閲嶇疆 </el-button>
+ </div>
+ </div>
+ <div class="relative transition-[opacity 0.3s]">
+ <div class="flex flex-wrap gap-[12px] mt-4 box-border">
+ <div
+ class="set_slice"
+ v-for="(item, index) in displayTableData"
+ :key="index"
+ @mouseover="mouseOver($event, item)"
+ @mouseleave="mouseLeave()"
+ >
+ <div class="flex justify-between">
+ <div class="items-center font-[500] flex">{{ item.title }}</div>
+ <el-switch v-model="state.isSliceValueTime" class="ml-2" size="small" />
+ </div>
+ <div class="set_content">{{ item.content }}</div>
+ <div :class="{ viewFileClassHover: state.selectSliceID == item.id }">
+ <el-button type="primary" link style="color: #0062be" @click="viewSliceFile(item)">{{
+ item.id == state.selectSliceID ? '鏌ョ湅璇︽儏' : ''
+ }}</el-button>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
</div>
-
- <div class="set-form-footer" v-show="state.showKnowledgeForm">
- <el-button @click="importCompleted" type="primary">瀵煎叆瀹屾垚</el-button>
- <el-button @click="handleShowKnowledge">鍙栨秷</el-button>
- </div>
+ <el-dialog v-model="state.isShowSliceDetail" :title="state.knowLedgeDetailForm?.title" width="50%" :before-close="handleClose">
+ <el-form :model="state.knowLedgeDetailForm" label-position="right">
+ <el-form-item label="鍒囩墖鍐呭">
+ <el-input v-model="state.knowLedgeDetailForm.name" />
+ </el-form-item>
+ <el-form-item label="鍥剧墖">
+ <el-input v-model="state.knowLedgeDetailForm.region" />
+ </el-form-item>
+ </el-form>
+ <template #footer>
+ <div class="dialog-footer">
+ <el-button @click="handleClose">鍙栨秷</el-button>
+ </div>
+ </template>
+ </el-dialog>
</div>
</template>
<script setup lang="ts">
-import { ElMessage } from 'element-plus';
import { onMounted, reactive, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
-import { add_docvector_file } from '/@/api/knowledge/docvector';
-const viewKnowledgeTableRef = ref();
+import { useQueryTable } from '/@/hooks/useQueryTable';
+
const router = useRouter();
const route = useRoute();
-const knowledgeTableData = ref([]);
-const knowledgeFileRef = ref();
// 瀹氫箟鍙橀噺鍐呭
const state = reactive({
knowledgeInfo: {
knowledge_title: '鏌ョ湅鏂囦欢',
knowledge_id: '',
- knowledge_import_data: '瀵煎叆鏁版嵁',
} as any,
- knowledgeForm: {
- segmentationMode: 1,
- },
+ knowLedgeDetailForm: {},
showKnowledgeForm: false,
knowledgeFile: {},
+ isSliceValueTime: true,
+ selectSliceID: null,
+ isShowSliceDetail: false,
});
-//杩斿洖鍒扮煡璇嗗簱鍒楄〃
-const handleExitFlow = () => {
- //鏄惁鏄剧ず杩斿洖
- router.back();
-};
//杩斿洖鍒扮煡璇嗗簱鏌ョ湅椤甸潰
const handleShowKnowledge = () => {
- state.showKnowledgeForm = false;
+ router.back();
};
-//#region ====================== 鎼滅储琛ㄦ牸锛屽琛ㄦ牸鎺掑簭 ======================
-const graphQueryParams = ref({
- title: '',
-});
-// const { resetQuery, handleQueryTable, displayTableData } = useQueryTable(getSliceFile, graphQueryParams, () => {
-// displayTableData.value = knowledgeTableData.value;
-// });
-//#endregion
+const handleClose = () => {
+ state.isShowSliceDetail = false;
+};
//#region ====================== 鑾峰彇鍒囨崲鐨勬暟鎹� ======================
+const mouseOver = ($event, row) => {
+ state.selectSliceID = row.id;
+};
+const mouseLeave = () => {
+ state.selectSliceID = null;
+};
const getSliceFile = async () => {
const res = 0;
};
+const viewSliceFile = (row) => {
+ state.isShowSliceDetail = true;
+ state.knowLedgeDetailForm = row;
+};
//#endregion
-//#region ====================== 瀵煎叆鐭ヨ瘑搴撴暟鎹� ======================
-const importKnowledgeData = () => {
- state.showKnowledgeForm = true;
- getImportantFileTreeData(true);
-};
-//瀵煎叆瀹屾垚
-const importCompleted = async () => {
- // 涓婁紶鏂囦欢
- if (multipleSelection.value.length == 0) return ElMessage.warning('璇峰厛閫夋嫨鏂囦欢');
- let isCreateIndex = false;
- const file_id = multipleSelection.value.map((v) => v.id).join(',');
- knowledgeTableData.value.forEach((element) => {
- if (element.id == file_id) {
- ElMessage.warning('鏂囦欢宸插瓨鍦紝璇烽�夋嫨鍏朵粬鏂囦欢');
- isCreateIndex = true;
- }
- });
- if (isCreateIndex) return;
- const res = await add_docvector_file({
- knowlg_id: state.knowledgeInfo.knowledge_id,
- file_id: file_id,
- });
- if (res.json_ok) {
- ElMessage.success('瀵煎叆鏁版嵁鎴愬姛');
- state.showKnowledgeForm = false;
- getKnowledgeFileData();
- //娓呯┖琛ㄥ崟
- knowledgeFileRef.value.resetFields();
- }
-};
+//#region ====================== 鎼滅储琛ㄦ牸锛屽琛ㄦ牸鎺掑簭 ======================
+const sliceFileData = ref([
+ {
+ content:
+ 'R SHLMGE for better lifeShimge Pump Industry(Zhejiang) Co.,Ltd Headquarter address: Dayangcheng Industrial Zone, Daxi Town, Wenling City, Zhejiang Province, 317525, China Tel:+86- 576- 86331536/ 86335366/ 86333138Fax:+86- 576- 86335467Email: shichangbu@shimge.com Webite: www.shimge.comSHIMGE PUMP INDUSTRY(ZHEJIANG) CO.,LTD.VISION& MISSIONProvide leading fluid solutions andimprove the quality of life for everyone.////////SHIMGENSGW-Type Standard End Suction Centrifugal PumpNSGW TypeContents01Company Profile03Product Overview05Highlight Features07Type Chart09Standard Parameter Table',
+ id: 1,
+ title: '鏂囦欢1',
+ },
+ {
+ content:
+ 'NSGW pump is used for pumping clean water and liquid with physical and chemical properties similar to water, and is suitable for factories, mines, urban water supply and drainage, air conditioning, fire fighting, and agricultural irrigation. Pumps with the same specifications can have different performance due to the change of different impeller outer diameters(represented by adding A, B, C etc. after the pump model). The pump has simple structure, reliable performance, small size, light weight, good cavitation resistance, low power consumption and convenient use and maintenance. It has a wide',
+ id: 2,
+ title: '鏂囦欢2',
+ },
+ {
+ content:
+ 'good cavitation resistance, low power consumption and convenient use and maintenance. It has a wide range of versatil-ity. The whole series have 60 specifications, but only four types of shafts are used. The shafts, bearings, shaft sleeves, shaft seals and impeller fasteners of the same specification can be interchanged. There are only five types of suspension for the whole series of pumps too.',
+ id: 3,
+ title: '鏂囦欢3',
+ },
+]);
+const knowledgeFileForm = ref({
+ title: '',
+});
+const { resetQuery, handleQueryTable, displayTableData } = useQueryTable(sliceFileData, knowledgeFileForm, () => {
+ displayTableData.value = sliceFileData.value;
+});
//#endregion
onMounted(() => {
@@ -111,6 +150,34 @@
overflow-y: auto;
padding: 20px 24px;
box-sizing: border-box;
+ .set_slice {
+ border: 1px solid rgba(135, 138, 171, 0.15);
+ border-radius: 16px;
+ padding: 12px 20px;
+ width: calc(33.33333% - 8px);
+ &:hover {
+ border-color: #0062be;
+ }
+ .viewFileClassHover {
+ border-top: 1px solid hsla(0, 0%, 94%, 0.5);
+ display: flex;
+ justify-content: space-between;
+ margin-top: 6px;
+ padding-top: 8px;
+ background-color: #fff;
+ }
+ }
+ .set_content {
+ color: rgba(38, 36, 76, 0.8);
+ font-size: 12px;
+ line-height: 22px;
+ margin: 6px 0 0;
+ min-height: 88px;
+ -webkit-line-clamp: 4;
+ display: -webkit-box;
+ overflow: hidden;
+ -webkit-box-orient: vertical;
+ }
}
.set-file-height {
height: calc(100% - 48px);
--
Gitblit v1.9.3