From 5822009abe1e19a5ab8ad949d282ab46236da93b Mon Sep 17 00:00:00 2001
From: liugongyu <290219706@qq.com>
Date: Wed, 17 Dec 2025 19:59:18 +0800
Subject: [PATCH] 工单管理--新增工单

---
 pages-sub/problem/work-order-manage/add-order.vue | 1055 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
 1 file changed, 540 insertions(+), 515 deletions(-)

diff --git a/pages-sub/problem/work-order-manage/add-order.vue b/pages-sub/problem/work-order-manage/add-order.vue
index 56b7147..e417214 100644
--- a/pages-sub/problem/work-order-manage/add-order.vue
+++ b/pages-sub/problem/work-order-manage/add-order.vue
@@ -1,547 +1,572 @@
 <template>
-  <view class="page-container">
-    <!-- 顶部固定区域 -->
-    <up-sticky>
-      <view class="header-wrap">
-        <!-- 第一行：u-tabs 待办/已办切换  :scrollable="false"-->
-        <up-tabs
-            v-model="activeTab"
-            :list="tabList"
-            active-color="#1989fa"
-            inactive-color="#666"
-            font-size="30rpx"
-
-            @change="handleTabChange"
-        />
-
-        <!-- 第二行：下拉框 + 搜索框 -->
-        <view class="search-header">
-          <!-- 左侧下拉框 -->
-          <view class="select-wrap">
-            <up-select
-                v-model:current="selectedSortValue"
-                :options="sortOptions"
-                :showOptionsLabel="true"
-                @select="handleSortChange"
-                border="surround"
-                :style="{ flex: 1 }"
-            />
-          </view>
-
-          <!-- 右侧搜索框 -->
-          <view class="search-input-wrap">
-            <up-search
-                v-model="searchValue"
-                placeholder="请输入关键字"
-                @search="handleSearch"
-                bg-color="#f5f5f5"
-                :clearabled="false"
-                :show-action="true"
-                actionText="搜索"
-                :animation="true"
-                @custom="handleSearch"
-            />
-          </view>
-        </view>
-      </view>
-    </up-sticky>
-
-    <!-- 列表容器 -->
-    <z-paging
-        ref="paging"
-        v-model="orderList"
-        @query="queryList"
-        :auto-show-system-loading="true"
-
-    >
-      <template #empty>
-        <view class="empty-view" style="padding: 100rpx 0; text-align: center; color: #999;">
-          暂无工单数据
-        </view>
-      </template>
-
-      <view class="common-card-list" slot="top">
-        <!-- 待办工单卡片 -->
-        <up-card
-            v-if="activeTab === 0"
-            :border="false"
-            :foot-border-top="false"
-            v-for="(item, index) in orderList"
-            :key="`todo_${item.orderNo}_${index}`"
-            :show-head="false"
-            class="order-card"
+  <view class="u-page">
+    <!-- 核心：将所有 up-form-item 包裹在同一个 up-form 内 -->
+    <view class="work-order-form-content commonPageLRpadding">
+      <up-form
+          label-position="left"
+          :model="workOrderForm"
+          ref="workOrderFormRef"
+          labelWidth="160rpx"
+      >
+        <!-- 1. 工单位置（地图选择） -->
+        <up-form-item
+            label="工单位置"
+            prop="workLocation"
+            border-bottom
+            required
+            @click="chooseWorkLocation(); hideKeyboard()"
         >
