移动端功能优化

baoshiwei

2025-06-12 bab490d2da009c1a23b352b3b964e0c2dd06a0b3

 eims-ui-mobile/src/pages/repair/req-list.vue

@@ -23,125 +23,134 @@
        custom-style="background: #4D80F0;"
        safeAreaInsetTop
      ></wd-navbar>
      <wd-drop-menu v-if="!isSelectReq">
        <wd-drop-menu-item
          v-model="reqTypeId"
          label-key="dictLabel"
          value-key="dictValue"
          :options="reqTypeList"
          @change="handleReqType"
        />
        <wd-drop-menu-item
          v-model="filterDate"
          :options="filterDateList"
          @change="handleFilterDate"
        />
        <wd-drop-menu-item
          v-model="status"
          label-key="dictLabel"
          value-key="dictValue"
          :options="statusList"
          @change="handleReqStatu"
        />
      </wd-drop-menu>
<!--      <wd-drop-menu v-if="!isSelectReq">-->
<!--        <wd-drop-menu-item-->
<!--          v-model="reqTypeId"-->
<!--          label-key="dictLabel"-->
<!--          value-key="dictValue"-->
<!--          :options="reqTypeList"-->
<!--          @change="handleReqType"-->
<!--        />-->
<!--        <wd-drop-menu-item-->
<!--          v-model="filterDate"-->
<!--          :options="filterDateList"-->
<!--          @change="handleFilterDate"-->
<!--        />-->
<!--        <wd-drop-menu-item-->
<!--          v-model="status"-->
<!--          label-key="dictLabel"-->
<!--          value-key="dictValue"-->
<!--          :options="statusList"-->
<!--          @change="handleReqStatu"-->
<!--        />-->
<!--      </wd-drop-menu>-->
    </template>

    <view class="bg-base">
      <wd-card type="rectangle" v-for="(item, index) in dataList" :key="item.id">
        <template #title>
          <view class="flex justify-between items-center">
            <view class="flex items-center menu-title-box">
              <view class="menu-indicator"></view>
              <text class="ml-1 text-sm">{{ item.code }}</text>
            </view>
      <ReqCard
        v-for="item in dataList"
        :key="item.id"
        :item="item"
        @itemClick="itemClick"
      ></ReqCard>
<!--      <wd-card type="rectangle" v-for="(item, index) in dataList" :key="item.id">-->
<!--        <template #title>-->
<!--          <view class="flex justify-between items-center">-->
<!--            <view class="flex items-center menu-title-box">-->
<!--              <view class="menu-indicator"></view>-->
<!--              <text class="ml-1 text-sm">{{ item.code }}</text>-->
<!--            </view>-->

            <view>
              <wd-button size="small" v-if="item.status === '0'" type="info">待接单</wd-button>
              <wd-button size="small" v-else-if="item.status === '1'" type="warning">
                已接单
              </wd-button>
              <wd-button size="small" v-else-if="item.status === '2'" type="primary">
                维修中
              </wd-button>
              <wd-button size="small" v-else-if="item.status === '3'" type="success">
                已完成
              </wd-button>
            </view>
          </view>
        </template>
        <wd-swipe-action>
          <view class="flex h-[160rpx] items-center" @click.stop="itemClick(item)">
            <image
              v-if="item.reqType === '1'"
              class="slot-img text-center"
              src="/static/ico/ico-huiyi.png"
            />
            <image
              v-else-if="item.reqType === '2'"
              class="slot-img text-center"
              src="/static/ico/ico-setting.png"
            />
            <image
              v-else-if="item.reqType === '3'"
              class="slot-img text-center"
              src="/static/ico/ico-faxian.png"
            />
            <view class="flex-1 mt-1">
              <view class="text-color-base">
                <template v-if="item.reqType === '1'">
                  <text>设备类型</text>
                  <text class="mx-2">|</text>
                  <text>{{ item.equName }}</text>
                </template>
