订单比对加上状态

bms-front/src/views/price/orderBill/index.vue

@@ -83,6 +83,32 @@
           remote-search
         />
       </template>
+      <template #search-orderStatuses="{ model }">
+        <el-select
+          v-model="model.orderStatuses"
+          multiple
+          filterable
+          clearable
+          collapse-tags
+          collapse-tags-tooltip
+          placeholder="请选择"
+          style="width: 100%"
+        >
+          <template #header>
+            <el-checkbox
+              :model-value="isAllSelected(model, 'orderStatuses', orderStatusAllValues)"
+              :indeterminate="isIndeterminate(model, 'orderStatuses', orderStatusAllValues)"
+              @change="(checked) => toggleAllSelected(model, 'orderStatuses', orderStatusAllValues, checked)"
+            >全选</el-checkbox>
+          </template>
+          <el-option
+            v-for="opt in orderStatusOptions"
+            :key="opt.value"
+            :label="opt.label"
+            :value="opt.value"
+          />
+        </el-select>
+      </template>
       <template #search-billingFailStatuses="{ model }">
         <el-select
           v-model="model.billingFailStatuses"
@@ -96,9 +122,9 @@
         >
           <template #header>
             <el-checkbox
-              :model-value="isAllBillingFailSelected(model)"
-              :indeterminate="isBillingFailIndeterminate(model)"
-              @change="(checked) => toggleAllBillingFail(model, checked)"
+              :model-value="isAllSelected(model, 'billingFailStatuses', billingFailAllValues)"
+              :indeterminate="isIndeterminate(model, 'billingFailStatuses', billingFailAllValues)"
+              @change="(checked) => toggleAllSelected(model, 'billingFailStatuses', billingFailAllValues, checked)"
             >全选</el-checkbox>
           </template>
           <el-option
@@ -259,27 +285,37 @@ const billingFailStatusOptions = [
   { label: '未知失败', value: 22 }
 ]
 
+const orderStatusAllValues = computed(() => orderStatusOptions.map(o => o.value))
 const billingFailAllValues = computed(() => billingFailStatusOptions.map(o => o.value))
 
-function selectedBillingFailStatuses(model) {
-  return Array.isArray(model?.billingFailStatuses) ? model.billingFailStatuses : []
+/** 多选下拉「全选」复选框的通用逻辑，订单状态 / 计费状态共用 */
+function selectedValues(model, key) {
+  const value = model?.[key]
+  return Array.isArray(value) ? value : []
 }
 
-function isAllBillingFailSelected(model) {
-  const selected = selectedBillingFailStatuses(model)
-  const all = billingFailAllValues.value
+/** 模板中 computed 会自动解包为数组，script 内直接引用时是 ref，两种形态都兼容 */
+function resolveAllValues(allValues) {
+  if (Array.isArray(allValues)) return allValues
+  const value = allValues?.value
+  return Array.isArray(value) ? value : []
+}
+
+function isAllSelected(model, key, allValues) {
+  const all = resolveAllValues(allValues)
+  const selected = selectedValues(model, key)
   return all.length > 0 && selected.length === all.length
 }
 
-function isBillingFailIndeterminate(model) {
-  const selected = selectedBillingFailStatuses(model)
-  const all = billingFailAllValues.value
+function isIndeterminate(model, key, allValues) {
+  const all = resolveAllValues(allValues)
+  const selected = selectedValues(model, key)
   return selected.length > 0 && selected.length < all.length
 }
 
-function toggleAllBillingFail(model, checked) {
+function toggleAllSelected(model, key, allValues, checked) {
   if (!model) return
-  model.billingFailStatuses = checked ? [...billingFailAllValues.value] : []
+  model[key] = checked ? [...resolveAllValues(allValues)] : []
 }
 
 const searchColumns = [