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 | 631 ++++++++++++++++++++++++++++++++++++++++++++++++++------
1 files changed, 559 insertions(+), 72 deletions(-)
diff --git a/src/views/model/children/landerModel.vue b/src/views/model/children/landerModel.vue
index 1ddc270..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,95 +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: []) => {
@@ -121,7 +607,7 @@
.landerBox {
width: 100%;
height: 100%;
-
+
.landerTopBox {
display: flex;
justify-content: space-between;
@@ -131,8 +617,10 @@
box-sizing: border-box;
}
.landerContentBox {
- width: 100%;
max-height: calc(100% - 120px);
+ padding: 0 10px;
+ box-sizing: border-box;
+
.landerTable {
height: 750px;
}
@@ -143,7 +631,6 @@
justify-content: flex-end;
padding: 0 20px;
background-color: #fff;
-
}
}
</style>
--
Gitblit v1.9.1