fix: 样式调整及接口联调

src/common/api/production/assistantManage.js

+// api/erpProductionAssistantManage/uploadToLocal
+import axios from '../axios'
+
+export function erpProductionAssistantManage(data) {
+  return axios.post('/erpProductionAssistantManage/uploadToLocal', data)
+}
\ No newline at end of file

src/views/production/AssistantManage.vue

@@ -44,37 +44,38 @@
         ref='editForm'
         :model='editForm'
       >
-        <el-form-item prop="title" label="菜单名称">
-          <el-input class="item_width" v-model="editForm.title" placeholder="请输入更新标题"></el-input>
+        <el-form-item class="title_width" prop="title" label="更新标题">
+          <el-input type="textarea" v-model="editForm.title" placeholder="请输入更新标题"></el-input>
+        </el-form-item>
+        <el-form-item  class="title_width" prop="content" label="更新内容">
+          <el-input type="textarea" rows="10" v-model="editForm.content" placeholder="请输入更新内容"></el-input>
         </el-form-item>
         <el-form-item prop="version" label="版本号">
           <el-input class="item_width" v-model="editForm.version" placeholder="请输入版本号"></el-input>
         </el-form-item>
-        <el-form-item prop="content" label="更新内容">
-          <el-input class="item_width" v-model="editForm.content" placeholder="请输入更新内容"></el-input>
-        </el-form-item>
         <el-form-item prop="forcedUpdate" label="是否强制更新">
           <el-radio-group class="item_width" v-model="editForm.forcedUpdate">
             <el-radio :label="0">否</el-radio>
             <el-radio :label="1">是</el-radio>
           </el-radio-group>
         </el-form-item>
-        <el-form-item prop="businessType" label="应用软件名称">
-          <el-input class="item_width" v-model="editForm.businessType" disabled></el-input>
-        </el-form-item>
         <!-- 上传多个app文件 -->
-        <el-form-item label="上传文件">
+        <el-form-item class="title_width" label="上传文件">
+            <!-- accept=".apk,.ipa" -->
           <el-upload
-            class="upload-file"
-            action="/"
-            :on-success="handleSuccess"
+            action
+            :http-request="handleCustom"
+            :on-change="handleChange"
             :on-remove="handleRemove"
-            :file-list="fileList"
             :auto-upload="false"
+            :file-list="fileList"
             list-type="text"
-            accept=".apk,.ipa"
           >
-            <i class="el-icon-plus"></i>
+          <div class="upload-file">
+            <el-button class="el-upload">
+                <i class="el-icon-plus"></i>
+            </el-button>
+          </div>
           </el-upload>
         </el-form-item>
       </el-form>
@@ -96,6 +97,7 @@
 </template>
 <script>
 import tableView from '@/common/components/base/tableView.vue'
+import { erpProductionAssistantManage } from '../../common/api/production/assistantManage'
 
 export default {
   name: 'saasMenu',
@@ -115,7 +117,7 @@ export default {
         title: '',
         content: '',
         forcedUpdate: 0,
-        businessType: 'production_assistant'
+        // businessType: 'production_assistant'
       },
       fileList: [],
       rules: {
@@ -153,7 +155,7 @@ export default {
         {
           label: '版本号',
           key: 'version',
-          width: ''
+          width: '80'
         },
         {
           label: '更新内容',
@@ -163,7 +165,7 @@ export default {
         {
           label: ' 是否强制更新',
           key: 'forcedUpdate',
-          width: '',
+          width: '100',
           render: item => {
             return item.forcedUpdate === 1 ? '是' : '否'
           }
@@ -171,7 +173,7 @@ export default {
         {
           label: '应用软件名称',
           key: 'businessType',
-          width: '',
+          width: '100',
           render: item => {
             return item ? '生产助手' : ''
           }
@@ -179,13 +181,14 @@ export default {
         {
           label: '操作',
           key: '',
-          width: '',
-          align: 'left',
+          width: '80',
+          // align: 'left',
           render: item => (
             <div>
               <el-button
                 size='mini'
                 type='text'
+                class="edit"
                 onClick={() => this.remove(item)}
               >
                 删除
@@ -220,7 +223,7 @@ export default {
       this.resetForm()
       this.dialogVisible = false
     },
-    submit() {
+    async submit() {
       // 验证表单
       this.$refs.editForm.validate(valid => {
         if (valid) {
@@ -232,12 +235,18 @@ export default {
               message: '请上传文件!',
             })
           }
+          const productionAssistantParams = {
+            ...this.editForm,
+            fileList: this.fileList
+          }
+          const res = erpProductionAssistantManage(productionAssistantParams)
+          console.log('提交表单:>>> ', res)
           this.$message({
             type: 'success',
             message: '保存成功!',
           })
-          this.resetForm()
-          this.dialogVisible = false
+          // this.resetForm()
+          // this.dialogVisible = false
         }
       })
     },
@@ -259,18 +268,17 @@ export default {
             })
         })
     },
-    handleSuccess() {
-      console.log('上传成功')
+    handleCustom(file) {
       this.$message({
         type: 'success',
         message: '上传成功!',
       })
     },
-    handleRemove() {
-      this.$message({
-        type: 'success',
-        message: '删除成功!',
-      })
+    handleChange(file, fileList) {
+      this.fileList = fileList
+    },
+    handleRemove(file, fileList) {
+      this.fileList = fileList
     },
   },
 }
@@ -283,35 +291,47 @@ export default {
   padding: 10px 20px 0;
   overflow: hidden;
   .item_width {
-    width: 180px;
+    width: 220px;
   }
-  .upload-file .el-upload {
-    border: 1px dashed #d9d9d9;
-    border-radius: 6px;
-    cursor: pointer;
-    position: relative;
-    overflow: hidden;
-  }
-  .upload-file .el-upload:hover {
-    border-color: #409EFF;
-  }
-  .upload-file-icon {
-    font-size: 28px;
-    color: #8c939d;
-    width: 178px;
-    height: 178px;
-    line-height: 178px;
-    text-align: center;
+  .title_width {
+    display: flex;
   }
 }
 .table-wrap {
   flex: 1;
 }
 
+.system-menu:deep() .el-form-item__content {
+  flex: 1;
+}
 .radioGroup {
   .el-radio {
     margin-right: 15px !important;
   }
 }
+.edit {
+  color: #fff; /* 字体颜色 */
+  background-color: #409EFF; /* 背景颜色 */
+  border-radius: 4px; /* 圆角 */
+  cursor: pointer; /* 鼠标悬停时显示手型 */
+  transition: background-color 0.3s; /* 背景颜色过渡效果 */
+}
+
+.edit:hover {
+  background-color: #66b1ff; /* 鼠标悬停时的背景颜色 */
+}
 
+.upload-file {
+  .el-upload {
+    padding: 70px;
+    border-radius: 6px;
+    background-color: #fff;
+    border: 1px dashed #d9d9d9;
+  }
+  :deep() .el-button {
+    font-size: 28px;
+    color: #8c939d;
+    text-align: center;
+  }
+}
 </style>