refactor(订单审核): 重构图片存储申请审核流程

src/views/order/image-store-apply/index.vue

@@ -65,7 +65,7 @@
           v-if="row.auditStatus === 0"
           type="text"
           size="small"
-          @click="handleAudit(row, 1)"
+          @click="handleApprove(row)"
         >
           审核通过
         </el-button>
@@ -73,7 +73,7 @@
           v-if="row.auditStatus === 0"
           type="text"
           size="small"
-          @click="handleAudit(row, 2)"
+          @click="handleReject(row)"
         >
           审核不通过
         </el-button>
@@ -86,6 +86,9 @@
       :visible.sync="detailVisible"
       width="80%"
       :close-on-click-modal="false"
+      :modal="true"
+      :append-to-body="true"
+      :lock-scroll="false"
     >
       <div v-if="detailData" class="detail-container">
         <!-- 基本信息 -->
@@ -259,14 +262,14 @@
         <el-button
           v-if="detailData && detailData.auditStatus === 0"
           type="success"
-          @click="handleAudit(detailData, 1)"
+          @click="handleApprove(detailData)"
         >
           审核通过
         </el-button>
         <el-button
           v-if="detailData && detailData.auditStatus === 0"
           type="danger"
-          @click="handleAudit(detailData, 2)"
+          @click="handleReject(detailData)"
         >
           审核不通过
         </el-button>
@@ -275,58 +278,67 @@
 
     <!-- 审核对话框 -->
     <el-dialog
-      :title="auditForm.auditStatus === 1 ? '审核通过' : '审核不通过'"
+      title="审核"
       :visible.sync="auditVisible"
       width="500px"
       :close-on-click-modal="false"
+      :modal="true"
+      :append-to-body="true"
+      :lock-scroll="false"
+    >
+
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="auditVisible = false">取消</el-button>
+        <el-button
+          type="primary"
+          :loading="auditLoading"
+          @click="submitAudit"
+        >
+          确定
+        </el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 审核不通过备注对话框 -->
+    <el-dialog
+      title="审核不通过"
+      :visible.sync="rejectVisible"
+      width="500px"
+      :close-on-click-modal="false"
+      :modal="true"
+      :append-to-body="true"
+      :lock-scroll="false"
     >
       <el-form
-        :model="auditForm"
-        :rules="auditRules"
-        ref="auditFormRef"
+        :model="rejectForm"
+        :rules="rejectRules"
+        ref="rejectFormRef"
         label-width="100px"
       >
         <el-form-item label="申请编号">
-          <span>{{ auditForm.applyNo }}</span>
+          <span>{{ rejectForm.applyNo }}</span>
         </el-form-item>
         <el-form-item label="客户名称">
-          <span>{{ auditForm.customerName }}</span>
-        </el-form-item>
-        <el-form-item label="申请金额">
-          <span class="amount">¥{{ formatAmount(auditForm.applyAmount) }}</span>
-        </el-form-item>
-        <el-form-item
-          v-if="auditForm.auditStatus === 1"
-          label="审核金额"
-          prop="auditAmount"
-        >
-          <el-input-number
-            v-model="auditForm.auditAmount"
-            :precision="2"
-            :min="0"
-            :max="parseFloat(auditForm.applyAmount)"
-            placeholder="请输入审核金额"
-            style="width: 100%"
-          />
+          <span>{{ rejectForm.customerName }}</span>
         </el-form-item>
-        <el-form-item label="审核备注" prop="auditRemark">
+        <el-form-item label="拒绝原因" prop="auditRemark">
           <el-input
-            v-model="auditForm.auditRemark"
+            v-model="rejectForm.auditRemark"
             type="textarea"
             :rows="4"
-            placeholder="请输入审核备注"
+            placeholder="请输入拒绝原因"
           />
         </el-form-item>
       </el-form>
 
       <div slot="footer" class="dialog-footer">
-        <el-button @click="auditVisible = false">取消</el-button>
+        <el-button @click="rejectVisible = false">取消</el-button>
         <el-button
-          type="primary"
+          type="danger"
           :loading="auditLoading"
-          @click="submitAudit"
+          @click="submitReject"
         >
-          确定
+          确定拒绝
         </el-button>
       </div>
     </el-dialog>
@@ -337,6 +349,9 @@
       :visible.sync="previewVisible"
       width="60%"
       :close-on-click-modal="false"
+      :modal="true"
+      :append-to-body="true"
+      :lock-scroll="false"
     >
       <div class="preview-container">
         <img