<!--            <view>-->
<!--              <wd-button size="small" v-if="item.status === '0'" type="info">待接单</wd-button>-->
<!--              <wd-button size="small" v-else-if="item.status === '1'" type="warning">-->
<!--                已接单-->
<!--              </wd-button>-->
<!--              <wd-button size="small" v-else-if="item.status === '2'" type="primary">-->
<!--                维修中-->
<!--              </wd-button>-->
<!--              <wd-button size="small" v-else-if="item.status === '3'" type="success">-->
<!--                已完成-->
<!--              </wd-button>-->
<!--            </view>-->
<!--          </view>-->
<!--        </template>-->
<!--        <wd-swipe-action>-->
<!--          <view class="flex h-[160rpx] items-center" @click.stop="itemClick(item)">-->
<!--            <image-->
<!--              v-if="item.reqType === '1'"-->
<!--              class="slot-img text-center"-->
<!--              src="/static/ico/ico-huiyi.png"-->
<!--            />-->
<!--            <image-->
<!--              v-else-if="item.reqType === '2'"-->
<!--              class="slot-img text-center"-->
<!--              src="/static/ico/ico-setting.png"-->
<!--            />-->
<!--            <image-->
<!--              v-else-if="item.reqType === '3'"-->
<!--              class="slot-img text-center"-->
<!--              src="/static/ico/ico-faxian.png"-->
<!--            />-->
<!--            <view class="flex-1 mt-1">-->
<!--              <view class="text-color-base">-->
<!--                <template v-if="item.reqType === '1'">-->
<!--                  <text>设备类型</text>-->
<!--                  <text class="mx-2">|</text>-->
<!--                  <text>{{ item.equName }}</text>-->
<!--                </template>-->

                <template v-if="item.reqType === '2'">
                  <text>工具类型</text>
                  <text class="mx-2">|</text>
                  <text>{{ item.fixtureName }}</text>
                </template>
<!--                <template v-if="item.reqType === '2'">-->
<!--                  <text>工具类型</text>-->
<!--                  <text class="mx-2">|</text>-->
<!--                  <text>{{ item.fixtureName }}</text>-->
<!--                </template>-->

                <template v-if="item.reqType === '3'">
                  <text>其他类型</text>
                </template>
                <view class="text-color-gray mt-1 text-mini">
                  <text>发生时间: {{ item.occTime }}</text>
                </view>
<!--                <template v-if="item.reqType === '3'">-->
<!--                  <text>其他类型</text>-->
<!--                </template>-->
<!--                <view class="text-color-gray mt-1 text-mini">-->
<!--                  <text>发生时间: {{ item.occTime }}</text>-->
<!--                </view>-->

                <view class="text-color-gray mt-1 text-mini">
                  <text>报修时间: {{ item.reqTime }}</text>
                </view>
                <view class="text-color-gray mt-1 text-mini">
                  <text>报修人: {{ item.reqUserName }}</text>
                </view>
              </view>
              <view class="text-color-gray text-sm mt-1">
                {{ item.location }} {{ item.madeIn }}
              </view>
            </view>
            <view v-if="isSelectReq">
              <wd-button size="small" icon="edit-outline" @click.stop="handleSelectReq(item)">
                接单
              </wd-button>
            </view>
          </view>
          <template #right>
            <view class="h-full px-3 flex items-center">
              <wd-button size="small" type="error" @click.stop="handleDelete(item)">删除</wd-button>
            </view>
          </template>
        </wd-swipe-action>
      </wd-card>
