pages.json

wuye-manager-uniapp/components/tabs/tabs.vue

@@ -1,43 +1,81 @@
 <template>
   <view class="tabs_box">
     <view
-      v-for="(item, index) in tabslist"
+      v-for="(item, index) in tabs"
       :key="index"
       @tap="handleTabs(item)"
       class="tabs_items"
       :class="{
-        active: item.value === activeValue
+        active: item.value === currentActiveValue,
+        line: showBottomLine
       }"
     >
-      {{ item[props.options.label] }}
+      {{ item.label }}
     </view>
   </view>
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
+import { ref, computed } from 'vue'
 
-type tabslistType = { name: string; value: number }
+// 标签项类型
-const props = defineProps<{
+interface TabItem {
-  tabslist: tabslistType[]
+  label: string
-  options: {
+  value: string | number
-    label: 'name'
-    value: 'value'
 }
-}>()
+
+// Props 类型定义
+interface Props {
+  tabslist?: any[]
+  showBottomLine?: boolean
+  // 配置：传入字段名
+  options?: {
+    label: string
+    value: string
+  }
+  activeValue?: string | number
+}
+
+// 定义 Props
+const props = withDefaults(defineProps<Props>(), {
+  tabslist: () => [],
+  showBottomLine: true,
+  options: () => ({ label: 'name', value: 'value' }),
+  activeValue: null
+})
+
+// ======================
+// 格式化 tabs 数据（核心）
+// ======================
+const tabs = computed<TabItem[]>(() => {
+  const { tabslist, options } = props
+  if (!tabslist || tabslist.length === 0) return []
+
+  return tabslist.map(item => ({
+    label: item[options.label],
+    value: item[options.value]
+  }))
+})
+
+// ======================
+// 当前激活值（响应式）
+// ======================
+const currentActiveValue = ref<string | number>(props.activeValue ?? tabs.value[0]?.value ?? '')
+
+console.log(currentActiveValue)
+// 事件
 const emit = defineEmits<{
-  update: [value: number]
+  update: [value: string | number]
 }>()
 
-const activeValue = ref(props.tabslist[0].value)
+// 点击切换
-const handleTabs = (row: tabslistType) => {
+const handleTabs = (item: TabItem) => {
-  activeValue.value = row[props.options.value]
+  currentActiveValue.value = item.value
-  emit('update', row[props.options.value])
+  emit('update', item.value)
 }
 </script>
 
 <style lang="scss" scoped>
-// tabs
 .tabs_box {
   height: 60rpx;
   line-height: 60rpx;
@@ -48,25 +86,26 @@ const handleTabs = (row: tabslistType) => {
   overflow-x: auto;
 
   .tabs_items {
-    /* 关键：不压缩宽度 */
     flex-shrink: 0;
     margin-right: 60rpx;
-    color: #4d5dfa;
+    font-size: 28rpx;
-
+    color: #222222;
     &.active {
+      color: #4d5dfa;
       position: relative;
+    }
 
+    &.line {
       &::after {
         content: '';
         display: block;
         width: 100%;
         height: 8rpx;
-        background-color: #6371fa;
         background: linear-gradient(180deg, #4d5dfa 0%, #bac0fa 100%);
         border-radius: 4rpx;
         position: absolute;
         left: 0;
-        bottom: 0rpx;
+        bottom: 0;
       }
     }
   }

wuye-manager-uniapp/pageSubPack/complaint/Details.vue

@@ -0,0 +1,186 @@
+<template>
+  <view class="page_padding">
+    <view class="detailsbox flex flex-col overflow-hidden">
+      <!-- 状态筛选标签 -->
+      <TabsComponents
+        :showBottomLine="false"
+        :tabslist="statusTabs"
+        @update="switchStatus"
+      ></TabsComponents>
+
+      <view class="detail_list flex flex-1 overflow-auto">
+        <scroll-view scroll-y="true">
+          <view class="item" v-for="(item, index) in list" :key="index">
+            <view class="title flex items-center">
+              <text>{{ item.title }}</text>
+              <view class="status padding" v-if="item.status === 0"> <text>待处理</text> </view>
+              <view class="status compluted" v-else>
+                <text>已完成</text>
+              </view>
+            </view>
+            <view class="descrtion">
+              <text>{{ item.desction }}</text>
+            </view>
+            <view class="detailsMan">
+              <text>投诉人：</text>
+              <text>{{ item.user }}</text>
+            </view>
+            <view class="detailsMan">
+              <text>手机号：</text>
+              <text>{{ item.phone }}</text>
+            </view>
+            <view class="detailsMan flex justify-between">
+              <view class="">
+                <text>投诉时间：</text>
+                <text>{{ item.time }}</text>
+              </view>
+              <view class="actions" v-if="item.status === 0">
+                <text>处理</text>
+              </view>
+            </view>
+          </view>
+        </scroll-view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import TabsComponents from '@/components/tabs/tabs.vue'
+const activeStatus = ref(0)
+const statusTabs = [
+  {
+    name: '全部',
+    value: 0
+  },
+  {
+    name: '待处理',
+    value: 1
+  },
+  {
+    name: '已完成',
+    value: 2
+  }
+]
+// 切换状态（全部/待分配/待解决/已完成）筛选
+const switchStatus = value => {
+  activeStatus.value = value
+}
+//
+const list = [
+  {
+    title: '小区环境',
+    status: 0, // 0 待处理 1 已完成
+    desction: '1栋楼下道路路灯不亮，并且有的亮度不够，请物业公司及时更换，防止发生意外事故。',
+    user: '胡小小',
+    phone: '19113212388',
+    time: '2023-08-01 10:05:46'
+  },
+  {
+    title: '小区环境',
+    status: 1, // 0 待处理 1 已完成
+    desction: '1栋楼下道路路灯不亮，并且有的亮度不够，请物业公司及时更换，防止发生意外事故。',
+    user: '胡小小',
+    phone: '19113212388',
+    time: '2023-08-01 10:05:46'
+  },
+  {
+    title: '小区环境',
+    status: 1, // 0 待处理 1 已完成
+    desction: '1栋楼下道路路灯不亮，并且有的亮度不够，请物业公司及时更换，防止发生意外事故。',
+    user: '胡小小',
+    phone: '19113212388',
+    time: '2023-08-01 10:05:46'
+  },
+  {
+    title: '小区环境',
+    status: 0, // 0 待处理 1 已完成
+    desction: '1栋楼下道路路灯不亮，并且有的亮度不够，请物业公司及时更换，防止发生意外事故。',
+    user: '胡小小',
+    phone: '19113212388',
+    time: '2023-08-01 10:05:46'
+  },
+  {
+    title: '小区环境',
+    status: 1, // 0 待处理 1 已完成
+    desction: '1栋楼下道路路灯不亮，并且有的亮度不够，请物业公司及时更换，防止发生意外事故。',
+    user: '胡小小',
+    phone: '19113212388',
+    time: '2023-08-01 10:05:46'
+  }
+]
+</script>
+
+<style scoped lang="scss">
+.page_padding {
+  background: #f9f9f9;
+}
+.detailsbox {
+  flex: 1;
+  background: #f9f9f9;
+  padding: 20rpx 40rpx;
+  .detail_list {
+    .item {
+      height: 390rpx;
+      background: #ffffff;
+      border-radius: 16rpx;
+      margin-bottom: 20rpx;
+      box-sizing: border-box;
+      padding: 30rpx 36rpx 55rpx 54rpx;
+      .title {
+        font-weight: 400;
+        font-size: 32rpx;
+        color: #222222;
+        line-height: 40rpx;
+        margin-bottom: 10rpx;
+
+        .status {
+          width: 82rpx;
+          height: 30rpx;
+          border-radius: 198rpx 198rpx 198rpx 198rpx;
+          font-weight: 400;
+          font-size: 20rpx;
+          color: #ffffff;
+          line-height: 30rpx;
+          text-align: center;
+          margin-left: 20rpx;
+          &.padding {
+            background: #e34d59;
+          }
+          &.compluted {
+            background: #4d5dfa;
+          }
+        }
+      }
+      .descrtion {
+        font-weight: 450;
+        font-size: 28rpx;
+        color: #666666;
+        line-height: 40rpx;
+        margin-bottom: 20rpx;
+        letter-spacing: 0rpx;
+      }
+      .detailsMan {
+        font-weight: 400;
+        font-size: 28rpx;
+        color: #999999;
+        line-height: 40rpx;
+        margin-bottom: 20rpx;
+
+        .actions {
+          width: 127rpx;
+          height: 44rpx;
+          background: #4d5dfa;
+          border-radius: 198rpx 198rpx 198rpx 198rpx;
+          text-align: center;
+          font-weight: 400;
+          font-size: 28rpx;
+          color: #ffffff;
+          line-height: 44rpx;
+        }
+      }
+    }
+  }
+}
+</style>

wuye-manager-uniapp/pageSubPack/complaint/Details_handle.vue

@@ -0,0 +1,198 @@
+<template>
+  <view class="page_padding">
+    <view class="Details_handelbox h-full flex-1">
+      <view class="items top flex items-center justify-between">
+        <view class="title flex items-center">
+          <view class="line"></view>
+          <text>投诉状态</text>
+        </view>
+        <view class="status" v-if="info.status === 0"> <text>待处理</text> </view>
+        <view class="status alwary" v-if="info.status === 1">
+          <text>已完成</text>
+        </view>
+      </view>
+      <view class="subDescrition" v-if="info.status === 1">
+        <text>已完成处理，已联系工作人员粘贴标语提醒，并派人定时巡视。</text>
+      </view>
+      <view class="items flex items-center justify-between">
+        <view class="title flex items-center">
+          <view class="line"></view>
+          <text>投诉详情</text>
+        </view>
+      </view>
+      <view class="list">
+        <view class="item">
+          <view class="label"> 投诉类型 </view>
+          <view class="value flex items-center justify-between">
+            <view class=""> 社区服务 </view>
+            <uni-icons type="right" size="14" color="#000000"></uni-icons>
+          </view>
+        </view>
+        <view class="item">
+          <view class="label"> 问题描述 </view>
+          <view class="value">
+            <text
+              >投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容
+            </text>
+          </view>
+        </view>
+        <view class="item">
+          <view class="label"> 投诉人姓名 </view>
+          <view class="value">
+            <text>匿名 </text>
+          </view>
+        </view>
+        <view class="item">
+          <view class="label"> 手机号码 </view>
+          <view class="value">
+            <text>无 </text>
+          </view>
+        </view>
+        <view class="photobox">
+          <view class="lable">
+            <text>问题照片</text>
+          </view>
+          <view class="imgbox">
+            <image
+              v-for="(item, index) in info.imgs"
+              :key="index"
+              :src="item"
+              class="img"
+              mode="scaleToFill"
+            ></image>
+          </view>
+        </view>
+      </view>
+
+      <!-- submit -->
+      <view v-if="info.status === 0" class="action_btn" @tap="handleSelecthouse">
+        <text>确定派单</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+const info = ref({
+  status: 1, //0待解决 1已完成
+  imgs: [
+    'https://picsum.photos/61',
+    'https://picsum.photos/61',
+    'https://picsum.photos/61',
+    'https://picsum.photos/61',
+    'https://picsum.photos/61'
+  ]
+})
+</script>
+
+<style scoped lang="scss">
+.Details_handelbox {
+  padding: 30rpx 40rpx;
+  padding-bottom: 0;
+  position: relative;
+  .items {
+    height: 100rpx;
+    &.top {
+      border-bottom: 1rpx solid #ccc;
+    }
+    .title {
+      font-weight: 550;
+      font-size: 32rpx;
+      color: #333333;
+      line-height: 40rpx;
+      .line {
+        width: 6rpx;
+        height: 28rpx;
+        background: #4d5dfa;
+        margin-right: 10rpx;
+      }
+    }
+
+    .status {
+      font-weight: 400;
+      font-size: 28rpx;
+      color: #4d5dfa;
+      line-height: 36rpx;
+      &.alwary {
+        color: #999999;
+      }
+    }
+  }
+
+  .subDescrition {
+    margin: 30rpx 0;
+    font-weight: 500;
+    font-size: 28rpx;
+    letter-spacing: 1rpx;
+    color: #4d5dfa;
+    line-height: 36rpx;
+  }
+
+  .list {
+    .item {
+      border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
+      display: flex;
+      align-items: center;
+      padding: 20rpx;
+      box-sizing: border-box;
+      min-height: 100rpx;
+      .label {
+        width: 226rpx;
+        font-weight: 400;
+        font-size: 28rpx;
+        color: #333333;
+        line-height: 36rpx;
+      }
+      .value {
+        font-weight: 400;
+        font-size: 28rpx;
+        color: #000000;
+        line-height: 36rpx;
+        flex: 1;
+      }
+    }
+
+    .photobox {
+      margin-top: 30rpx;
+      font-weight: 400;
+      font-size: 28rpx;
+      color: #333333;
+      line-height: 36rpx;
+      padding: 0 20rpx;
+
+      .lable {
+        margin-bottom: 30rpx;
+      }
+      .imgbox {
+        display: grid;
+        grid-template-columns: repeat(4, 1fr);
+        gap: 20rpx;
+        .img {
+          width: 132rpx;
+          height: 132rpx;
+        }
+      }
+    }
+  }
+
+  // 确定派单
+  .action_btn {
+    width: 670rpx;
+    height: 80rpx;
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #ffffff;
+    line-height: 80rpx;
+    text-align: center;
+    margin-top: 20rpx;
+    background: #4d5dfa;
+    border-radius: 8rpx 8rpx 8rpx 8rpx;
+
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+</style>

wuye-manager-uniapp/pageSubPack/complaint/handle.vue

@@ -0,0 +1,94 @@
+<template>
+  <view class="page_padding">
+    <view class="handlebox flex-1">
+      <view class="items checkout flex items-center" @tap="handleClick">
+        <view class="label">处理人员</view>
+        <view class="value"> {{ checkoutinfo.username ? checkoutinfo.username : '请选择' }} </view>
+      </view>
+      <view class="items">
+        <view class="label">处理描述</view>
+        <view class="areabox">
+          <textarea value="" placeholder="请输入" placeholder-style="font-size:28rpx;" />
+        </view>
+      </view>
+      <view class="action_btn" @tap="handleSelecthouse">
+        <text>确 认</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+const checkoutinfo = ref({
+  username: '',
+  userid: ''
+})
+function handleClick() {
+  uni.navigateTo({
+    url: '/pageSubPack/complaint/handleUser',
+    events: {
+      backData: data => {
+        checkoutinfo.value.username = data.username
+        checkoutinfo.value.userid = data.userid
+      }
+    }
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+.handlebox {
+  padding: 30rpx 40rpx;
+  position: relative;
+
+  .items {
+    margin-bottom: 30rpx;
+    &.checkout {
+      height: 100rpx;
+      line-height: 100rpx;
+      border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
+    }
+    .label {
+      width: 128rpx;
+      height: 40rpx;
+      font-weight: 550;
+      font-size: 32rpx;
+      color: #333333;
+      line-height: 40rpx;
+      margin-right: 86rpx;
+    }
+    .value {
+      height: 36rpx;
+      font-weight: 400;
+      font-size: 28rpx;
+      color: #666666;
+      line-height: 36rpx;
+      text-align: left;
+    }
+    .areabox {
+      margin-top: 20rpx;
+      border-radius: 8rpx;
+      border: 2rpx solid #e7e7e7;
+      padding: 10rpx;
+      box-sizing: border-box;
+    }
+  }
+  .action_btn {
+    width: 670rpx;
+    height: 80rpx;
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #ffffff;
+    line-height: 80rpx;
+    text-align: center;
+    background: #4d5dfa;
+    border-radius: 8rpx 8rpx 8rpx 8rpx;
+
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+</style>

wuye-manager-uniapp/pageSubPack/complaint/handleUser.vue

@@ -0,0 +1,231 @@
+<template>
+  <view class="page_padding shareUser">
+    <view class="shareBody flex flex-col flex-1 overflow-hidden">
+      <!-- 搜索 -->
+      <view class="search_box">
+        <view
+          @click="handleClick"
+          class="search_view flex-center"
+          v-if="!queryParmas.value.trim() && Searching"
+        >
+          <uni-icons type="search" size="34rpx" color="rgba(0,0,0,0.26)"></uni-icons>
+          <text>请输入关键字进行搜索</text>
+        </view>
+        <uni-easyinput
+          @blur="handleInput"
+          @change="handleSearch"
+          :focus="true"
+          ref="inputRef"
+          v-model="queryParmas.value"
+          v-else
+        />
+      </view>
+      <!-- srcoll -->
+      <scroll-view scroll-y="true" class="flex-1 overflow-auto">
+        <radio-group @change="radioChange">
+          <label v-for="(item, index) in searchlist" :key="index">
+            <view
+              class="item flex items-center justify-between"
+              :class="{
+                active: checkoutUserid === item.id
+              }"
+            >
+              <view class="">
+                <view class="info">
+                  <text>姓名：</text>
+                  <text>{{ item.name }}</text>
+                </view>
+                <view class="info">
+                  <text>角色：</text>
+                  <text>{{ item.roleName }}</text>
+                </view>
+                <view class="info">
+                  <text>手机号码：</text>
+                  <text>{{ item.phone }}</text>
+                </view>
+              </view>
+              <radio color="#4d5dfa" :value="item.id" />
+            </view>
+          </label>
+        </radio-group>
+      </scroll-view>
+
+      <!-- submit -->
+      <view class="action_btn" @tap="handleSelecthouse">
+        <text>确定派单</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref, onMounted, getCurrentInstance } from 'vue'
+import navBar from '@/components/navbar/navbar.vue'
+const Searching = ref(true)
+const queryParmas = ref({
+  value: ''
+})
+/** 点击时切换到input,并聚焦 */
+function handleClick() {
+  Searching.value = false
+}
+/** 判断 失去焦点时 切换回 view */
+function handleInput() {
+  if (queryParmas.value.value.trim()) {
+    Searching.value = true
+  }
+}
+function handleSearch() {
+  console.log('search')
+}
+//  -----------------------------------------
+/* 选择列表 */
+const searchlist = ref([
+  {
+    name: '张三',
+    roleName: '维修人员',
+    phone: '19578012123',
+    id: 1
+  },
+  {
+    name: '张三',
+    roleName: '维修人员',
+    phone: '19578012123',
+    id: 2
+  },
+  {
+    name: '张三',
+    roleName: '维修人员',
+    phone: '19578012123',
+    id: 3
+  },
+  {
+    name: '张三',
+    roleName: '维修人员',
+    phone: '19578012123',
+    id: 4
+  },
+  {
+    name: '张三',
+    roleName: '维修人员',
+    phone: '19578012123',
+    id: 5
+  },
+  {
+    name: '张三',
+    roleName: '维修人员',
+    phone: '19578012123',
+    id: 6
+  },
+  {
+    name: '张三',
+    roleName: '维修人员',
+    phone: '19578012123',
+    id: 7
+  },
+  {
+    name: '张三',
+    roleName: '维修人员',
+    phone: '19578012123',
+    id: 8
+  }
+])
+const checkoutUserid = ref(null)
+function radioChange(val) {
+  checkoutUserid.value = Number(val.detail.value)
+}
+
+let eventChannel = null
+// 必须在 onMounted 里获取
+onMounted(() => {
+  const instance = getCurrentInstance().proxy
+  if (instance && instance.getOpenerEventChannel) {
+    eventChannel = instance.getOpenerEventChannel()
+  }
+})
+
+function handleSelecthouse() {
+  eventChannel.emit('backData', {
+    userid: checkoutUserid.value,
+    username: '张三'
+  })
+  // 3. 返回上一页
+  uni.navigateBack()
+}
+</script>
+
+<style scoped lang="scss">
+.shareUser {
+  background-color: #f9f9f9;
+
+  .shareBody {
+    padding: 0 40rpx;
+
+    .search_box {
+      height: 80rpx;
+      margin-bottom: 20rpx;
+      .search_view {
+        height: 80rpx;
+        line-height: 80rpx;
+        background: #f3f3f3;
+        border-radius: 8rpx;
+
+        font-weight: 400;
+        font-size: 32rpx;
+        color: rgba(0, 0, 0, 0.26);
+        line-height: 48rpx;
+        text-align: center;
+      }
+    }
+
+    // 选择人数
+    .checkoutedUser_box {
+      margin-top: 20rpx;
+      margin-bottom: 40rpx;
+      font-weight: 400;
+      font-size: 28rpx;
+      color: #333333;
+      line-height: 36rpx;
+      height: 36rpx;
+    }
+    // 角色列表
+    .item {
+      height: 170rpx;
+      background: #ffffff;
+      border: 1rpx solid transparent;
+      margin-bottom: 20rpx;
+      padding-left: 26rpx;
+      padding-right: 32rpx;
+      .info {
+        font-weight: 400;
+        font-size: 28rpx;
+        color: #333333;
+        line-height: 36rpx;
+        height: 36rpx;
+        margin-bottom: 10rpx;
+      }
+      &:deep(radio) {
+        transform: scale(0.68);
+      }
+      &.active {
+        background: #f5faff;
+        border: 1rpx solid #4d5dfa;
+      }
+    }
+
+    // 确定派单
+    .action_btn {
+      width: 670rpx;
+      height: 80rpx;
+      font-weight: 400;
+      font-size: 28rpx;
+      color: #ffffff;
+      line-height: 80rpx;
+      text-align: center;
+      margin-top: 20rpx;
+      background: #4d5dfa;
+      border-radius: 8rpx 8rpx 8rpx 8rpx;
+    }
+  }
+}
+</style>

wuye-manager-uniapp/pageSubPack/ticket/myticket.vue

@@ -0,0 +1,440 @@
+<template>
+  <view class="report-record-page page_padding">
+    <!-- 顶部导航栏 -->
+    <NavBar title="我的工单"></NavBar>
+    <view class="hall_body flex-1 flex flex-col">
+      <!-- 状态筛选标签 -->
+      <TabsComponents
+        :tabslist="statusTabs"
+        :options="{ label: 'label', value: 'value' }"
+        @update="switchStatus"
+      ></TabsComponents>
+
+      <!-- 类型筛选标签 -->
+      <view class="type-tabs">
+        <view
+          v-for="item in typeTabs"
+          :key="item.value"
+          class="type-tab-item"
+          :class="{ active: activeType === item.value }"
+          @tap="switchType(item.value)"
+        >
+          {{ item.label }}
+        </view>
+      </view>
+
+      <!-- 上报记录列表 -->
+      <scroll-view
+        class="record-list flex-1"
+        scroll-y
+        :style="{ height: `calc(100vh - ${navHeight + statusTabHeight + typeTabHeight}px)` }"
+      >
+        <!-- 空状态 -->
+        <view v-if="filteredRecords.length === 0" class="empty-state">
+          <uni-icons type="empty" size="60" color="#ccc"></uni-icons>
+          <text class="empty-text">暂无上报记录</text>
+        </view>
+        <!-- 记录卡片 -->
+        <view v-for="record in filteredRecords" :key="record.id" class="record-card">
+          <!-- 标题 + 状态标签 -->
+          <view class="card-header">
+            <text class="card-title">{{ record.title }}</text>
+            <view class="status-tag" :class="record.status">
+              {{ getStatusText(record.status) }}
+            </view>
+          </view>
+
+          <!-- 类型标签 -->
+          <view class="tag-group">
+            <view class="tag-item">{{ record.reportType }}</view>
+            <view class="tag-item">{{ record.category }}</view>
+          </view>
+
+          <!-- 内容 -->
+          <view class="card-content">
+            {{ record.content }}
+          </view>
+          <!-- 工单图片 -->
+          <view class="card-image">
+            <image
+              v-for="(item, index) in record.images"
+              :key="index"
+              :src="item"
+              class="images"
+              mode="scaleToFill"
+              @tap="handlePrivew(record.images)"
+            ></image>
+          </view>
+
+          <!-- 底部信息 -->
+          <view class="card-footer">
+            <text class="create-time">{{ record.createTime }}</text>
+            <text v-if="record.repairStatus === 1" class="repairman"
+              >维修师傅：{{ record.repairman }}</text
+            >
+            <view class="share" v-if="record.repairStatus === 0">
+              <text>维修完成</text>
+            </view>
+          </view>
+        </view>
+      </scroll-view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref, computed } from 'vue'
+import { onReady } from '@dcloudio/uni-app'
+import TabsComponents from '@/components/tabs/tabs.vue'
+import NavBar from '@/components/navbar/navbar.vue'
+
+// 导航栏/标签高度（适配不同设备）
+const navHeight = ref(44)
+const statusTabHeight = ref(88)
+const typeTabHeight = ref(88)
+
+// 筛选状态
+const activeStatus = ref('all') // 全部/待分配/待解决/已完成
+const activeType = ref('all') // 全部/公共报修/个人报修
+
+// 状态筛选选项
+const statusTabs = ref([
+  { label: '全部', value: 'all' },
+  { label: '待解决', value: 'processing' },
+  { label: '已完成', value: 'completed' }
+])
+
+// 类型筛选选项
+const typeTabs = ref([
+  { label: '全部', value: 'all' },
+  { label: '公共报修', value: 'public' },
+  { label: '个人报修', value: 'private' }
+])
+
+// 模拟上报记录数据（实际项目替换为接口请求）
+const reportRecords = ref([
+  {
+    id: 1,
+    title: '标题巴拉巴拉巴拉',
+    status: 'processing', // pending/processing/completed
+    reportType: '公共报修',
+    category: '路灯',
+    content: '1栋楼下道路路灯不亮，并且有的亮度不够，请物业公司及时更换，防止发生意外事故。',
+    createTime: '2026-08-01 10:05:46',
+    repairman: '',
+    images: [
+      'https://picsum.photos/93',
+      'https://picsum.photos/93',
+      'https://picsum.photos/93',
+      'https://picsum.photos/93',
+      'https://picsum.photos/93'
+    ],
+    repairStatus: 0 // 0 待分配，1待解决 2已完成
+  },
+  {
+    id: 2,
+    title: '标题巴拉巴拉巴拉',
+    status: 'processing',
+    reportType: '公共报修',
+    category: '路灯',
+    content: '1栋楼下道路路灯不亮，并且有的亮度不够，请物业公司及时更换，防止发生意外事故。',
+    createTime: '2026-08-01 10:05:46',
+    repairman: '张三',
+    images: ['https://picsum.photos/93', 'https://picsum.photos/93', 'https://picsum.photos/93'],
+    repairStatus: 1 // 0 待分配，1待解决 2已完成
+  },
+  {
+    id: 3,
+    title: '标题巴拉巴拉巴拉',
+    status: 'completed',
+    reportType: '公共报修',
+    category: '路灯',
+    content: '1栋楼下道路路灯不亮，并且有的亮度不够，请物业公司及时更换，防止发生意外事故。',
+    createTime: '2026-08-01 10:05:46',
+    images: ['https://picsum.photos/93', 'https://picsum.photos/93', 'https://picsum.photos/93'],
+    repairman: '张三',
+    repairStatus: 2 // 0 待分配，1待解决 2已完成
+  }
+])
+
+// 筛选后的记录
+const filteredRecords = computed(() => {
+  return reportRecords.value.filter(record => {
+    // 状态筛选
+    const statusMatch = activeStatus.value === 'all' || record.status === activeStatus.value
+    // 类型筛选
+    const typeMatch =
+      activeType.value === 'all' ||
+      record.reportType === typeTabs.value.find(item => item.value === activeType.value)?.label
+    return statusMatch && typeMatch
+  })
+})
+
+// 切换状态（全部/待分配/待解决/已完成）筛选
+const switchStatus = value => {
+  activeStatus.value = value
+}
+
+// 切换类型（公共/个人）筛选
+const switchType = value => {
+  activeType.value = value
+}
+
+// 获取状态文本
+const getStatusText = status => {
+  const statusMap = {
+    processing: '待解决',
+    completed: '已完成'
+  }
+  return statusMap[status] || ''
+}
+
+// 页面渲染完成后适配高度
+onReady(() => {
+  // 可根据实际设备调整高度
+  uni.getSystemInfo({
+    success: res => {
+      if (res.platform === 'ios') {
+        navHeight.value = 44
+      } else {
+        navHeight.value = 48
+      }
+    }
+  })
+})
+
+/* 预览图片 */
+function handlePrivew(imgs) {
+  // if (imgs.length > 0) {
+  //   uni.previewImage({
+  //     urls: imgs,
+  //     success(e) {
+  //       console.log(JSON.stringify(e))
+  //     }
+  //   })
+  // }
+}
+</script>
+
+<style scoped>
+.report-record-page {
+  width: 100%;
+  min-height: 100vh;
+  max-height: 100vh;
+  overflow: hidden;
+  box-sizing: border-box;
+  background: linear-gradient(225deg, #e2f0ff 0%, #f9f9f9 50.71%);
+}
+
+.hall_body {
+  padding: 0 40rpx;
+  overflow: hidden;
+}
+/* 状态筛选标签 */
+.status-tabs {
+  display: flex;
+  /* background-color: #fff; */
+  padding: 0 40rpx;
+  height: 88rpx;
+  align-items: center;
+}
+
+.status-tab-item {
+  /* flex: 1; */
+  display: flex;
+  justify-content: flex-start;
+  margin-right: 60rpx;
+  text-align: left;
+  font-size: 32rpx;
+  color: #666;
+  height: 100%;
+  line-height: 88rpx;
+  position: relative;
+}
+
+.status-tab-item.active {
+  color: #4d5dfa;
+  font-weight: 500;
+}
+
+.status-tab-item.active::after {
+  content: '';
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 80rpx;
+  height: 8rpx;
+  background: linear-gradient(to bottom, #4d5dfa, #bac0fa);
+  border-radius: 6rpx;
+}
+
+/* 类型筛选标签 */
+.type-tabs {
+  display: flex;
+  height: 48rpx;
+  /* background-color: #fff; */
+  margin: 20rpx 0;
+  justify-content: flex-start;
+  gap: 20rpx;
+}
+
+.type-tab-item {
+  width: 142rpx;
+  height: 48rpx;
+  border-radius: 24rpx;
+  border: 2rpx solid #999999;
+
+  font-weight: 400;
+  font-size: 28rpx;
+  color: #999999;
+  line-height: 48rpx;
+  text-align: center;
+}
+
+.type-tab-item.active {
+  color: #4d5dfa;
+  border: 2rpx solid #4d5dfa;
+  border-radius: 24rpx;
+}
+
+/* 记录列表 */
+.record-list {
+  box-sizing: border-box;
+  padding-bottom: 40rpx;
+}
+
+/* 空状态 */
+.empty-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 100rpx 0;
+  color: #ccc;
+}
+
+.empty-text {
+  font-size: 32rpx;
+  color: #999;
+  margin-top: 20rpx;
+}
+
+/* 记录卡片 */
+.record-card {
+  background-color: #fff;
+  border-radius: 16rpx;
+  padding: 34rpx 32rpx;
+  margin-bottom: 20rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+}
+
+.card-header {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  margin-bottom: 20rpx;
+}
+
+.card-title {
+  margin-right: 20rpx;
+  font-weight: 450;
+  font-size: 32rpx;
+  color: #222222;
+  line-height: 40rpx;
+}
+
+/* 状态标签 */
+.status-tag {
+  width: 82rpx;
+  height: 30rpx;
+  border-radius: 15rpx;
+
+  font-weight: 400;
+  font-size: 20rpx;
+  color: #ffffff;
+  line-height: 30rpx;
+  text-align: center;
+  line-height: 30rpx;
+}
+
+.status-tag.pending {
+  background-color: #e34d59; /* 待分配-红色 */
+}
+
+.status-tag.processing {
+  background-color: #09c2bd; /* 待解决-绿色 */
+}
+
+.status-tag.completed {
+  background-color: #4d5dfa; /* 已完成-蓝色 */
+}
+
+/* 类型标签组 */
+.tag-group {
+  display: flex;
+  gap: 20rpx;
+  margin-bottom: 20rpx;
+}
+
+.tag-item {
+  width: 112rpx;
+  height: 42rpx;
+  border-radius: 8rpx 8rpx 8rpx 8rpx;
+  border: 1rpx solid #999999;
+
+  font-weight: 400;
+  font-size: 24rpx;
+  color: #999999;
+  line-height: 42rpx;
+  text-align: center;
+}
+
+/* 内容 */
+.card-content {
+  margin-bottom: 20rpx;
+  font-weight: 450;
+  font-size: 28rpx;
+  color: #666666;
+  line-height: 40rpx;
+  letter-spacing: 2rpx;
+}
+/* 图片  */
+.card-image {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 20rpx;
+  min-width: 186rpx;
+  min-height: 104rpx;
+  margin-bottom: 20rpx;
+}
+.images {
+  width: 186rpx;
+  height: 104rpx;
+}
+
+/* 底部信息 */
+.card-footer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  font-size: 28rpx;
+  color: #999;
+}
+.share {
+  width: 127rpx;
+  height: 44rpx;
+  background: #4d5dfa;
+  border-radius: 22rpx;
+
+  font-weight: 400;
+  font-size: 24rpx;
+  color: #ffffff;
+  line-height: 44rpx;
+  text-align: center;
+}
+
+.repairman {
+  color: #999;
+}
+</style>

wuye-manager-uniapp/pageSubPack/ticket/repairCompleted.vue

@@ -0,0 +1,120 @@
+<template>
+  <view class="page_padding">
+    <view class="repairCompleted">
+      <view class="item">
+        <view class="title">
+          <text>问题描述</text>
+        </view>
+        <view class="descrition">
+          <textarea value="" placeholder-style="color:#e8e8e8;" placeholder="请描述您的问题" />
+        </view>
+      </view>
+      <view class="item">
+        <view class="title">
+          <text>问题照片</text>
+        </view>
+        <view class="">
+          <uni-file-picker v-model="form.images" file-mediatype="image">
+            <view class="addimages images flex flex-center">
+              <uni-icons type="plusempty" color="#a6a6a6" size="27"></uni-icons>
+            </view>
+          </uni-file-picker>
+        </view>
+      </view>
+      <view class="action_btn" @tap="handleSelecthouse">
+        <text>确 认</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+const form = ref({
+  descrition: '',
+  images: [
+    {
+      name: 'file1.png',
+      extname: 'png',
+      url: 'https://picsum.photos/80'
+    },
+    {
+      name: 'file2.png',
+      extname: 'png',
+      url: 'https://picsum.photos/80'
+    },
+    {
+      name: 'file3.png',
+      extname: 'png',
+      url: 'https://picsum.photos/80'
+    },
+    {
+      name: 'file4.png',
+      extname: 'png',
+      url: 'https://picsum.photos/80'
+    }
+  ]
+})
+
+function handleSelecthouse() {
+  console.log('compltee')
+}
+</script>
+
+<style lang="scss" scoped>
+.repairCompleted {
+  padding: 20rpx 40rpx;
+  background-color: #ffffff;
+  position: relative;
+  flex: 1;
+
+  .item {
+    margin-bottom: 28rpx;
+    .title {
+      padding-left: 16rpx;
+      margin-bottom: 30rpx;
+
+      font-weight: 400;
+      font-size: 28rpx;
+      color: #333333;
+      line-height: 36rpx;
+    }
+    .descrition {
+      height: 200rpx;
+      border-radius: 8rpx 8rpx 8rpx 8rpx;
+      border: 2rpx solid #ececec;
+      padding: 22rpx 18rpx;
+    }
+    .imageboxs {
+      display: grid;
+      grid-template-columns: repeat(4, 1fr);
+      gap: 20rpx;
+      .images {
+        width: 160rpx;
+        height: 160rpx;
+        border-radius: 0rpx;
+      }
+    }
+    :deep(.file-picker__box-content.is-add) {
+      background-color: #f3f3f3 !important;
+    }
+  }
+
+  .action_btn {
+    width: 670rpx;
+    height: 80rpx;
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #ffffff;
+    line-height: 80rpx;
+    text-align: center;
+    background: #4d5dfa;
+    border-radius: 8rpx 8rpx 8rpx 8rpx;
+
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+</style>

wuye-manager-uniapp/pages.json

@@ -138,6 +138,36 @@
         }
       ]
     },
+    {
+      "root": "pageSubPack/complaint",
+      "pages": [{
+          "path": "Details",
+          "style": {
+            "navigationBarTitleText": "投诉详情",
+            "navigationBarBackgroundColor": "#f9f9f9"
+          }
+        },
+        {
+          "path": "handle",
+          "style": {
+            "navigationBarTitleText": "处理投诉",
+            "navigationBarBackgroundColor": "#f9f9f9"
+          }
+        },
+        {
+          "path": "handleUser",
+          "style": {
+            "navigationBarTitleText": "选择处理人员"
+          }
+        },
+        {
+          "path": "Details_handle",
+          "style": {
+            "navigationBarTitleText": "投诉详情处理"
+          }
+        }
+      ]
+    },
     {
       "root": "pageSubPack/ticket",
       "pages": [{
@@ -152,6 +182,20 @@
           "style": {
             "navigationBarTitleText": "分配派单"
           }
+        },
+        {
+          "path": "myticket",
+          "style": {
+            "navigationBarTitleText": "我的工单",
+            "navigationStyle": "custom"
+          }
+        },
+        {
+          "path": "repairCompleted",
+          "style": {
+            "navigationBarTitleText": "维修完成",
+            "navigationBarBackgroundColor": "#fff"
+          }
         }
       ]
     },
@@ -223,8 +267,8 @@
   },
   "condition": {
     "list": [{
-      "name": "选择房屋",
+      "name": "维修完成",
-      "path": "pageSubPack/instrument/checkouthouse"
+      "path": "pageSubPack/ticket/repairCompleted"
     }]
   },
   "tabBar": {

wuye-manager-uniapp/pages/index/index.vue

@@ -29,11 +29,17 @@
 
     <!-- banner -->
     <view class="bannarClass">
-      <uni-swiper-dot class="uni-swiper-dot-box" @clickItem="clickItem" :info="bannerList" :current="current" mode="round">
+      <uni-swiper-dot
+        class="uni-swiper-dot-box"
+        @clickItem="clickItem"
+        :info="bannerList"
+        :current="current"
+        mode="round"
+      >
         <swiper class="swiper-box" :current="current" autoplay>
           <swiper-item v-for="(item, index) in bannerList" :key="index">
             <view class="swiper-item">
-              <image :src="item.img" style="width: 100%;height: 100%;"></image>
+              <image :src="item.img" style="width: 100%; height: 100%"></image>
             </view>
           </swiper-item>
         </swiper>
@@ -50,8 +56,17 @@
         </view>
         <!-- 右侧滚动公告 -->
         <view class="notice-right" @click="getNoticeMore">
-          <uni-notice-bar :text="noticeText" type="line" :showIcon="false" show-get-more scrollable color="#fff"
+          <uni-notice-bar
-            background-color="transparent" moreColor="#fff" no-border>
+            :text="noticeText"
+            type="line"
+            :showIcon="false"
+            show-get-more
+            scrollable
+            color="#fff"
+            background-color="transparent"
+            moreColor="#fff"
+            no-border
+          >
           </uni-notice-bar>
         </view>
       </view>
@@ -85,11 +100,11 @@
           <image class="item-icon" src="/static/imgs/open.png" mode="aspectFit"></image>
           <text class="item-text">一键开门</text>
         </view>
-        <view class="function-item">
+        <view class="function-item" @tap="goToTicketHall">
           <image class="item-icon" src="/static/imgs/work-order.png" mode="aspectFit"></image>
           <text class="item-text">工单大厅</text>
         </view>
-        <view class="function-item">
+        <view class="function-item" @tap="goToMyTicket">
           <image class="item-icon" src="/static/imgs/my-work.png" mode="aspectFit"></image>
           <text class="item-text">我的工单</text>
         </view>
@@ -112,9 +127,7 @@ import { onLoad, onUnload } from '@dcloudio/uni-app'
 // 列表数据状态
 const current = ref(0)
 const currentCommunity = ref('碧桂园小区')
-const bannerList = ref([
+const bannerList = ref([{ img: '/static/imgs/banner1.png' }])
-  { img: '/static/imgs/banner1.png' },
-])
 const noticeText = ref('公告公告本小区今天安装了摄像头')
 
 // =======方法=======
@@ -136,6 +149,18 @@ const goToOneOpenDoor = () => {
     url: '/pageSubPack/oneClickOpen/oneClickOpen'
   })
 }
+// 工单大厅
+const goToTicketHall = () => {
+  uni.navigateTo({
+    url: '/pageSubPack/ticket/hall'
+  })
+}
+// 我的工单
+const goToMyTicket = () => {
+  uni.navigateTo({
+    url: '/pageSubPack/ticket/myticket'
+  })
+}
 // 跳转到 今日巡检
 const goToDaysInspection = () => {
   uni.navigateTo({
@@ -151,11 +176,11 @@ const goToInspectionRecord = () => {
 // 故障上报
 const goToReport = () => {
   uni.navigateTo({
-    url: "/pageSubPack/fault-reporting/fault-reporting"
+    url: '/pageSubPack/fault-reporting/fault-reporting'
   })
 }
 // 接收选择小区返回的参数
-const slelctHomeData = (data) => {
+const slelctHomeData = data => {
   currentCommunity.value = data.name
 }
 
@@ -167,7 +192,7 @@ onUnload(() => {
   uni.$off('confirm', slelctHomeData)
 })
 
-const clickItem = (index) => {
+const clickItem = index => {
   current.value = index
 }
 </script>