feat: 规格变更单-列表&筛选

+import request from '@/utils/request'
+import { ContentTypeEnum } from '@/utils/httpEnum';
+
+const baseUrl = '/order/change';
+
+// 查询列表
+export function queryApi(params) {
+  return request({
+    url: `${baseUrl}/query`,
+    method: 'get',
+    params
+  })
+}
+
+// 根据ID查询详情数据
+export function getDetailApi(id) {
+  return request({
+    url: `${baseUrl}`,
+    method: 'get',
+    params: { id }
+  })
+}
+
+// 新增保存
+export function createApi(params) {
+  return request({
+    url: `${baseUrl}`,
+    method: 'post',
+    data: params,
+    contentType: ContentTypeEnum.JSON
+  })
+}
+
+// 修改保存
+export function updateApi(params) {
+  return request({
+    url: `${baseUrl}`,
+    method: 'put',
+    data: params,
+    contentType: ContentTypeEnum.JSON
+  })
+}
+
+// 取消
+export function cancelApi(id) {
+  return request({
+    url: `${baseUrl}/cancel`,
+    method: 'get',
+    params: { 
+        id,
+        status: 'CANCEL',
+    },
+    contentType: ContentTypeEnum.FORM_URLENCODED
+  })
+}
+
+
+// 确认变更
+export function confirmApi(id) {
+  return request({
+    url: `${baseUrl}/confirm`,
+    method: 'get',
+    params: { 
+        id,
+    },
+    contentType: ContentTypeEnum.FORM_URLENCODED
+  })
+}