<!--                <view class="text-color-gray mt-1 text-mini">-->
<!--                  <text>报修时间: {{ item.reqTime }}</text>-->
<!--                </view>-->
<!--                <view class="text-color-gray mt-1 text-mini">-->
<!--                  <text>报修人: {{ item.reqUserName }}</text>-->
<!--                </view>-->
<!--              </view>-->
<!--              <view class="text-color-gray text-sm mt-1">-->
<!--                {{ item.location }} {{ item.madeIn }}-->
<!--              </view>-->
<!--            </view>-->
<!--            <view v-if="isSelectReq">-->
<!--              <wd-button size="small" icon="edit-outline" @click.stop="handleSelectReq(item)">-->
<!--                接单-->
<!--              </wd-button>-->
<!--            </view>-->
<!--          </view>-->
<!--          <template #right>-->
<!--            <view class="h-full px-3 flex items-center">-->
<!--              <wd-button size="small" type="error" @click.stop="handleDelete(item)">删除</wd-button>-->
<!--            </view>-->
<!--          </template>-->
<!--        </wd-swipe-action>-->
<!--      </wd-card>-->
    </view>
  </z-paging>
</template>

<script setup lang="ts">
import { onMounted, getCurrentInstance, ref } from 'vue'
import { useToast, useMessage } from 'wot-design-uni'
import { getRepairReqList, delRepairReq } from '@/service/repair'
import { DICT_REPAIR_REQ_STATUS, DICT_REPAIR_REQ_TYPE, getDictInfo } from '@/service/dict'
import dayjs from "dayjs";
import { isEquAdmin, isRepair } from "@/utils/RoleUtils";
import { useUserStore } from "@/store";
import ReqCard from "@/components/repair/req-card.vue";

const userStore = useUserStore()
const message = useMessage()
const toast = useToast()
// 报修单类型
@@ -180,31 +189,38 @@
  const queryParams: any = {
    pageNum,
    pageSize,
    reqType: reqTypeId.value,
    status: status.value,
    params: {},
  }
  if (reqTypeId.value === -1) {
    delete queryParams.reqType
  }
  if (status.value === -1) {
    delete queryParams.status
  }
  // if (reqTypeId.value === -1) {
  //   delete queryParams.reqType
  // }
  // if (status.value === -1) {
  //   delete queryParams.status
  // }
  //
  // if (filterDate.value === '1') {
  //   // 获取当前日期
  //   const now = dayjs()
  //   queryParams.params = {
  //     beginReqTime: now.startOf('day').format('YYYY-MM-DD 00:00:00'),
  //     endReqTime: now.endOf('day').format('YYYY-MM-DD 23:59:59'),
  //   }
  // } else if (filterDate.value === '2') {
  //   const now = dayjs()
  //   queryParams.params = {
  //     beginReqTime: now.startOf('month').format('YYYY-MM-DD 00:00:00'),
  //     endReqTime: now.endOf('month').format('YYYY-MM-DD 23:59:59'),
  //   }
  // } else {
  //   delete queryParams.params
  // }

  if (filterDate.value === '1') {
    // 获取当前日期
    const now = dayjs()
    queryParams.params = {
      beginReqTime: now.startOf('day').format('YYYY-MM-DD 00:00:00'),
      endReqTime: now.endOf('day').format('YYYY-MM-DD 23:59:59'),
    }
  } else if (filterDate.value === '2') {
    const now = dayjs()
    queryParams.params = {
      beginReqTime: now.startOf('month').format('YYYY-MM-DD 00:00:00'),
      endReqTime: now.endOf('month').format('YYYY-MM-DD 23:59:59'),
    }
  } else {
    delete queryParams.params
  // 查询未完成的报修单
  queryParams.params.status = '0,1,2'
  queryParams.reqUser = userStore?.userInfo?.userId
  if (isRepair() || isEquAdmin()) {
    queryParams.params.status = '0'
    queryParams.reqUser = undefined
  }

  getRepairReqList(queryParams)
@@ -330,10 +346,10 @@

onLoad(() => {
  initData()
  uni.$on('req-list-refresh', reloadData)
  uni.$on('list-refresh', reloadData)
})
onUnload(() => {
  uni.$off('req-list-refresh', reloadData)
  uni.$off('list-refresh', reloadData)
})
</script>