-          <template #body>
-            <view class="card-body">
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">工单编号：</view>
-                <view class="u-line-1 u-body-value">{{ item.orderNo || '-' }}</view>
-              </view>
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">工单位置：</view>
-                <view class="u-line-1 u-body-value">{{ item.roadName || '-' }}</view>
-              </view>
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">工单名称：</view>
-                <view class="u-line-1 u-body-value">{{ item.orderName || '未填写' }}</view>
-              </view>
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">情况描述：</view>
-                <view class="u-line-1 u-body-value">{{ item.remark || '无' }}</view>
-              </view>
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">紧急程度：</view>
-                <view class="u-line-1 u-body-value">
-                  <up-tag :type="getUrgencyType(item.urgencyLevel)">{{ item.urgencyLevel || '普通' }}</up-tag>
-                </view>
-              </view>
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">提交时间：</view>
-                <view class="u-line-1 u-body-value">{{ timeFormat(item.createTime, 'yyyy-mm-dd hh:MM:ss') }}</view>
-              </view>
-              <!-- 操作按钮行 -->
-              <view class="u-body-item u-flex common-justify-between common-item-center mt-20">
-                <up-button type="warning" size="mini" @click="handleReject(item)">回退</up-button>
-                <up-button type="primary" size="mini" @click="handleProcess(item)">处理</up-button>
-                <up-button type="info" size="mini" @click="handleDetail(item)">详情</up-button>
-              </view>
-            </view>
+          <up-input
+              v-model="workOrderForm.workLocation"
+              border="none"
+              readonly
+              suffix-icon="map-fill"
+              placeholder="点击选择工单位置"
+          ></up-input>
+        </up-form-item>
+
+        <!-- 2. 道路名称（下拉框：位置选择后才可点击） -->
+        <up-form-item
+            label="道路名称"
+            prop="roadName"
+            border-bottom
+            required
+            @click="workOrderForm.workLocation ? (showRoadName = true, hideKeyboard()) : uni.showToast({title: '请先选择工单位置', icon: 'none'})"
+        >
+          <up-input
+              v-model="workOrderForm.roadName"
+              disabled
+              disabled-color="#ffffff"
+              placeholder="请先选择工单位置"
+              border="none"
+              :placeholder-style="workOrderForm.workLocation ? '' : 'color:#999;'"
+          ></up-input>
+          <template #right>
+            <up-icon name="arrow-right" size="16" :color="workOrderForm.workLocation ? '#333' : '#999'"></up-icon>
           </template>
-        </up-card>
-
-        <!-- 已办工单卡片 -->
-        <up-card
-            v-if="activeTab === 1"
-            :border="false"
-            :foot-border-top="false"
-            v-for="(item, index) in orderList"
-            :key="`done_${item.orderNo}_${index}`"
-            :show-head="false"
-            class="order-card"
+        </up-form-item>
+
+        <!-- 3. 工单名称（下拉框） -->
+        <up-form-item
+            label="工单名称"
+            prop="orderName"
+            border-bottom
+            required
+            @click="showOrderName = true; hideKeyboard()"
         >
-          <template #body>
-            <view class="card-body">
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">工单编号：</view>
-                <view class="u-line-1 u-body-value">{{ item.orderNo || '-' }}</view>
-              </view>
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">工单位置：</view>
-                <view class="u-line-1 u-body-value">{{ item.roadName || '-' }}</view>
-              </view>
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">工单名称：</view>
-                <view class="u-line-1 u-body-value">{{ item.orderName || '未填写' }}</view>
-              </view>
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">情况描述：</view>
-                <view class="u-line-1 u-body-value">{{ item.remark || '无' }}</view>
-              </view>
-              <view class="u-body-item u-flex common-justify-between common-item-center">
-                <view class="u-flex">
-                  <view class="u-body-item-title">紧急程度：</view>
-                  <view class="u-line-1 u-body-value">
-                    <up-tag :type="getUrgencyType(item.urgencyLevel)">{{ item.urgencyLevel || '普通' }}</up-tag>
-                  </view>
-                </view>
-                <up-button type="info" size="mini" @click="handleDetail(item)">工单详情</up-button>
-              </view>
-              <view class="u-body-item u-flex">
-                <view class="u-body-item-title">提交时间：</view>
-                <view class="u-line-1 u-body-value">{{ timeFormat(item.createTime, 'yyyy-mm-dd hh:MM:ss') }}</view>
-              </view>
-            </view>
+          <up-input
+              v-model="workOrderForm.orderName"
+              disabled
+              disabled-color="#ffffff"
+              placeholder="请选择工单名称"
+              border="none"
+          ></up-input>
+          <template #right>
+            <up-icon name="arrow-right" size="16"></up-icon>
           </template>
