From 2c39f839ba8f9df4fa70f7423b3c2e027cdeb32a Mon Sep 17 00:00:00 2001 From: 杨磊 <505174330@qq.com> Date: 星期四, 03 七月 2025 14:53:11 +0800 Subject: [PATCH] 1 --- src/views/model/children/landerModel.vue | 624 ++++++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 556 insertions(+), 68 deletions(-) diff --git a/src/views/model/children/landerModel.vue b/src/views/model/children/landerModel.vue index e8d3bae..6485744 100644 --- a/src/views/model/children/landerModel.vue +++ b/src/views/model/children/landerModel.vue @@ -1,14 +1,16 @@ <template> <div class="landerBox"> <div class="landerTopBox"> - <el-button :icon="Plus">鏂板缓</el-button> + <el-button :icon="Plus" @click="dialogFormVisible = true">鏂板缓</el-button> <el-input v-model="input4" style="width: 300px" placeholder="璇疯緭鍏ュ叧閿瓧鎼滅储" > <template #suffix> - <el-icon class="el-input__icon"><search /></el-icon> + <el-icon class="el-input__icon" @click="getTableData" + ><search + /></el-icon> </template> </el-input> </div> @@ -21,93 +23,579 @@ style="width: 100%" @selection-change="handleSelectionChange" class="landerTable" + v-loading="isLoading" > <el-table-column type="selection" width="55" /> - <el-table-column prop="index" label="搴忓彿" width="70" /> - <el-table-column prop="date" label="Date" width="180" /> - <el-table-column prop="name" label="Name" width="180" /> - <el-table-column prop="address" label="Address" /> + <el-table-column prop="id" label="搴忓彿" width="70" /> + <el-table-column prop="ModelName" label="妯″瀷鍚嶇О" width="180" /> + <el-table-column prop="JointData" label="鍏宠妭鏁版嵁閲�" width="180" /> + <el-table-column prop="IsSimulation" label="鏄惁鍙豢鐪�" width="180"> + <template #default="scope"> + <span>{{ scope.row.IsSimulation ? "鏄�" : "鍚�" }}</span> + </template> + </el-table-column> + <el-table-column prop="createDate" label="鍒涘缓鏃堕棿" width="180" /> + <el-table-column prop="creator" label="鍒涘缓浜�"> + <template #default="scope"> + <span>{{ scope.row.creator.Name }}</span> + </template> + </el-table-column> + <el-table-column prop="option" label="鎿嶄綔"> + <template #default="scope"> + <div> + <el-button + type="primary" + size="small" + @click="handleEdit(scope.row)" + >缂栬緫</el-button + > + <el-button + type="danger" + size="small" + @click="handleDelete(scope.row)" + >鍒犻櫎</el-button + > + <el-button + type="success" + size="small" + @click="handlePreview(scope.row)" + >棰勮</el-button + > + <!-- <el-button + v-if="scope.$index !== 0" + type="success" + size="small" + @click="handleMoveUp(scope.row)" + >涓婄Щ</el-button + > + <el-button + v-if="scope.$index !== tableData.length - 1" + type="success" + size="small" + @click="handleMoveDown(scope)" + >涓嬬Щ</el-button + > --> + </div> + </template> + </el-table-column> </el-table> + <div class="lander-pagination-block"> + <el-pagination + style="width: 100%" + v-model:current-page="currentPage" + :page-size="pageSize" + :size="size" + :background="background" + layout="total, prev, pager, next" + :total="tableTotal" + @current-change="handleCurrentChange" + /> + </div> </div> - <div class="lander-pagination-block"> - <el-pagination - v-model:current-page="currentPage" - :page-size="pageSize" - :size="size" - :background="background" - layout="total, prev, pager, next" - :total="100" - @current-change="handleCurrentChange" - /> - </div> + <!-- 棰勮 --> + <previewModule ref="previewModelRef"></previewModule> + <el-dialog v-model="dialogFormVisible" title="鏂板缓妯″瀷"> + <el-form :rules="rules" :model="form" ref="formRef"> + <el-form-item + prop="ModelName" + label="妯″瀷鍚嶇О" + :label-width="formLabelWidth" + > + <el-input v-model="form.ModelName" autocomplete="off" /> + </el-form-item> + <el-form-item label="鍏抽敭鏁版嵁閲�" :label-width="formLabelWidth"> + <el-input v-model="form.JointData" autocomplete="off" /> + </el-form-item> + <el-form-item label="鏄惁鍙豢鐪�" :label-width="formLabelWidth"> + <el-switch + v-model="form.IsSimulation" + class="ml-2" + style="--el-switch-on-color: #13ce66" + /> + </el-form-item> + <el-form-item label="妯″瀷鏂囦欢" :label-width="formLabelWidth"> + <el-upload + :before-upload="beforeUpload" + :limit="1" + v-if="!form.ModelFile" + > + <template #trigger> + <el-button type="primary">涓婁紶妯″瀷</el-button> + </template> + </el-upload> + <div v-else>{{ form.ModelFile.name }}</div> + </el-form-item> + + <el-form-item label="澶囨敞" :label-width="formLabelWidth"> + <el-input + v-model="form.ModelRemarks" + :rows="2" + type="textarea" + placeholder="璇疯緭鍏�..." + /> + </el-form-item> + </el-form> + <template #footer> + <span class="dialog-footer"> + <el-button @click="dialogFormVisible = false">鍙栨秷</el-button> + <el-button type="primary" @click="SubmitEvent(formRef)"> + 纭畾 + </el-button> + </span> + </template> + </el-dialog> </div> </template> <script setup lang="ts"> -import { ref } from "vue"; +import { inject, onMounted, reactive, ref, watch } from "vue"; import { Plus } from "@element-plus/icons-vue"; -import type { ComponentSize, TableInstance } from "element-plus"; - +import { curStoreInfo } from "@/store/index"; +import SparkMD5 from "spark-md5"; +import previewModule from "@/components/previewModelDialog.vue"; +import { + ComponentSize, + ElMessage, + FormInstance, + TableInstance, +} from "element-plus"; +import { updateLocale } from "moment"; +const MG: any = inject("MG"); +const toolClass: any = inject("toolClass"); // 鎼滅储 const input4 = ref(""); - +const formRef = ref<FormInstance>(); // 琛ㄦ牸 const multipleTableRef = ref<TableInstance>(); const multipleSelection = ref<any[]>([]); - +const dialogTableVisible = ref(false); +const dialogFormVisible = ref(false); +const formLabelWidth = "140px"; +const typeInfo = ref(); // 鍒嗛〉 -const currentPage = ref(4); +const currentPage = ref(1); const pageSize = ref(20); const size = ref<ComponentSize>("default"); const background = ref(true); +const isLoading = ref(false); +const tableData = ref([]); +const file = ref(null); +const md5 = ref(""); +const previewUrl = ref( + "./static/modelView/index.html?md5=62d4eadc420b7403fce2be993baa095d&name=椋炶妫�&domain=https://www.jlstp.cn&target=iframe" +); +const form = reactive({ + ModelName: "", + JointData: "", + IsSimulation: false, + ModelRemarks: "", + ModelFile: null, +}); -const tableData = [ - { - id: 1, - date: "2016-05-03", - name: "Tom", - address: "No. 189, Grove St, Los Angeles", - }, - { - id: 2, - date: "2016-05-02", - name: "Tom", - address: "No. 189, Grove St, Los Angeles", - }, - { - id: 3, - date: "2016-05-04", - name: "Tom", - address: "No. 189, Grove St, Los Angeles", - }, - { - id: 4, - date: "2016-05-01", - name: "Tom", - address: "No. 189, Grove St, Los Angeles", - }, - { - id: 5, - date: "2016-05-08", - name: "Tom", - address: "No. 189, Grove St, Los Angeles", - }, - { - id: 6, - date: "2016-05-06", - name: "Tom", - address: "No. 189, Grove St, Los Angeles", - }, - { - id: 7, - date: "2016-05-07", - name: "Tom", - address: "No. 189, Grove St, Los Angeles", - }, -]; +const progress = ref(0); +const seleStore = curStoreInfo(); +//鍒嗛〉鏁版嵁閲� +const tableTotal = ref(0); +//褰撳墠缂栬緫琛� +const currentRow = ref(); +watch( + () => seleStore.channelInfo, // 鐩戝惉 reactive 瀵硅薄锛堥粯璁ゆ繁搴︾洃鍚級 + (newVal) => { + if (newVal) { + console.log(newVal, "newVal"); + console.log(seleStore.storeInfo, "seleStore"); + getTableData(); + } + } +); + +const beforeUpload = (file) => { + file.value = file; + md5.value = ""; + progress.value = 0; + + if (file.value) { + const md5 = calculateMD5(file.value); + console.log(md5, "md5md5md5md5.value"); + } + console.log(file.value, "file.value"); + console.log(md5.value, "md5.value"); + return false; +}; + +// 璁$畻MD5 +const calculateMD5 = (file) => { + const chunkSize = 1 * 1024 * 1024; // 2MB鍒嗗潡 + const chunks = Math.ceil(file.size / chunkSize); + const spark = new SparkMD5.ArrayBuffer(); + const fileReader = new FileReader(); + + let currentChunk = 0; + + fileReader.onload = (e) => { + spark.append(e.target.result); + currentChunk++; + progress.value = Math.min(100, Math.floor((currentChunk / chunks) * 100)); + + if (currentChunk < chunks) { + loadNextChunk(); + } else { + md5.value = spark.end(); + console.log(md5.value, "md5.value"); + console.log(file, "file.value"); + + if (md5.value) { + initFile(md5.value, file); + } + progress.value = 100; + } + }; + + fileReader.onerror = () => { + console.error("鏂囦欢璇诲彇閿欒"); + }; + + const loadNextChunk = () => { + const start = currentChunk * chunkSize; + const end = Math.min(start + chunkSize, file.size); + fileReader.readAsArrayBuffer(file.slice(start, end)); + }; + loadNextChunk(); +}; + +const initFile = (md5, file) => { + form.ModelFile = { + name: file.name, + md5: md5, + }; + MG.dps5 + .postFileUploadGetFileInfo({ + md5: md5, + }) + .then((res) => { + console.log(res, "res"); + if (res && !res.id) { + const body = { + name: file.name, + md5: md5, + fileName: file.value.name, + extension: file.name.split(".").pop(), + fileType: "model", + metaData: "", + type: "model", + icon: "", + size: file.size, + accessType: "Private", // Public and Private + }; + + MG.dps5.postFileUploadInitFile(body).then((initRes) => { + console.log(initRes, "initRes"); + const params = { + Md5: md5, + IsLastOne: true, + Offset: 0, + file, + }; + + MG.dps5.postFileUploadUpload(params).then((uploadRes) => { + console.log(uploadRes, "uploadRes"); + }); + }); + } + }); +}; +// 鎼滅储 +const handleSearch = () => { + console.log(input4.value, "input4"); +}; +// 缂栬緫鎿嶄綔 +const handleEdit = (row) => { + console.log(row, "row"); + dialogFormVisible.value = true; + currentRow.value = row; + form.ModelName = row.ModelName; + form.JointData = row.JointData; + form.IsSimulation = row.IsSimulation == "1" ? true : false; + form.ModelRemarks = row.ModelRemarks; +}; +//鍒犻櫎鎿嶄綔 +const handleDelete = async (row) => { + const body = { + accessModule: "", + accessPath: seleStore.channelInfo.data.idPath, + accessStoreId: seleStore.storeInfo.storeId, + accessRepositoryId: seleStore.storeInfo.repositoryId, + accessItemId: seleStore.channelInfo.data.id, + parentId: seleStore.storeInfo.repositoryData.recycleChannel.id, + parentAccessRequest: { + accessModule: "", + accessPath: seleStore.storeInfo.repositoryData.recycleChannel.id + "", + accessStoreId: seleStore.storeInfo.repositoryData.storeId, + accessRepositoryId: seleStore.storeInfo.repositoryData.id, + accessItemId: seleStore.storeInfo.repositoryData.recycleChannel.id, + }, + itemIds: [row.id], + }; + const res = await MG.dps5.DelCmsItemByList(body); + ElMessage({ + message: "鍒犻櫎鎴愬姛", + type: "success", + }); + getTableData(); +}; +//棰勮鎿嶄綔 +const previewModelRef = ref<any>(); +const showModelData = ref<any>(null); +const handlePreview = (row: any) => { + let md5: any = null; + try { + const fileData = row.fieldList.find((item: any) => item.FileList.length); + md5 = fileData.FileList[0].File.Md5; + } catch (error) {} + previewModelRef.value.handleDialogVisible(true, { + name: row.name, + md5, + }); +}; +//涓婄Щ鎿嶄綔 +const handleMoveUp = (row) => {}; +//涓嬬Щ鎿嶄綔 +const handleMoveDown = (row) => { + console.log(row, "row"); + console.log(tableData.value, "tableData"); +}; + +const getTableData = async () => { + isLoading.value = true; + const fields = { + ModelName: [], + ModelFile: [], + JointData: [], + IsSimulation: [], + ModelRemarks: [], + ChildrenCount: [], + }; + let searchFields = {}; + if (input4.value != "") { + searchFields = { + "ModelName*": [input4.value], + }; + } + const body = { + path: seleStore.channelInfo.data.idPath, + type: "\\", + storeId: seleStore.storeInfo.storeId, + repositoryId: seleStore.storeInfo.repositoryId, + paging: { + Start: (currentPage.value - 1) * pageSize.value, + Size: pageSize.value, + }, + linkTypes: [], + fields: { ...fields, ...searchFields }, + filters: { + "SysType=": ["CmsItem"], + }, + }; + const queryTableData = await toolClass.getCmsItem(body); + tableData.value = queryTableData.datas; + tableTotal.value = queryTableData.total; + isLoading.value = false; +}; + +//鏍¢獙瑙勫垯 +const rules = reactive({ + ModelName: [{ required: true, message: "璇疯緭鍏ュ悕绉�", trigger: "blur" }], +}); +onMounted(() => { + getType(); +}); +//鑾峰彇绫诲瀷 +const getType = async () => { + const type = await MG.dps5.GetTypeByRefCode({ + refCodes: ["ModelRemarks"], + }); + const typeData = toolClass.handleTypeList(type); + typeInfo.value = typeData[0]; +}; + +const SubmitEvent = async (formEl: FormInstance | undefined) => { + if (!formEl) return; + await formEl.validate(async (valid, fields) => { + if (valid) { + if (currentRow.value) { + console.log(form, "fields"); + console.log(currentRow.value, "currentRow"); + const keys = Object.keys(form); + const editObj = { + add: [], + update: [], + delete: [], + }; + for (const key of keys) { + const typeField = typeInfo.value.typeLinkList[0].children.find( + (item: any) => item.typeField.refCode === key + ); + + if ( + form[key] && + currentRow.value[key] && + form[key] != currentRow.value[key] + ) { + const updateObj = { + baseType: typeField.typeField.baseType, + order: typeField.order, + itemDataId: currentRow.value.datas[key].Id, + data: form[key], + link: {}, + linkFiles: [], + }; + editObj.update.push(updateObj); + } else if (form[key] == "" && currentRow.value[key] != "") { + const curField = currentRow.value.datas[key].Id; + editObj.delete.push(curField); + } else if (!currentRow.value[key] && form[key] != "") { + const fieldObj = { + baseType: typeField.typeField.baseType, + order: typeField.order, + link: {}, + linkFiles: [], + addLinkItems: [], + typeFieldId: typeField.typeField.id, + refCode: typeField.typeField.refCode, + sequenceNum: typeField.cfg.uuid, + }; + switch (key) { + case "ModelName": + fieldObj["strValue"] = form[key]; + break; + case "JointData": + fieldObj["strValue"] = form[key]; + break; + case "IsSimulation": + fieldObj["intValue"] = form[key] ? 1 : 0; + break; + case "ModelRemarks": + fieldObj["textValue"] = form[key]; + break; + case "ModelFile": + fieldObj["linkFiles"].push(form[key].md5); + break; + } + editObj.add.push(fieldObj); + } + } + console.log(editObj, "editObj"); + + const params = { + updateList: [ + { + accessModule: "", + accessPath: seleStore.channelInfo.data.idPath, + accessStoreId: seleStore.storeInfo.storeId, + accessRepositoryId: seleStore.storeInfo.repositoryId, + accessItemId: seleStore.channelInfo.data.id, + sysType: "CmsItem", + linkType: "Link", + // name: form.ModelName, + delCmsItemDataRequest: editObj.delete.length + ? { cmsItemDataIds: editObj.delete } + : null, + addCmsItemDataListRequest: editObj.add.length + ? { dataRequests: editObj.add } + : null, + updateCmsItemDataListRequest: { + cmsItemId: currentRow.value.id, + dataRequests: editObj.update, + }, + }, + ], + }; + const res = await MG.dps5.UpdateCmsItem(params); + dialogFormVisible.value = false; + ElMessage({ + message: "缂栬緫鎴愬姛", + type: "success", + }); + getTableData(); + } else { + const keys = Object.keys(form); + const fieldList = []; + for (const key of keys) { + const typeField = typeInfo.value.typeLinkList[0].children.find( + (item: any) => item.typeField.refCode === key + ); + + const fieldObj = { + baseType: typeField.typeField.baseType, + order: typeField.order, + link: {}, + linkFiles: [], + addLinkItems: [], + typeFieldId: typeField.typeField.id, + refCode: typeField.typeField.refCode, + sequenceNum: typeField.cfg.uuid, + }; + switch (key) { + case "ModelName": + fieldObj["strValue"] = form[key]; + break; + case "JointData": + fieldObj["strValue"] = form[key]; + break; + case "IsSimulation": + fieldObj["intValue"] = form[key] ? 1 : 0; + break; + case "ModelRemarks": + fieldObj["textValue"] = form[key]; + break; + case "ModelFile": + fieldObj["linkFiles"].push(form[key].md5); + break; + } + fieldList.push(fieldObj); + } + + console.log(fieldList, "fieldList"); + + debugger; + const params = { + accessModule: "", + accessPath: seleStore.channelInfo.data.idPath, + accessStoreId: seleStore.storeInfo.storeId, + accessRepositoryId: seleStore.storeInfo.repositoryId, + accessItemId: seleStore.channelInfo.data.id, + sysType: "CmsItem", + linkType: "Link", + cmsItemRequest: { + name: form.ModelName, + description: form.ModelRemarks, + type: "Normal", + state: "Normal", + accessType: "Private", + cmsTypeId: typeInfo.value.id, + cmsItemDataList: fieldList, + linkCmsItemDataIds: [], + linkOrgIds: [1], + linkDepartmentIds: [1], + }, + newProcessInstanceCmsItemRightsPointRequests: [], + }; + console.log(seleStore.channelInfo, "seleStore.channelInfo"); + const res = await MG.dps5.NewCmsItem(params); + dialogFormVisible.value = false; + ElMessage({ + message: "鏂板缓鎴愬姛", + type: "success", + }); + getTableData(); + } + } + }); +}; const handleCurrentChange = (val: number) => { - console.log(`current page: ${val}`); + currentPage.value = val; + getTableData(); }; const handleSelectionChange = (val: []) => { -- Gitblit v1.9.1