@@ -390,28 +405,20 @@ export default {
       attachmentList: [],
       attachmentLoading: false,
 
-      // 审核对话框
-      auditVisible: false,
+      rejectVisible: false,
       auditLoading: false,
       /** @type {Object} */
-      auditForm: {
+      rejectForm: {
         id: '',
         applyNo: '',
         customerName: '',
-        applyAmount: '',
-        auditStatus: 0,
-        auditAmount: 0,
         auditRemark: ''
       },
       /** @type {Object} */
-      auditRules: {
-        auditAmount: [
-          { required: true, message: '请输入审核金额', trigger: 'blur' },
-          { type: 'number', min: 0, message: '审核金额不能小于0', trigger: 'blur' }
-        ],
+      rejectRules: {
         auditRemark: [
-          { required: true, message: '请输入审核备注', trigger: 'blur' },
-          { min: 5, max: 500, message: '审核备注长度在5到500个字符', trigger: 'blur' }
+          { required: true, message: '请输入拒绝原因', trigger: 'blur' },
+          { min: 5, max: 500, message: '拒绝原因长度在5到500个字符', trigger: 'blur' }
         ]
       },
 
@@ -556,6 +563,112 @@ export default {
 
   methods: {
     /**
+     * 处理审核通过操作
+     * @param {ImageStoreApplyRecord} row - 行数据
+     */
+    handleApprove(row) {
+      this.$confirm('确定要审核通过该申请吗？', '确认审核', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'success'
+      }).then(async () => {
+        await this.submitAudit(row, 1, '审核通过')
+      }).catch(() => {
+        // 用户取消操作
+      })
+    },
+
+    /**
+     * 处理审核不通过操作
+     * @param {ImageStoreApplyRecord} row - 行数据
+     */
+    handleReject(row) {
+      this.rejectForm = {
+        id: row.id,
+        applyNo: row.applyNo,
+        customerName: row.customerName,
+        auditRemark: ''
+      }
+
+      // 重置表单验证
+      this.$nextTick(() => {
+        if (this.$refs.rejectFormRef) {
+          this.$refs.rejectFormRef.clearValidate()
+        }
+      })
+
+      this.rejectVisible = true
+    },
+
+    /**
+     * 提交拒绝审核
+     * @returns {Promise<void>}
+     */
+    async submitReject() {
+      try {
+        // 表单验证
+        await this.$refs.rejectFormRef.validate()
+
+        // 找到对应的行数据
+        const row = this.data.find(item => item.id === this.rejectForm.id)
+        if (!row) {
+          this.$message.error('数据不存在')
+          return
+        }
+
+        await this.submitAudit(row, 2, this.rejectForm.auditRemark)
+        this.rejectVisible = false
+      } catch (error) {
+        if (error.message) {
+          // 表单验证错误
+          return
+        }
+        console.error('审核操作失败:', error)
+        this.$message.error('审核操作失败')
+      }
+    },
+
+    /**
+     * 提交审核（通用方法）
+     * @param {ImageStoreApplyRecord} row - 行数据
+     * @param {number} auditStatus - 审核状态 1-通过 2-不通过
+     * @param {string} auditRemark - 审核备注
+     * @returns {Promise<void>}
+     */
+    async submitAudit(row, auditStatus, auditRemark) {
+      try {
+        this.auditLoading = true
+
+        // 构建更新数据
+        const updateData = {
+          ...row,
+          auditStatus: auditStatus,
+          auditAmount: auditStatus === 1 ? parseFloat(row.applyAmount) : 0,
+          auditRemark: auditRemark,
+          auditorId: this.$store.getters.userInfo.user_id,
+          auditorName: this.$store.getters.userInfo.real_name,
+          auditTime: new Date().toISOString().slice(0, 19).replace('T', ' ')
+        }
+
+        await update(updateData)
+
+        this.$message.success(`审核${auditStatus === 1 ? '通过' : '不通过'}操作成功`)
+
+        // 如果是在详情页面，关闭详情对话框
+        if (this.detailVisible) {
+          this.detailVisible = false
+        }
+
+        // 刷新列表
+        await this.onLoad(this.page)
+      } catch (error) {
+        console.error('审核操作失败:', error)
+        this.$message.error('审核操作失败')
+      } finally {
+        this.auditLoading = false
+      }
+    },
+    /**
      * 获取审核状态文本
      * @param {number} status - 审核状态
      * @returns {string} 状态文本
@@ -705,48 +818,6 @@ export default {
     },
 
     /**
-     * 提交审核
-     * @returns {Promise<void>}
-     */
-    async submitAudit() {
-      try {
-        // 表单验证
-        await this.$refs.auditFormRef.validate()
-
-        this.auditLoading = true
-
-        // 构建更新数据
-        const updateData = {
-          ...this.detailData,
-          auditStatus: this.auditForm.auditStatus,
-          auditAmount: this.auditForm.auditAmount,
-          auditRemark: this.auditForm.auditRemark,
-          auditorId: this.$store.getters.userInfo.user_id,
-          auditorName: this.$store.getters.userInfo.real_name,
-          auditTime: new Date().toISOString().slice(0, 19).replace('T', ' ')
-        }
-
-        await update(updateData)
-
-        this.$message.success('审核操作成功')
-        this.auditVisible = false
-        this.detailVisible = false
-
-        // 刷新列表
-        await this.onLoad(this.page)
-      } catch (error) {
-        if (error.message) {
-          // 表单验证错误
-          return
-        }
-        console.error('审核操作失败:', error)
-        this.$message.error('审核操作失败')
-      } finally {
-        this.auditLoading = false
-      }
-    },
-
-    /**
      * 下载附件
      * @param {ApplyAttachmentRecord} row - 附件数据
      */

vue.config.js

@@ -49,8 +49,9 @@ module.exports = {
     proxy: {
       '/api': {
         //本地服务接口地址
-        target: 'http://127.0.0.1:1080',
-        // target: 'http://gubersial-api.cpolar.top',
+        // target: 'http://127.0.0.1:1080',
+        target: 'http://gubersial-api.cpolar.top',
+        // target: 'http://gubersial-ui.cpolar.top',
         // target: 'https://22687sh999.goho.co',
         ws: true,
         pathRewrite: {