-        </up-card>
-      </view>
-    </z-paging>
-
-    <!-- 底部新增工单按钮（仅巡查员显示） -->
-    <view v-if="isInspector" class="fixed-bottom-btn-wrap">
-      <up-button type="primary" size="large" @click="handleAddOrder">
-        新增工单
-      </up-button>
-    </view>
+        </up-form-item>
+
+        <!-- 新增：紧急程度选择 -->
+        <up-form-item
+            label="紧急程度"
+            prop="pressingType"
+            border-bottom
+            required
+            @click="showPressingType = true; hideKeyboard()"
+        >
+          <up-input
+              v-model="workOrderForm.pressingTypeName"
+              disabled
+              disabled-color="#ffffff"
+              placeholder="请选择紧急程度"
+              border="none"
+          ></up-input>
+          <template #right>
+            <up-icon name="arrow-right" size="16"></up-icon>
+          </template>
+        </up-form-item>
 
-    <!-- 回退原因弹窗 -->
-    <up-popup v-model="rejectPopupShow" mode="center" :close-on-click-overlay="false">
-      <view class="reject-popup">
-        <view class="popup-title">回退原因</view>
-        <up-textarea
-            v-model="rejectReason"
-            placeholder="请输入回退原因（必填）"
-            :required="true"
-            maxlength="-1"
-            rows="4"
-            class="mt-20"
-        />
-        <view class="upload-wrap mt-20">
-          <view class="upload-title">上传图片（选填）</view>
+
+        <!-- 4. 情况描述（文本域） -->
+        <up-form-item
+            label="情况描述"
+            prop="problemDesc"
+            required
+        >
+          <up-textarea
+              placeholder="请输入情况描述（最多200字）"
+              v-model="workOrderForm.problemDesc"
+              count
+              maxlength="200"
+              rows="4"
+              @blur="() => $refs.workOrderFormRef.validateField('problemDesc')"
+          ></up-textarea>
+        </up-form-item>
+
+        <!-- 问题照片（移除完成照片相关代码） -->
+        <up-form-item label="问题照片" prop="problemImgs" required>
           <up-upload
-              :action="uploadUrl"
-              :file-list="rejectFileList"
-              @after-read="handleAfterRead"
-              @delete="handleDeleteFile"
+              :file-list="problemImgsList"
+              @after-read="(event) => uploadImgs(event, 'problemImgsList')"
+              @delete="(event) => deleteImg(event, 'problemImgsList')"
               multiple
