712分析工况

package-lock.json

@@ -29,20 +29,17 @@
         "js-cookie": "2.2.0",
         "mitt": "^3.0.1",
         "moment": "^2.30.1",
-        "monaco-editor": "^0.52.2",
         "normalize.css": "^8.0.1",
         "pinia": "^2.1.6",
         "pinia-plugin-persistedstate": "^3.2.0",
         "sass": "^1.71.1",
         "sass-loader": "^13.3.3",
-        "splitpanes": "^4.0.4",
+        "spark-md5": "^3.0.2",
         "three": "^0.174.0",
         "v-scale-screen": "^2.2.0",
-        "vite-plugin-monaco-editor": "^1.1.0",
         "vite-plugin-remove-console": "^2.2.0",
         "vue": "^3.3.4",
         "vue-i18n": "^9.14.4",
-        "vue-monaco-editor": "^0.0.19",
         "vue-pdf-embed": "^2.1.2",
         "vue-router": "4.0",
         "webuploader": "^0.1.8"
@@ -6758,7 +6755,8 @@
     "node_modules/lodash.debounce": {
       "version": "4.0.8",
       "resolved": "https://registry.npmmirror.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
-      "integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow=="
+      "integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==",
+      "peer": true
     },
     "node_modules/lodash.merge": {
       "version": "4.6.2",
@@ -6891,11 +6889,6 @@
         "node": "*"
       }
     },
-    "node_modules/monaco-editor": {
-      "version": "0.52.2",
-      "resolved": "https://registry.npmmirror.com/monaco-editor/-/monaco-editor-0.52.2.tgz",
-      "integrity": "sha512-GEQWEZmfkOGLdd3XK8ryrfWz3AIP8YymVXiPHEdewrUq7mh0qrKrfHLNCXcbB6sTnMLnOZ3ztSiKcciFUkIJwQ=="
-    },
     "node_modules/ms": {
       "version": "2.1.3",
       "resolved": "https://registry.npmmirror.com/ms/-/ms-2.1.3.tgz",
@@ -8102,6 +8095,7 @@
       "version": "0.6.1",
       "resolved": "https://registry.npmmirror.com/source-map/-/source-map-0.6.1.tgz",
       "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -8136,17 +8130,6 @@
       "resolved": "https://registry.npmmirror.com/spark-md5/-/spark-md5-3.0.2.tgz",
       "integrity": "sha512-wcFzz9cDfbuqe0FZzfi2or1sgyIrsDwmPwfZC4hiNidPdPINjeUwNfv5kldczoEAcjl9Y1L3SM7Uz2PUEQzxQw=="
     },
-    "node_modules/splitpanes": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmmirror.com/splitpanes/-/splitpanes-4.0.4.tgz",
-      "integrity": "sha512-RbysugZhjbCw5fgplvk3hOXr41stahQDtZhHVkhnnJI6H4wlGDhM2kIpbehy7v92duy9GnMa8zIhHigIV1TWtg==",
-      "funding": {
-        "url": "https://github.com/sponsors/antoniandre"
-      },
-      "peerDependencies": {
-        "vue": "^3.2.0"
-      }
-    },
     "node_modules/sprintf-js": {
       "version": "1.0.3",
       "resolved": "https://registry.npmmirror.com/sprintf-js/-/sprintf-js-1.0.3.tgz",
@@ -9025,14 +9008,6 @@
         "vite": ">=2.0.0"
       }
     },
-    "node_modules/vite-plugin-monaco-editor": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmmirror.com/vite-plugin-monaco-editor/-/vite-plugin-monaco-editor-1.1.0.tgz",
-      "integrity": "sha512-IvtUqZotrRoVqwT0PBBDIZPNraya3BxN/bfcNfnxZ5rkJiGcNtO5eAOWWSgT7zullIAEqQwxMU83yL9J5k7gww==",
-      "peerDependencies": {
-        "monaco-editor": ">=0.33.0"
-      }
-    },
     "node_modules/vite-plugin-remove-console": {
       "version": "2.2.0",
       "resolved": "https://registry.npmmirror.com/vite-plugin-remove-console/-/vite-plugin-remove-console-2.2.0.tgz",
@@ -9160,53 +9135,6 @@
         "vue": "^3.0.0"
       }
     },