@@ -174,6 +174,14 @@
             }
         },
         {
+            "path": "pages/change_list/index",
+            "style": {
+                "navigationBarTitleText": "规格变更单",
+                "navigationBarBackgroundColor": "#ffffff",
+                "navigationBarTextStyle": "black"
+            }
+        },
+        {
             "path": "pages/contract_framework/index",
             "style": {
                 "navigationBarTitleText": "框架合同",

+<template>
+  <view class="page">
+    <view class="fixed">
+      <view class="search-row">
+        <uni-search-bar v-model="searchKeyword" radius="6" placeholder="请输入订货单位或订单编号" clearButton="auto"
+          cancelButton="none" bgColor="#F3F3F3" textColor="rgba(0,0,0,0.4)" @confirm="onSearchConfirm"
+          @input="onSearchInput" />
+        <image class="tool-icon" src="/static/images/dev_manage/add_icon.png" @click="onAdd" />
+        <image class="tool-icon" src="/static/images/dev_manage/filter_icon.png" @click="openFilter" />
+      </view>
+    </view>
+
+    <view class="list-box">
+      <CardList ref="cardRef" :fetchFn="fetchList" :query="query" :extra="extraParams" :enable-refresh="true"
+        :enable-load-more="true" row-key="id" @loaded="onLoaded" @error="onError">
+        <template v-slot="{ item }">
+          <view class="card">
+            <view class="card-header">
+              <text class="title omit2">{{ item.orderingUnitName }}</text>
+              <text v-if="item.examineStatus" :class="['status', `status_${item.examineStatus}`]">{{ filterStatus(item.examineStatus)
+              }}</text>
+            </view>
+            <view class="info-row"><text>订单编号</text><text>{{ item.orderNo }}</text></view>
+            <view class="info-row"><text>生产厂</text><text>{{ item.workshopName }}</text></view>
+            <view class="info-row"><text>办事处</text><text>{{ item.deptName }}</text></view>
+            <view class="info-row"><text>变更日期</text><text>{{ item.createDate }}</text></view>
+          </view>
+        </template>
+      </CardList>
+    </view>
+
+    <filter-modal :visible.sync="filterVisible" :value.sync="filterForm" title="筛选" @reset="onFilterReset"
+      @confirm="onFilterConfirm">
+      <template v-slot="{ model }">
+        <view class="filter-form">
+
+          <view class="form-item">
+            <view class="label">状态</view>
+            <uni-data-checkbox mode="tag" :multiple="false" :value-field="'value'" :text-field="'text'"
+              v-model="model.examineStatus" @change="onStatusChange" :localdata="statusOptions" />
+          </view>
+
+          <view class="form-item">
+            <view class="label">订货日期</view>
+            <uni-datetime-picker type="daterange" v-model="model.dateRange" start="2023-01-01" />
+          </view>
+        </view>
+      </template>
+    </filter-modal>
+
+  </view>
+</template>
+
+<script>
+import CardList from '@/components/card/index.vue'
+import FilterModal from '@/components/filter/index.vue'
+import { queryApi as changeQueryApi } from '@/api/change_list.js'
+import { getDicByCodeApi } from '@/api/base.js'
+
+export default {
+  name: 'ChangeList',
+  components: { CardList, FilterModal },
+  data() {
+    return {
+      searchKeyword: '',
+      searchKeywordDebounced: '',
+      searchDebounceTimer: null,
+      filterVisible: false,
+      filterForm: {
+        examineStatus: '',
+        dateRange: []
+      },
+      statusOptions: [],
+      query: {},
+      extraParams: {},
+      currentItems: []
+    }
+  },
+  created() {
+    this.extraParams = {}
+    this.loadStatusOptions()
+  },
+  onReachBottom() {
+    if (this.$refs && this.$refs.cardRef && this.$refs.cardRef.onLoadMore) {
+      this.$refs.cardRef.onLoadMore()
+    }
+  },
+  methods: {
+    async loadStatusOptions() {
+      try {
+        const res = await getDicByCodeApi('AUDIT_STATUS')
+        const list = res.data || []
+        this.statusOptions = list.map(it => ({ text: it.name || '', value: it.code || '' }))
+      } catch (e) {
+        this.statusOptions = []
+      }
+    },
+    onSearchInput(val) {
+      if (this.searchDebounceTimer) clearTimeout(this.searchDebounceTimer)
+      this.searchDebounceTimer = setTimeout(() => {
+        this.searchKeywordDebounced = this.searchKeyword
+        this.searchDebounceTimer = null
+        this.extraParams = {
+          searchKey: this.searchKeywordDebounced || '',
+        }
+      }, 800)
+    },
+    onSearchConfirm(e) {
+      const val = e && e.value != null ? e.value : this.searchKeyword
+      this.searchKeyword = val
+      this.searchKeywordDebounced = val
+      this.extraParams = {
+        searchKey: this.searchKeywordDebounced || '',
+      }
+    },
+    openFilter() { this.filterVisible = true },
+    onFilterReset(payload) { this.filterForm = payload },
+    onFilterConfirm(payload) {
+      // 兜底不同端 v-model 差异
+      if ((payload.examineStatus === '' || payload.examineStatus == null) && this.filterForm.examineStatus !== '') {
+        payload.examineStatus = this.filterForm.examineStatus
+      }
+      this.filterForm = payload
+      // 将条件同步给 CardList
+      const query = { ...payload }
+      // 处理日期范围 -> 拆分到 orderDateStart/orderDateEnd
+      if (Array.isArray(query.dateRange) && query.dateRange.length === 2) {
+        query.orderDateStart = query.dateRange[0]
+        query.orderDateEnd = query.dateRange[1]
+        delete query.dateRange
+      }
+      this.query = query
+      this.filterVisible = false
+    },
+    onStatusChange(e) {
+      const raw = e && e.detail && e.detail.value !== undefined ? e.detail.value : (e && e.value !== undefined ? e.value : '')
+      this.filterForm.examineStatus = raw
+    },
+    onLoaded({ items }) { this.currentItems = items || [] },
+    onError() { uni.showToast({ title: '列表加载失败', icon: 'none' }) },
+    fetchList({ pageIndex, pageSize, query, extra }) {
+      const params = { pageIndex, pageSize, ...query, ...extra }
+      return changeQueryApi(params).then(res => {
+        const _data = res && res.data ? res.data : {}
+        let records = _data.datas || _data.list || _data.records || []
+        const totalCount = _data.totalCount || _data.count || 0
+        const hasNext = _data.hasNext || false
+        const statusTextMap = (this.statusOptions || []).reduce((acc, it) => {
+          acc[String(it.value)] = it.text
+          return acc
+        }, {})
+        records = records.map(it => ({
+          ...it,
+          statusName: statusTextMap[String(it.examineStatus)] || ''
+        }))
+        return { records, totalCount, hasNext }
+      }).catch(() => {
+        this.onError()
+        return { records: [], totalCount: 0, hasNext: false }
+      })
+    },
+    filterStatus(status) {
+      return this.statusOptions.filter(item => item.value === status)[0].text || '';
+    },
+    onAdd() {
+      uni.navigateTo({
+        url: '/pages/change_list/add'
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.page {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+}
+
+.fixed {
+  position: fixed;
+  top: 96rpx;
+  left: 0;
+  right: 0;
+  z-index: 2;
+  background: #fff;
+}
+
+.search-row {
+  display: flex;
+  align-items: center;
+  padding: 16rpx 32rpx;
+}
+
+.search-row .tool-icon {
+  width: 48rpx;
+  height: 48rpx;
+  margin-left: 16rpx;
+}
+
+.search-row .uni-searchbar {
+  padding: 0;
+  flex: 1;
+}
+
+::v-deep .uni-searchbar__box {
+  height: 80rpx !important;
+  justify-content: start;
+}
+
+::v-deep .uni-searchbar__box .uni-searchbar__box-search-input {
+  font-size: 32rpx !important;
+}
+
+.list-box {
+  flex: 1;
+  padding: 120rpx 0 0;
+}
+
+.card {
+  position: relative;
+
+  .card-header {
+    margin-bottom: 28rpx;
+    position: relative;
+
+    .title {
+      font-size: 36rpx;
+      font-weight: 600;
+      line-height: 50rpx;
+      color: rgba(0, 0, 0, 0.9);
+      width: 578rpx;
+    }
+
+    .status {
+      font-weight: 600;
+      position: absolute;
+      top: -32rpx;
+      right: -32rpx;
+      height: 48rpx;
+      line-height: 48rpx;
+      color: #fff;
+      font-size: 24rpx;
+      padding: 0 14rpx;
+      border-radius: 6rpx;
+
+      // 审核中
+      &.status_AUDIT {
+        background: $theme-primary;
+      }
+
+      // 审核通过
+      &.status_PASS {
+        background: #2BA471;
+      }
+
+      // 已驳回
+      &.status_REFUSE {
+        background: #d54941;
+      }
+
+      // 已取消
+      &.status_CANCEL {
+        background: #e7e7e7;
+        color: rgba(0, 0, 0, 0.6);
+      }
+
+    }
+  }
+
+  .info-row {
+    display: flex;
+    align-items: center;
+    color: rgba(0, 0, 0, 0.6);
+    font-size: 28rpx;
+    margin-bottom: 24rpx;
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+
+    text {
+      width: 60%;
+      line-height: 32rpx;
+
+      &:last-child {
+        color: rgba(0, 0, 0, 0.9);
+        width: 40%;
+      }
+    }
+  }
+
+}
+
+.filter-form {
+  .form-item {
+    margin-bottom: 24rpx;
+  }
+
+  .label {
+    margin-bottom: 20rpx;
+    color: rgba(0, 0, 0, 0.9);
+    height: 44rpx;
+    line-height: 44rpx;
+    font-size: 30rpx;
+  }
+}
+
+/* 深度覆盖 uni-data-checkbox（mode=tag）内部的 tag 展示与间距 */
+::v-deep .filter-form .uni-data-checklist .checklist-group {
+  .checklist-box {
+    &.is--tag {
+      width: 212rpx;
+      margin-top: 0;
+      margin-bottom: 24rpx;
+      margin-right: 24rpx;
+      height: 80rpx;
+      padding: 0;
+      border-radius: 12rpx;
+      background-color: #f3f3f3;
+      border-color: #f3f3f3;
+
+      &:nth-child(3n) {
+        margin-right: 0;
+      }
+
+      .checklist-content {
+        display: flex;
+        justify-content: center;
+      }
+
+      .checklist-text {
+        color: rgba(0, 0, 0, 0.9);
+        font-size: 28rpx;
+      }
+    }
+
+    &.is-checked {
+      background-color: $theme-primary-plain-bg !important;
+      border-color: $theme-primary-plain-bg !important;
+
+      .checklist-text {
+        color: $theme-primary !important;
+      }
+    }
+  }
+
+}
+</style>

@@ -164,7 +164,7 @@ export default {
     },
     onAdd() {
       uni.navigateTo({
-        url: '/pages/order_revoke/add'
+        url: '/pages/revoke_list/add'
       })
     },
   }