-              max-count="3"
-          />
-        </view>
-        <view class="popup-btn-wrap mt-40">
-          <up-button type="default" size="medium" @click="rejectPopupShow = false" class="mr-20">取消</up-button>
-          <up-button type="primary" size="medium" @click="confirmReject">确认提交</up-button>
-        </view>
-      </view>
-    </up-popup>
-  </view>
-</template>
-
-<script setup>
-import { ref, computed, onMounted } from 'vue';
-import { timeFormat } from '@/uni_modules/uview-plus';
-// 假设从用户store获取角色信息
-import { useUserStore } from '@/pinia/user';
-
-// ========== 状态管理 ==========
-const userStore = useUserStore();
-// 标签页切换
-const activeTab = ref(0); // 0-待办 1-已办
-const tabList = ref([
-  { name: '待办' },
-  { name: '已办' }
-]);
-// 排序下拉框
-const selectedSortValue = ref(1);
-const sortOptions = ref([
-  { name: '位置', id: 1 },
-  { name: '名称', id: 2 },
-  { name: '描述', id: 3 },
-  { name: '编号', id: 4 },
-]);
-// 搜索
-const searchValue = ref('');
-// 分页
-const paging = ref(null);
-const orderList = ref([]);
-// 角色控制（巡查员显示新增按钮）
-const isInspector = computed(() => {
-  // 假设用户角色字段为role，巡查员标识为inspector
-  return userStore.userInfo.roles === 'yl_inspector';
-});
-// 回退弹窗相关
-const rejectPopupShow = ref(false);
-const rejectReason = ref('');
-const rejectFileList = ref([]);
-const currentRejectItem = ref(null);
-// 上传地址（根据实际接口配置）
-const uploadUrl = ref('https://xxx.com/upload');
-
-// ========== 接口请求 ==========
-// 待办工单接口
-const getTodoOrderList = async (params) => {
-  // 替换为实际待办工单接口
-  const res = await uni.request({
-    url: '/api/order/todo',
-    method: 'POST',
-    data: params
-  });
-  return res.data;
-};
-
-// 已办工单接口
-const getDoneOrderList = async (params) => {
-  // 替换为实际已办工单接口
-  const res = await uni.request({
-    url: '/api/order/done',
-    method: 'POST',
-    data: params
-  });
-  return res.data;
-};
-
-// 分页查询列表
-const queryList = async (pageNo, pageSize) => {
-  try {
-    const apiParams = {
-      searchContent: searchValue.value.trim() || '',
-      pageNo,
-      pageSize,
-      type: selectedSortValue.value // 1-位置 2-工单名称 3-情况描述 4-工单编号
-    };
-
-    let res;
-    if (activeTab.value === 0) {
-      // 待办工单
-      res = await getTodoOrderList(apiParams);
-    } else {
-      // 已办工单
-      res = await getDoneOrderList(apiParams);
-    }
-
-    // 适配z-paging分页
-    paging.value.complete(res.list, res.total);
-  } catch (error) {
-    console.error('加载工单失败：', error);
-    paging.value?.complete(false);
-    uni.showToast({ title: '加载失败，请重试', icon: 'none' });
-  }
-};
-
-// ========== 事件处理 ==========
-// 标签页切换
-const handleTabChange = (index) => {
-  activeTab.value = index;
-  paging.value?.reload(); // 切换标签页刷新列表
-};
-
-// 排序变更
-const handleSortChange = (val) => {
-  selectedSortValue.value = val.id;
-  searchValue.value = '';
-  paging.value?.reload(); // 排序变更刷新列表
-};
-
-// 搜索
-const handleSearch = (val) => {
-  searchValue.value = val;
-  paging.value?.reload(); // 搜索刷新列表
-};
-
-// 工单详情
-const handleDetail = (item) => {
-  uni.navigateTo({
-    url: `/pages-sub/daily/quick-order/order-detail?id=${item.id}`
-  });
-};
-
-// 待办-处理工单
-const handleProcess = async (item) => {
-  try {
-    // 调用处理工单接口，获取跳转标识
-    const res = await uni.request({
-      url: '/api/order/process',
-      method: 'POST',
-      data: { orderId: item.id }
-    });
-
-    const { jumpType, jumpUrl } = res.data;
-    // 根据返回标识跳转不同页面
-    if (jumpType === 1) {
-      uni.navigateTo({ url: jumpUrl });
-    } else if (jumpType === 2) {
-      uni.redirectTo({ url: jumpUrl });
-    } else if (jumpType === 3) {
-      uni.switchTab({ url: jumpUrl });
-    }
-  } catch (error) {
-    console.error('处理工单失败：', error);
-    uni.showToast({ title: '处理失败，请重试', icon: 'none' });
-  }
-};
-
-// 待办-回退工单
-const handleReject = (item) => {
-  currentRejectItem.value = item;
-  rejectReason.value = '';
-  rejectFileList.value = [];
-  rejectPopupShow.value = true;
-};
-
-// 确认回退工单
-const confirmReject = async () => {
-  if (!rejectReason.value.trim()) {
-    uni.showToast({ title: '请填写回退原因', icon: 'none' });
-    return;
-  }
-
-  try {
-    // 调用回退工单接口
-    await uni.request({
-      url: '/api/order/reject',
-      method: 'POST',
-      data: {
-        orderId: currentRejectItem.value.id,
-        reason: rejectReason.value,
-        fileUrls: rejectFileList.value.map(file => file.url)
-      }
-    });
-
-    uni.showToast({ title: '回退成功', icon: 'success' });
-    rejectPopupShow.value = false;
-    paging.value?.reload(); // 刷新列表
-  } catch (error) {
-    console.error('回退工单失败：', error);
-    uni.showToast({ title: '回退失败，请重试', icon: 'none' });
-  }
-};
-
-// 新增工单
-const handleAddOrder = () => {
-  uni.navigateTo({
-    url: '/pages-sub/problem/work-order-manage/add-order'
-  });
-};
-
-// 紧急程度标签类型转换
-const getUrgencyType = (level) => {
-  switch (level) {
-    case '紧急':
-      return 'danger';
-    case '重要':
-      return 'warning';
-    case '普通':
-      return 'info';
-    default:
-      return 'default';
-  }
-};
-
-// 上传图片-读取后
-const handleAfterRead = (file) => {
-  rejectFileList.value.push(file);
-};
-
-// 上传图片-删除
-const handleDeleteFile = (index) => {
-  rejectFileList.value.splice(index, 1);
-};
-
-// 页面初始化
-onMounted(() => {
-  // 初始化加载列表
-  paging.value?.reload();
-});
-</script>
-
-<style scoped lang="scss">
-.page-container {
-  min-height: 100vh;
-  background-color: #f8f8f8;
-}
-
-// 顶部固定区域
-.header-wrap {
-  background-color: #fff;
-  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
-}
+              :max-count="3"
+              upload-text="选择问题照片"
+          ></up-upload>
+        </up-form-item>
 