-    "node_modules/vue-monaco-editor": {
-      "version": "0.0.19",
-      "resolved": "https://registry.npmmirror.com/vue-monaco-editor/-/vue-monaco-editor-0.0.19.tgz",
-      "integrity": "sha512-6tgCWkC1WDPp8K1xgZ9Fp7U4ww0DIQPZC/x9Ih8hEuKPfpekzcHo2r9DaWa1lvzFMeJPv5e4mFCYhmR9+SAl8A==",
-      "dependencies": {
-        "lodash.debounce": "^4.0.8",
-        "vue": "^2.1.0"
-      }
-    },
-    "node_modules/vue-monaco-editor/node_modules/@vue/compiler-sfc": {
-      "version": "2.7.16",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-2.7.16.tgz",
-      "integrity": "sha512-KWhJ9k5nXuNtygPU7+t1rX6baZeqOYLEforUPjgNDBnLicfHCoi48H87Q8XyLZOrNNsmhuwKqtpDQWjEFe6Ekg==",
-      "dependencies": {
-        "@babel/parser": "^7.23.5",
-        "postcss": "^8.4.14",
-        "source-map": "^0.6.1"
-      },
-      "optionalDependencies": {
-        "prettier": "^1.18.2 || ^2.0.0"
-      }
-    },
-    "node_modules/vue-monaco-editor/node_modules/prettier": {
-      "version": "2.8.8",
-      "resolved": "https://registry.npmmirror.com/prettier/-/prettier-2.8.8.tgz",
-      "integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
-      "optional": true,
-      "bin": {
-        "prettier": "bin-prettier.js"
-      },
-      "engines": {
-        "node": ">=10.13.0"
-      },
-      "funding": {
-        "url": "https://github.com/prettier/prettier?sponsor=1"
-      }
-    },
-    "node_modules/vue-monaco-editor/node_modules/vue": {
-      "version": "2.7.16",
-      "resolved": "https://registry.npmmirror.com/vue/-/vue-2.7.16.tgz",
-      "integrity": "sha512-4gCtFXaAA3zYZdTp5s4Hl2sozuySsgz4jy1EnpBHNfpMa9dK1ZCG7viqBPCwXtmgc8nHqUsAu3G4gtmXkkY3Sw==",
-      "deprecated": "Vue 2 has reached EOL and is no longer actively maintained. See https://v2.vuejs.org/eol/ for more details.",
-      "dependencies": {
-        "@vue/compiler-sfc": "2.7.16",
-        "csstype": "^3.1.0"
-      }
-    },
     "node_modules/vue-pdf-embed": {
       "version": "2.1.2",
       "resolved": "https://registry.npmmirror.com/vue-pdf-embed/-/vue-pdf-embed-2.1.2.tgz",

package.json

@@ -31,20 +31,17 @@
     "js-cookie": "2.2.0",
     "mitt": "^3.0.1",
     "moment": "^2.30.1",
-    "monaco-editor": "^0.52.2",
     "normalize.css": "^8.0.1",
     "pinia": "^2.1.6",
     "pinia-plugin-persistedstate": "^3.2.0",
     "sass": "^1.71.1",
     "sass-loader": "^13.3.3",
-    "splitpanes": "^4.0.4",
+    "spark-md5": "^3.0.2",
     "three": "^0.174.0",
     "v-scale-screen": "^2.2.0",
-    "vite-plugin-monaco-editor": "^1.1.0",
     "vite-plugin-remove-console": "^2.2.0",
     "vue": "^3.3.4",
     "vue-i18n": "^9.14.4",
-    "vue-monaco-editor": "^0.0.19",
     "vue-pdf-embed": "^2.1.2",
     "vue-router": "4.0",
     "webuploader": "^0.1.8"

src/views/components/fileuploads.vue

@@ -0,0 +1,165 @@
+<template>
+  <div class="webuploader-container">
+    <el-upload
+      :action="uploadUrl"
+      :before-upload="handleBeforeUpload"
+      :on-success="handleSuccess"
+      :on-error="handleError"
+      :on-progress="handleProgress"
+      :show-file-list="false"
+      :headers="uploadHeaders"
+      :data="uploadData"
+      :accept="props.accept"
+      :auto-upload="true"
+      class="upload-box"
+    >
+      <!-- 自定义上传按钮 -->
+      <div class="btntext upname" style="width: 28px; height: 24px">
+        <img :src="props.imgSrc" alt="upload icon" class="custom-icon" />
+      </div>
+    </el-upload>
+  </div>
+</template>
+
+<script setup>
+import { ElMessage } from 'element-plus'
+import SparkMD5 from 'spark-md5'
+import { request } from '@/utils/request'
+
+const props = defineProps({
+  projectId: Number,
+  solverType: String,
+  accept: String,
+  upId: String,
+  name: String,
+  namelist: Array,
+  gfname: String,
+  imgSrc: String,
+})
+const emit = defineEmits([
+  'upload-success',
+  'update-fileName',
+  'update-percentage',
+  'upload-status',
+])
+
+let fileMd5 = ref('')
+let fileName = ref('')
+let uuid = ref(generateUUID())
+
+const uploadUrl = import.meta.env.VITE_BASE_URL + '/TransServlet'
+
+const uploadHeaders = {
+  Content: 'multipart',
+  Type: 'form-data',
+}
+
+const uploadData = computed(() => ({
+  transCode: 'B00028',
+  channelNo: 'service',
+  clientToken: 'e47b87eec69545559d1e81e56626da68',
+  userId: '5f06c8bc77234f969d13e160b54c27e3',
+  fileName: fileName.value,
+  bfid: uuid.value,
+}))
+
+function generateUUID() {
+  return 'xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+    const r = (Math.random() * 16) | 0
+    const v = c === 'x' ? r : (r & 0x3) | 0x8
+    return v.toString(16)
+  })
+}
+
+async function handleBeforeUpload(rawFile) {
+  fileName.value = rawFile.name
+  emit('update-fileName', fileName.value)
+
+  const ext = fileName.value.split('.').pop().toLowerCase()
+  const acceptList = props.accept
+    .split(',')
+    .map((e) => e.trim().replace(/^\./, '').toLowerCase())
+  if (!acceptList.includes(ext)) {
+    ElMessage.error(`只支持 ${props.accept} 格式文件!`)
+    return false
+  }
+
+  fileMd5.value = await calculateMD5(rawFile)
+  uuid.value = generateUUID()
+  emit('upload-status', '上传中')
+  return true
+}
+
+function handleSuccess(response, file) {
+  if (response.returnCode !== '000000000') {
+    ElMessage.error(response.returnMsg || '上传失败')
+    emit('upload-status', '上传失败')
+    return
+  }
+
+  emit('upload-success', {
+    bfid: response.bfid,
+    fname: file.name,
+  })
+  emit('upload-status', '上传成功')
+
+  uuid.value = generateUUID()
+}
+
+function handleError() {
+  emit('upload-status', '上传失败')
+  uuid.value = generateUUID()
+}
+
+function handleProgress(event, file, fileList) {
+  const percentage = Math.floor(event.percent)
+  emit('update-percentage', percentage)
+}
+
+function calculateMD5(file) {
+  return new Promise((resolve, reject) => {
+    const chunkSize = 2097152 // 2MB
+    const chunks = Math.ceil(file.size / chunkSize)
+    let currentChunk = 0
+    const spark = new SparkMD5.ArrayBuffer()
+    const fileReader = new FileReader()
+
+    fileReader.onload = function (e) {
+      spark.append(e.target.result)
+      currentChunk++
+      if (currentChunk < chunks) {
+        loadNext()
+      } else {
+        resolve(spark.end())
+      }
+    }
+
+    fileReader.onerror = function () {
+      reject(new Error('文件读取失败'))
+    }
+
+    function loadNext() {
+      const start = currentChunk * chunkSize
+      const end = Math.min(start + chunkSize, file.size)
+      fileReader.readAsArrayBuffer(file.slice(start, end))
+    }
+
+    loadNext()
+  })
+}
+</script>
+
+<style scoped>
+.webuploader-container {
+  position: relative;
+}
+.upload-box {
+  display: inline-block;
+}
+.custom-icon {
+  width: 100%;
+  height: auto;
+  display: block;
+  cursor: pointer;
+}
+</style>

