【类 型】：factor 订单模块修改

【原  因】：1.弹出框影响视觉，载入页面改为loding动画。2.价格加入 价格格式化 防止浮点显示错误
【过  程】：1获取数据加入loading属性 2.写了一个格式化价格参数 保留小数点后两位
【影  响】：

src/utils/api/table.js

@@ -91,11 +91,6 @@ export async function getOrderList (orderSerch) {
   params.append('search', orderSerch.search)
   // 发送退款请求
   const res = await api.post('getOrderList', params, 'Admin')
-  if (res.data.status === 1) {
-    Message.success('成功获取订单列表')
-  } else {
-    Message.error('获取订单列表失败')
-  }
   return res
 }
 

src/utils/index.js

@@ -142,3 +142,19 @@ export function speakText (text) {
   }
   window.responsiveVoice.speak(text, 'Chinese Female')
 }
+
+/**
+ * 过滤价格数值 超过小数点两位得 保留两位
+ * @param {string} value
+ */
+export function formatPrice (value) {
+  if (isNaN(value)) return '' // 如果不是数字，则返回空字符串
+  // 格式化价格为保留两位小数
+  let formattedPrice = parseFloat(value).toFixed(2)
+  // 如果价格有两位小数以上，则保留两位小数，否则显示整数或者一位小数
+  const decimalCount = (formattedPrice.split('.')[1] || []).length
+  if (decimalCount > 2) {
+    formattedPrice = parseFloat(formattedPrice).toFixed(2)
+  }
+  return formattedPrice
+}

src/views/layout/components/main/order/index.vue

@@ -24,7 +24,7 @@
       </el-col>
     </el-row>
     <!-- 订单列表 -->
-    <el-table class="m-t-20 w-100" ref="myTable" show-summary :summary-method="getSummaries"
+    <el-table v-loading="loading" class="m-t-20 w-100" ref="myTable" show-summary :summary-method="getSummaries"
       :data="orderList.slice((currentPage - 1) * pageSize, currentPage * pageSize)" border tooltip-effect="dark">
       <el-table-column align="center" type="selection" width="70" min-width="40">
       </el-table-column>
@@ -62,7 +62,7 @@
 
 <script>
 
-import { countSelIdArr, parseTime } from '@/utils'
+import { countSelIdArr, parseTime, formatPrice } from '@/utils'
 import { getOrderList } from '@/utils/api/table'
 import SelectionShopId from '@/components/SelectionShopId'
 import SelectionMainStatus from '@/components/SelectionMainStatus'
@@ -79,7 +79,8 @@ export default {
       pageSize: 50, // 每页显示记录条数
       currentPage: 1, // 当前页
       shop_id: this.$store.state.user.shop_id, // 搜索条件 商铺id
-      orderList: []// 订单列表
+      orderList: [], // 订单列表
+      loading: true// 表格加载动画
     }
   },
   components: {
@@ -105,7 +106,12 @@ export default {
      */
     async getOrderList (orderSerch) {
       const res = await getOrderList(orderSerch)
+      if (res.data.status === 1) {
         this.orderList = res.data.orderList
+        this.loading = false
+      } else {
+        this.$message.error('获取订单列表失败')
+      }
     },
     /**
      * @description: 表单提交 加入防抖
@@ -121,15 +127,17 @@ export default {
         return acc + (order.total_price - order.refund_price)
       }, 0)
       const total = this.orderList.length
-      return ['合计', '', '', '', '', `共 ${total}单 ${sum}元`]
+      return ['合计', '', '', '', '', `共 ${total}单 ${formatPrice(sum)}元`]
     }
   },
   watch: {
     shop_id (val) {
+      this.loading = true
       this.$store.commit('app/setOrderSerch', { shop_id: val })
     },
     orderSerch: {
       handler (val) {
+        this.loading = true
         this.debouncedGetOrderList(val)// 表单提交 加入防抖
       },
       deep: true