-// 搜索栏样式
-.search-header {
-  display: flex;
-  align-items: center;
-  padding: 20rpx;
-  box-sizing: border-box;
 
-  .select-wrap {
-    width: 120rpx;
-    margin-right: 20rpx;
 
-    :deep(.u-select) {
-      width: 100%;
-      font-size: 28rpx;
-    }
+        <!-- 完成时间 -->
+        <up-form-item
+            label="完成时间"
+            prop="finishTime"
+            @click="show=true;hideKeyboard()"
+        >
+          <up-input
+              v-model="workOrderForm.finishTime"
+              border="none"
+              readonly
+              placeholder="点击选择时间"
+          >
+
+          </up-input>
+          <template #right>
+            <up-icon name="arrow-right" size="16"></up-icon>
+          </template>
+        </up-form-item>
 
-    :deep(.u-input__placeholder) {
-      font-size: 28rpx;
-    }
-  }
 
-  .search-input-wrap {
-    flex: 1;
-  }
-}
+      </up-form>
+    </view>
 
-// 工单卡片样式
-.common-card-list {
-  padding: 20rpx;
-}
+    <!-- 底部提交按钮 -->
+    <view class="fixed-bottom-btn-wrap">
+      <up-button
+          type="primary"
+          text="提交工单"
+          @click="submitWorkOrder"
+      ></up-button>
+    </view>
 
-.order-card {
-  margin-bottom: 20rpx;
-  background-color: #fff;
-  border-radius: 12rpx;
-  overflow: hidden;
-}
+    <!-- 道路名称下拉弹窗 -->
+    <up-action-sheet
+        :show="showRoadName"
+        :actions="roadNameList"
+        title="请选择道路名称"
+        @close="showRoadName = false"
+        @select="handleRoadNameSelect"
+    ></up-action-sheet>
+
+    <!-- 工单名称下拉弹窗 -->
+    <up-action-sheet
+        :show="showOrderName"
+        :actions="orderNameList"
+        title="请选择工单名称"
+        @close="showOrderName = false"
+        @select="handleOrderNameSelect"
+    ></up-action-sheet>
+
+    <!-- 紧急程度下拉弹窗 -->
+    <up-action-sheet
+        :show="showPressingType"
+        :actions="pressingTypeList"
+        title="请选择紧急程度"
+        @close="showPressingType = false"
+        @select="handlePressingTypeSelect"
+    ></up-action-sheet>
+    <!-- 完成时间选择器 -->
+    <up-datetime-picker
+        :show="show"
+        v-model="finishTime"
+        mode="datetime"
+        :min-date="new Date()"
+
+        @cancel="show = false"
+        @confirm="finishTimeConfirm"
+    ></up-datetime-picker>
 