src/views/mainContent/index.vue

@@ -97,12 +97,12 @@ import opProblem from './rightaside/opProblem.vue';
 .rightaside {
   .right-1 {
     width: 100%;
-    height: 60%;
+    height: 70%;
   }
 
   .right-2 {
     width: 100%;
-    height: 40%;
+    height: 30%;
   }
 }
 

src/views/mainContent/rightaside/analyzeWork.vue

@@ -5,11 +5,64 @@
       <template #header>
         <span>分析工况</span>
       </template>
-
+      <el-space style="height: 100%;">
+        <div v-for="item in btninfo">
+          <el-button
+            :key="item.name"
+            class="work-btn"
+            @click="handleWorkClick(item.name)"
+          >
+            <img
+              :src="selectedWork === item.name ? item.highlightImg : item.img"
+              alt="work icon"
+            />
+            <!-- {{ item.name }} -->
+          </el-button>
+        </div>
+      </el-space>
     </el-card>
   </div>
 </template>
 
 <script setup>
 
-</script>
+
+import qidong from '@/assets/img/qidong.png'
+import jiegou from '@/assets/img/jiegou.png'
+import qitan from '@/assets/img/qitan.png'
+import qidong1 from '@/assets/img/qidong1.png'
+import jiegou1 from '@/assets/img/jiegou1.png'
+import qitan1 from '@/assets/img/qitan1.png'
+
+const selectedWork = ref('气动')
+
+const btninfo = ref([
+  { name: '气动', img: qidong, highlightImg: qidong1 },
+  { name: '结构', img: jiegou, highlightImg: jiegou1 },
+  { name: '气弹', img: qitan, highlightImg: qitan1 },
+])
+
+const handleWorkClick = (name) => {
+  selectedWork.value = name
+}
+
+</script>
+
+<style scoped>
+.custom-card {
+  width: 100%;
+  height: 100%;
+}
+.work-btn {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+
+  background-color: transparent;
+  border: none;
+}
+
+</style>

vite.config.ts

@@ -1,6 +1,5 @@
 import { defineConfig, loadEnv } from 'vite'
 import vue from '@vitejs/plugin-vue'
-import monacoEditorPlugin from 'vite-plugin-monaco-editor';
 import removeConsole from 'vite-plugin-remove-console';
 import compression from 'vite-plugin-compression';
 
@@ -26,7 +25,6 @@ export default defineConfig(({ mode }) => {
       vue(),
       removeConsole(),
       compression(),
-      monacoEditorPlugin({}),
       AutoImport({
         imports: ['vue', 'vue-router'],
         dts: "src/auto-import.d.ts",