feat(工单管理): 添加列表

src/api/order-manage.ts

@@ -0,0 +1,10 @@
+import { http } from '@/http/http'
+
+/**
+ * @description 获取骑行中与待支付的订单列表
+ * @param query
+ * @returns
+ */
+export function getOrderManageListApi(query: { pageNum: number, pageSize: number }) {
+  return http.get<any>('/operations/statistics/getDiffOperatorOrderList', query)
+}

src/pages-sub/common/config/menu.ts

@@ -81,6 +81,13 @@ export const menu_list = [
           },
         ],
       },
+      {
+        key: 'orderManagement',
+        name: '工单管理',
+        type: 'page',
+        path: '/pages-sub/order-manage/index',
+        customsrc: 'APPICON_ZHANDIANGUANLI_IMAGE',
+      },
     ],
   },
   {

src/pages-sub/order-manage/index.vue

@@ -0,0 +1,195 @@
+<script setup lang="ts">
+import { getOrderManageListApi } from '@/api/order-manage'
+import { useOperatorStore } from '@/store'
+import { systemInfo } from '@/utils/systemInfo'
+
+definePage({
+  style: {
+    navigationStyle: 'custom',
+  },
+})
+
+function handleBack() {
+  uni.navigateBack()
+}
+const paging = ref<any>(null)
+
+const orderList = ref([])
+async function queryOrderList(pageNum: number, pageSize: number) {
+  try {
+    uni.showLoading({
+      title: '加载中',
+    })
+    const { records } = await getOrderManageListApi({
+      pageNum,
+      pageSize,
+    })
+    uni.hideLoading()
+    paging.value.complete(records)
+  }
+  catch (e) {
+    uni.hideLoading()
+    paging.value.complete(false)
+  }
+}
+
+const operatorStore = useOperatorStore()
+const operatorAllList = ref<any>([])
+onMounted(async () => {
+  operatorAllList.value = await operatorStore.getOperatorList()
+})
+</script>
+
+<template>
+  <z-paging
+    ref="paging"
+    v-model="orderList"
+    bg-color="#f3f3f3"
+    :default-page-no="Number('1')"
+    :default-page-size="Number('10')"
+    :auto-show-back-to-top="Boolean(true)"
+    @query="queryOrderList"
+  >
+    <template #top>
+      <view class="custom_navbar" :style="{ height: `${systemInfo.statusBarHeight + 44}px` }">
+        <view class="back_bar">
+          <uv-icon name="arrow-left" color="white" size="24" @click="handleBack" />
+          <text class="text">工单管理</text>
+        </view>
+      </view>
+    </template>
+    <view class="container">
+      <view class="list-panel">
+        <view
+          v-for="(item) in orderList"
+          :key="item.orderId"
+        >
+          <view class="card">
+            <view class="body">
+              <view class="row">
+                <view class="text">
+                  <view>车辆编号：{{ item.bikeCode }}</view>
+                </view>
+              </view>
+              <view class="row">
+                <view class="text">
+                  <view>订单编号：{{ item.orderId }}</view>
+                </view>
+              </view>
+              <view class="row">
+                <view class="text">
+                  <view>运营商：{{ operatorStore.translateOperatorId(item.operatorId, operatorAllList) }}</view>
+                </view>
+              </view>
+              <view class="row">
+                <view class="text">
+                  <view>实付金额：{{ item.actualAmount }}元</view>
+                </view>
+              </view>
+            </view>
+            <view class="footer">
+              <uv-button
+                type="primary"
+                :custom-style="{
+                  backgroundImage: `linear-gradient(226deg, #3C9CFE 0%, #067AF2 100%)`,
+                  borderRadius: '26rpx',
+                  height: '70rpx',
+                  width: '180rpx',
+                }"
+                :custom-text-style="{
+                  fontSize: '26rpx',
+                  marginLeft: '8rpx',
+                }"
+                text="修改价格"
+              />
+              <uv-button
+                type="primary"
+                :custom-style="{
+                  backgroundImage: `linear-gradient(226deg, #3C9CFE 0%, #067AF2 100%)`,
+                  borderRadius: '26rpx',
+                  height: '70rpx',
+                  width: '180rpx',
+                }"
+                :custom-text-style="{
+                  fontSize: '26rpx',
+                  marginLeft: '8rpx',
+                }"
+                text="远程锁车"
+              />
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </z-paging>
+</template>
+
+<style lang="scss" scoped>
+.custom_navbar {
+  width: 100%;
+  position: relative;
+  background-color: #0f74ff;
+
+  .back_bar {
+    display: flex;
+    align-items: center;
+    position: absolute;
+    bottom: 25rpx;
+    left: 30rpx;
+
+    .text {
+      font-family: SourceHanSansCN-Medium;
+      font-size: 34rpx;
+      color: white;
+      letter-spacing: 0;
+      font-weight: 500;
+    }
+  }
+}
+.container {
+  & .list-panel {
+    padding: 10px 5px 0px 0px;
+    width: 100%;
+    & .card {
+      padding: 10px;
+      margin: 10px;
+      border-radius: 26rpx;
+      background-color: #fff;
+      box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.04);
+      & .body {
+        & .row {
+          width: 100%;
+          display: flex;
+          align-items: center;
+          margin-bottom: 16rpx;
+
+          .icon {
+            width: 46rpx;
+            height: 40rpx;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            overflow: hidden;
+          }
+
+          .text {
+            margin-left: 16rpx;
+            transform: translateY(4rpx);
+            font-family: PingFangSC-Regular;
+            font-size: 26rpx;
+            color: #999999;
+            letter-spacing: 0;
+            font-weight: 400;
+          }
+        }
+      }
+      & .footer {
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+        gap: 4px;
+      }
+    }
+  }
+}
+</style>