-.card-body {
-  padding: 20rpx;
 
-  .u-body-item {
-    margin-bottom: 16rpx;
-    font-size: 28rpx;
+  </view>
+</template>
 
-    &:last-child {
-      margin-bottom: 0;
-    }
+<script setup lang="ts">
+import {ref} from 'vue'
+import type {UniFormRef} from '@/uni_modules/uview-plus/types'
+// 定义ref供选项式API使用
+const workOrderFormRef = ref<UniFormRef>(null)
+</script>
 
-    .u-body-item-title {
-      color: #666;
-      min-width: 120rpx;
+<script lang="ts">
+import {getRoadListByLatLng} from '@/api/common'
+import {uploadImages} from '@/common/utils/upload';
+import {createQuick} from '@/api/quick-order/quick-order'
+import { timeFormat } from '@/uni_modules/uview-plus' // 引入时间格式化工具
+
+export default {
+  data() {
+    return {
+      // 问题照片列表
+      problemImgsList: [],
+      // 弹窗显隐控制
+      showRoadName: false,
+      showOrderName: false,
+      showPressingType: false,
+      show: false,
+      showBirthday: false, // 生日弹窗控制
+      // 下拉列表数据
+      roadNameList: [],
+      orderNameList: [],
+      pressingTypeList: [],
+      finishTime:Date.now(),
+      // 工单表单数据
+      workOrderForm: {
+        roadId: 0,                     // 道路ID
+        roadName: '',                  // 道路名称
+        workLocation: '',              // 工单位置
+        orderName: '',                 // 工单名称
+        pressingType: 0,               // 紧急程度值（提交接口用）
+        pressingTypeName: '',          // 紧急程度名称（显示用）
+        problemDesc: '',               // 情况描述
+        lat: 0,                        // 纬度
+        lon: 0,                        // 经度
+        finishTime: '',                // 完成时间
+      },
+
+      // 表单校验规则
+      workOrderFormRules: {
+        workLocation: [
+          {type: 'string', required: true, message: '请选择工单位置', trigger: ['change', 'blur']}
+        ],
+        roadName: [
+          {type: 'string', required: true, message: '请选择道路名称', trigger: ['change', 'blur']}
+        ],
+        orderName: [
+          {type: 'string', required: true, message: '请选择工单名称', trigger: ['change', 'blur']}
+        ],
+        pressingType: [
+          {type: 'number', required: true, message: '请选择紧急程度', trigger: ['change']}
+        ],
+        birthday: [ // 新增：生日校验规则
+          {type: 'string', required: true, message: '请选择生日', trigger: ['change']}
+        ],
+        problemDesc: [
+          {type: 'string', required: true, message: '请输入情况描述', trigger: ['change', 'blur']},
+          {type: 'string', min: 3, max: 200, message: '情况描述需3-200字', trigger: ['change', 'blur']}
+        ],
+        problemImgs: [
+          {
+            required: true,
+            message: '请上传问题照片',
+            trigger: 'change',
+            validator: (rule, value, callback) => {
+              const hasSuccessImg = this.problemImgsList.some(item => item.status === 'success')
+              hasSuccessImg ? callback() : callback(new Error('请上传至少1张问题照片'))
+            }
+          }
+        ]
+      }
     }
-
-    .u-body-value {
-      color: #333;
-      flex: 1;
+  },
+
+  onReady() {
+    // 兼容微信小程序，通过setRules设置校验规则
+    this.$refs.workOrderFormRef.setRules(this.workOrderFormRules)
+    console.log('工单表单规则初始化完成')
+  },
+
+  onShow(){
+    console.log(uni.$dict.getDictLabel('ai_image_status', 20))
+    console.log(uni.$dict.getDictSimpleList('work_name'))
+
+    // 初始化工单名称列表
+    this.orderNameList = uni.$dict.transformLabelValueToNameValue(uni.$dict.getDictSimpleList('work_name'))
+    console.log('工单名称列表：', this.orderNameList)
+
+    // 初始化紧急程度列表
+    this.pressingTypeList = uni.$dict.transformLabelValueToNameValue(uni.$dict.getDictSimpleList('workorder_pressing_type'))
+    console.log('紧急程度列表：', this.pressingTypeList)
+  },
+
+  methods: {
+    /**
+     * 返回上一页
+     */
+    navigateBack() {
+      uni.navigateBack()
+    },
+
+    /**
+     * 删除图片
+     */
+    deleteImg(event, type) {
+      console.log('删除图片事件：', event, '类型：', type)
+      if (type === 'problemImgsList') {
+        this.problemImgsList.splice(event.index, 1)
+        this.$refs.workOrderFormRef.validateField('problemImgs')
+      }
+      uni.showToast({title: '图片删除成功', icon: 'success'})
+    },
+
+    /**
+     * 上传图片
+     */
+    async uploadImgs(event, type) {
+      console.log('上传图片事件：', event, '类型：', type)
+      if (type !== 'problemImgsList') return
+
+      const fileList = Array.isArray(event.file) ? event.file : [event.file]
+      const targetImgList = this.problemImgsList
+
+      const filePaths = fileList.map(item => item.url)
+      const tempItems = fileList.map(item => ({
+        ...item,
+        status: 'uploading',
+        message: '上传中'
+      }))
+      const startIndex = targetImgList.length
+      targetImgList.push(...tempItems)
+
+      try {
+        const uploadResultUrls = await uploadImages({
+          filePaths: filePaths,
+          ignoreError: true
+        })
+        console.log('上传成功的URL列表：', uploadResultUrls)
+
+        uploadResultUrls.forEach((url, index) => {
+          if (targetImgList[startIndex + index]) {
+            targetImgList.splice(startIndex + index, 1, {
+              ...fileList[index],
+              status: 'success',
+              message: '',
+              url: url
+            })
+          }
+        })
+
+        if (uploadResultUrls.length < fileList.length) {
+          const failCount = fileList.length - uploadResultUrls.length
+          for (let i = uploadResultUrls.length; i < fileList.length; i++) {
+            if (targetImgList[startIndex + i]) {
+              targetImgList.splice(startIndex + i, 1, {
+                ...fileList[i],
+                status: 'failed',
+                message: '上传失败'
+              })
+            }
+          }
+          uni.showToast({title: `成功上传${uploadResultUrls.length}张，失败${failCount}张`, icon: 'none'})
+        } else {
+          uni.showToast({title: `成功上传${fileList.length}张图片`, icon: 'success'})
+        }
+
+        this.$refs.workOrderFormRef.validateField('problemImgs')
+      } catch (err) {
+        console.error('图片上传失败：', err)
+        for (let i = 0; i < fileList.length; i++) {
+          if (targetImgList[startIndex + i]) {
+            targetImgList.splice(startIndex + i, 1, {
+              ...fileList[i],
+              status: 'failed',
+              message: '上传失败'
+            })
+          }
+        }
+        uni.showToast({title: '图片上传失败，请重试', icon: 'none'})
+        this.$refs.workOrderFormRef.validateField('problemImgs')
+      }
+    },
+
+    /**
+     * 选择工单位置
+     */
+    chooseWorkLocation() {
+      let that = this
+      uni.chooseLocation({
+        success: async (res) => {
+          that.workOrderForm.roadName = ''
+          that.workOrderForm.roadId = 0
+          that.roadNameList = []
+
+          that.workOrderForm.workLocation = res.name
+          that.workOrderForm.lat = res.latitude
+          that.workOrderForm.lon = res.longitude
+
+          that.$refs.workOrderFormRef.validateField('workLocation')
+          that.$refs.workOrderFormRef.validateField('roadName')
+
+          try {
+            uni.showLoading({title: '获取道路名称中...'})
+            const roadRes = await getRoadListByLatLng({
+              companyCode: 'sls',
+              latitude: res.latitude,
+              longitude: res.longitude
+            })
+            uni.hideLoading()
+
+            if (Array.isArray(roadRes)) {
+              that.roadNameList = roadRes.map((item) => ({
+                name: item.roadName || '',
+                code: item.roadCode || '',
+                id: item.roadId || 0
+              }))
+            } else {
+              that.roadNameList = [{name: '未查询到道路名称', code: '', id: 0}]
+              uni.showToast({title: '未查询到该位置的道路信息', icon: 'none'})
+            }
+          } catch (err) {
+            uni.hideLoading()
+            console.error('获取道路名称失败：', err)
+            uni.showToast({title: '获取道路名称失败，请重试', icon: 'none'})
+            that.roadNameList = [{name: '获取失败，请重新选择位置', code: '', id: 0}]
+          }
+        },
+        fail: (err) => {
+          console.error('选择位置失败：', err)
+          uni.showToast({title: '选择位置失败：' + err.errMsg, icon: 'none'})
+        }
+      })
+    },
+
+    /**
+     * 选择道路名称
+     */
+    handleRoadNameSelect(e) {
+      console.log('选择道路名称：', e)
+      this.workOrderForm.roadName = e.name
+      this.workOrderForm.roadId = e.code
+      this.showRoadName = false
+      this.$refs.workOrderFormRef.validateField('roadName')
+    },
+
+    /**
+     * 选择工单名称
+     */
+    handleOrderNameSelect(e) {
+      console.log('选择工单名称：', e)
+      this.workOrderForm.orderName = e.name
+      this.showOrderName = false
+      this.$refs.workOrderFormRef.validateField('orderName')
+    },
+
+    /**
+     * 选择紧急程度
+     */
+    handlePressingTypeSelect(e) {
+      console.log('选择紧急程度：', e)
+      this.workOrderForm.pressingType = Number(e.value)
+      this.workOrderForm.pressingTypeName = e.name
+      this.showPressingType = false
+      this.$refs.workOrderFormRef.validateField('pressingType')
+    },
+
+    /**
+     * 完成时间确认
+     */
+    finishTimeConfirm(e) {
+      console.log('选择的完成时间：', e)
+      this.workOrderForm.finishTime =  timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
+      this.show = false;
+    },
+
+
+    /**
+     * 隐藏键盘
+     */
+    hideKeyboard() {
+      uni.hideKeyboard()
+    },
+
+    /**
+     * 提取图片URL数组
+     */
+    getImgUrlList(imgList) {
+      return imgList.filter(item => item.status === 'success').map(item => item.url)
+    },
+
+    /**
+     * 提交工单
+     */
+    async submitWorkOrder() {
+      try {
+        // 先执行表单校验
+        await this.$refs.workOrderFormRef.validate()
+
+        const submitData = {
+          roadId: this.workOrderForm.roadId,
+          roadName: this.workOrderForm.roadName,
+          imgs: this.getImgUrlList(this.problemImgsList),
+          remark: this.workOrderForm.problemDesc,
+          latLonType: 2,
+          lat: this.workOrderForm.lat,
+          lon: this.workOrderForm.lon,
+          lonLatAddress: this.workOrderForm.workLocation,
+          pressingType: this.workOrderForm.pressingType,
+          orderName: this.workOrderForm.orderName,
+          birthday: this.workOrderForm.birthday, // 新增：生日字段提交
+          finishTime: this.workOrderForm.finishTime, // 新增：完成时间提交
+          sourceId: 1,
+          sourceName: '园林',
+          thirdWorkNo: '',
+          busiLine:'yl'
+        }
+
+        // 显示加载中
+        uni.showLoading({title: '提交中...'})
+
+        // 调用提交接口
+        const res = await createQuick(submitData)
+
+        uni.hideLoading()
+        uni.showToast({
+          title: '工单提交成功',
+          icon: 'success',
+          duration: 1000
+        })
+
+        // 延迟跳转
+        setTimeout(() => {
+          uni.redirectTo({
+            url: '/pages-sub/daily/quick-order/index'
+          })
+        }, 1000)
+      } catch (error) {
+        // 隐藏加载框
+        uni.hideLoading()
+
+        // 区分是表单校验失败还是接口调用失败
+        if (Array.isArray(error)) {
+          // 表单校验失败（无需额外提示，uView会自动提示）
+        } else {
+          // 接口调用失败
+          console.error('工单提交失败：', error)
+          uni.showToast({
+            title: '提交失败，请重试',
+            icon: 'none',
+            duration: 2000
+          })
+        }
+      }
     }
   }
-
-  .mt-20 {
-    margin-top: 20rpx;
-  }
-}
-
-// 公共flex样式
-.u-flex {
-  display: flex;
-  align-items: center;
 }
+</script>
 
-.common-justify-between {
-  justify-content: space-between;
+<style lang="scss" scoped>
+// 全局页面样式
+.u-page {
+  min-height: 100vh;
 }
 
-.common-item-center {
-  align-items: center;
+// 工单表单内容容器
+.work-order-form-content {
+  background: #fff;
 }
 
-// 底部按钮
+// 底部按钮样式
 .fixed-bottom-btn-wrap {
-  position: fixed;
-  bottom: 0;
-  left: 0;
-  right: 0;
   padding: 20rpx;
-  background-color: #fff;
-  box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05);
-
-  :deep(.u-button) {
-    width: 100%;
-    height: 88rpx;
-    font-size: 32rpx;
-  }
-}
-
-// 回退弹窗样式
-.reject-popup {
-  width: 680rpx;
-  padding: 30rpx;
-  background-color: #fff;
-  border-radius: 12rpx;
-
-  .popup-title {
-    font-size: 32rpx;
-    font-weight: 600;
-    color: #333;
-  }
-
-  .upload-title {
-    font-size: 28rpx;
-    color: #666;
-    margin-bottom: 10rpx;
-  }
-
-  .popup-btn-wrap {
-    display: flex;
-    justify-content: flex-end;
-  }
+  background: #fff;
 }
 </style>
\ No newline at end of file
--
libgit2 0.21.4