feat: 支援申请收尾

package.json

@@ -58,7 +58,7 @@
     "clipboard": "^2.0.11",
     "dayjs": "^1.11.11",
     "lodash": "^4.17.21",
-    "pina": "^0.20.2204228",
+    "pinia": "^2.0.36",
     "pinia-plugin-persistedstate": "^3.2.1",
     "uview-plus": "^3.2.22",
     "vue": "^3.4.21",

src/main.js

@@ -42,6 +42,9 @@ export function createApp() {
                 titleStyle: {
                     color: '#1D2129'
                 }
+            },
+            input: {
+                placeholderStyle: 'fontSize: 28rpx'
             }
         }
     })

src/mocp/api/base.js

@@ -9,15 +9,6 @@ export const getAircraftNumbersApi = (data, config) => {
         config
     })
 }
-//通过机号查询飞机相关数据
-export const getAcReduceListApi = (data, config) => {
-    return http({
-        method: 'POST',
-        url: '/system/Aircraft/getAcReduceList',
-        data,
-        config
-    })
-}
 //获取用户基本信息分页列表
 export const getAdminListApi = (data, config) => {
     return http({
@@ -80,3 +71,12 @@ export const getATAApi = (data, config) => {
         config
     })
 }
+//获取发动机列表
+export const getEngineListApi = (data, config) => {
+    return http({
+        method: 'POST',
+        url: '/resource/getEngineList',
+        data,
+        config
+    })
+}

src/mocp/api/support-application.js

+import { post } from 'mocp/utils/http'
+
+export const getSupportRequestListApi = (data, config) => {
+    return post({
+        method: 'POST',
+        url: '/workbench/getSupportRequestList',
+        data,
+        config
+    })
+}
+
+export const addUpdateSupportApi = (data, config) => {
+    return post({
+        method: 'POST',
+        url: '/workbench/addUpdateSupport',
+        data,
+        config
+    })
+}

src/mocp/api/system.js

+import { http } from 'mocp/utils/http'
+
+//通过机号查询飞机相关数据
+export const getAcReduceListApi = (data, config) => {
+    return http({
+        method: 'POST',
+        url: '/system/Aircraft/getAcReduceList',
+        data,
+        config
+    })
+}
+
+//通过机号和航站查询相关席位
+export const getSysSeatListApi = (data, config) => {
+    return http({
+        method: 'POST',
+        url: '/system/getSysSeatList',
+        data,
+        config
+    })
+}

src/mocp/components/global-picker/global-picker.vue

@@ -130,6 +130,13 @@ const ps = defineProps({
     confirmColor: {
         type: String,
         default: '#165dff'
+    },
+    //打开前判断
+    beforeOpen: {
+        type: Function,
+        default: () => {
+            return true
+        }
     }
 })
 //获取下拉框样式
@@ -164,9 +171,12 @@ const getPickerClass = computed(() => {
 })
 const show = ref(false)
 //打开
-const open = () => {
-    searchKey.value = ''
-    show.value = true
+const open = async () => {
+    const flag = await ps.beforeOpen()
+    if (flag) {
+        searchKey.value = ''
+        show.value = true
+    }
 }
 //设置下拉框打开的默认值
 const defaultIndex = ref(0)

src/mocp/hooks/use-dict/dict-data/index.js

@@ -4,3 +4,4 @@ export * from './move-decision'
 export * from './technology-evaluation'
 export * from './work-assignment'
 export * from './aog'
+export * from './support-application'

src/mocp/hooks/use-dict/dict-data/support-application.js

+// 建议以文件名首字母作为前缀sa_
+export const sa_state = [
+    { label: 'OPEN', value: '1' },
+    { label: 'CLOSE', value: '2' }
+]

src/mocp/store/base.js

@@ -5,6 +5,7 @@ import {
     getAircraftNumbersApi,
     getAircraftTerminalsApi,
     getBasicParamsListApi,
+    getEngineListApi,
     getFlightNumApi,
     getPlaneModelsRepairApi
 } from 'mocp/api/base'
@@ -20,7 +21,8 @@ const useBaseStore = defineStore('base', {
                 airlineCodeList: [], //航司下拉数据
                 flightNumList: [], //航班号下拉数据
                 typeList: [], //机型下拉数据
-                ATAList: [] //章节下拉数据
+                ATAList: [], //章节下拉数据
+                engineList: [] //发动机型号列表
             },
             allBasicParams: {} //系统基础参数
         }
@@ -57,7 +59,7 @@ const useBaseStore = defineStore('base', {
                 value: a
             }))
         },
-        //章节下拉数据
+        //格式化章节下拉数据
         getAllATASelect(state) {
             return state.selectList.ATAList.map((q) => ({
                 label: q.label + `(${q.zstortGc})`,
@@ -72,6 +74,15 @@ const useBaseStore = defineStore('base', {
                     value: q.label
                 }))
             )
+        },
+        //格式化发动机型号数据
+        getEngineSelect(state) {
+            return state.selectList.engineList.map((v) => {
+                return {
+                    label: v.zMETYPE,
+                    value: v.zMETYPE
+                }
+            })
         }
     },
     actions: {
@@ -88,7 +99,8 @@ const useBaseStore = defineStore('base', {
                     this.getAirLinesList(),
                     this.getFlightNum(),
                     this.getPlaneModelsRepair(),
-                    this.getATA()
+                    this.getATA(),
+                    this.getEngineList()
                 ])
             } finally {
                 uni.hideLoading()
@@ -174,6 +186,12 @@ const useBaseStore = defineStore('base', {
                     }
                 })
             })
+        },
+        async getEngineList() {
+            const res = await getEngineListApi({})
+            if (res.code == 200) {
+                this.selectList.engineList = res.data
+            }
         }
     },
     // 配置持久化

src/mocp/store/support-application.js

+import { defineStore } from 'pinia'
+
+const useSupportApplicationStore = defineStore('supportApplication', {
+    state: () => {
+        return {
+            searchData: {
+                state: '',
+                machineNumber: '',
+                model: '',
+                aviation: '',
+                terminal: '',
+                specialty: '',
+                engineModel: ''
+            },
+            details: undefined
+        }
+    },
+    getters: {},
+    actions: {
+        resetForm() {
+            this.searchData = {
+                state: '',
+                machineNumber: '',
+                model: '',
+                aviation: '',
+                terminal: '',
+                specialty: '',
+                engineModel: ''
+            }
+        },
+        setState(...args) {
+            this.$patch({ [args[0]]: args[1] })
+        }
+    },
+    // 配置持久化
+    persist: false
+})
+export default useSupportApplicationStore

src/mocp/store/user.js

@@ -3,7 +3,7 @@ import { ref } from 'vue'
 const menuList = ref([
     { id: 1, name: '信息通报', icon: 'xxtb', group: '技术支援', count: 12 },
     { id: 2, name: '机队状态', icon: 'jdzt', group: '技术支援', count: 0 },
-    { id: 3, name: '支援申请', icon: 'zysq', group: '技术支援', count: 0 },
+    { id: 3, name: '支援申请', icon: 'zysq', group: '技术支援', count: 0, url: '/panel/support-application/search' },
     { id: 4, name: '工作指令', icon: 'gzzl', group: '技术支援', count: 0, url: '/panel/work-assignment/search' },
     { id: 5, name: '技术评估', icon: 'jspg', group: '技术支援', count: 0, url: '/panel/technology-evaluation/list' },
     { id: 6, name: '运行调查', icon: 'yxdc', group: '维修控制', count: 0 },

src/mocp/utils/http.js

@@ -33,13 +33,19 @@ export const httpInterceptor = (options) => {
     //loading
     const loading = options.config?.loading
     serviceLoading.open(loading)
+    //application
+    const application = options.application || 'form'
     //重组提交数据
     if (options.data) {
-        options.data = {
-            ...options.data,
-            apiPwd: 'Ifar$2_0160_525_Mocp',
-            requestFrom: '6',
-            realUserId: userStore.userInfo?.id
+        if (application == 'json') {
+            //传对象
+        } else {
+            options.data = {
+                ...options.data,
+                apiPwd: 'Ifar$2_0160_525_Mocp',
+                requestFrom: '6',
+                realUserId: userStore.userInfo?.id
+            }
         }
     }
     // 非 http 开头需拼接地址
@@ -60,9 +66,18 @@ export const httpInterceptor = (options) => {
             ...options.header
         }
     } else {
-        options.header = {
-            'Content-Type': 'application/x-www-form-urlencoded',
-            ...options.header
+        if (application == 'json') {
+            options.header = {
+                'Content-Type': 'application/json',
+                Requestfrom: '6',
+                Realuserid: userStore.userInfo?.id,
+                ...options.header
+            }
+        } else {
+            options.header = {
+                'Content-Type': 'application/x-www-form-urlencoded',
+                ...options.header
+            }
         }
     }
     // 添加 token 请求头标识
@@ -116,6 +131,14 @@ export const http = (options) => {
         })
     })
 }
+//post请求
+export const post = (options) => {
+    options = {
+        application: 'json',
+        ...options
+    }
+    return http(options)
+}
 //upload请求
 export const upload = (options) => {
     options = httpInterceptor(options)

src/pages.json

@@ -307,6 +307,30 @@
             "style": {
                 "navigationBarTitleText": "其他特殊保障详情"
             }
+        },
+        {
+            "path": "pages/modules/mocp/panel/support-application/list",
+            "style": {
+                "navigationBarTitleText": "支援申请"
+            }
+        },
+        {
+            "path": "pages/modules/mocp/panel/support-application/search",
+            "style": {
+                "navigationBarTitleText": "筛选"
+            }
+        },
+        {
+            "path": "pages/modules/mocp/panel/support-application/add",
+            "style": {
+                "navigationBarTitleText": "新建支援申请"
+            }
+        },
+        {
+            "path": "pages/modules/mocp/panel/support-application/details",
+            "style": {
+                "navigationBarTitleText": "支援申请详情"
+            }
         }
     ],
     "globalStyle": {

src/pages/modules/mocp/panel/assign-work/constants/search.compositions.js

-import { ref } from 'vue'
-
-export const formRef = ref()
-// 表单数据
-export const formData = ref({
-    state: null,
-    terminal: '',
-    valid: null,
-    decisionState: null,
-    aviation: '',
-    machineNumber: '',
-    startTimeS: null,
-    startTimeE: null
-})

src/pages/modules/mocp/panel/assign-work/constants/search.functionals.js

-import { toRaw } from 'vue'
-import { formData, formRef } from './search.compositions'
-
-export const handleReset = () => {
-    formData.value = {
-        state: null,
-        presenter: '',
-        seat: '',
-        workType: null,
-        startTime: null,
-        stopTime: null
-    }
-    formRef.value?.resetFields()
-    handleConfirm()
-}
-export const handleConfirm = () => {
-    uni.$mocpJump.navigateBack()
-    uni.$emit('assignWorkReload', { params: toRaw(formData.value) })
-}

src/pages/modules/mocp/panel/move-decision/edit.vue

@@ -19,20 +19,42 @@
                         :options="deviceNumList"
                         clearable
                         @change="changeAc"
+                        filter
                     ></global-picker>
                 </up-form-item>
                 <up-form-item label="机型" :borderBottom="true">
-                    <up-input border="none" inputAlign="right" clearable v-model="formData.model" disabled disabledColor="#fff"></up-input>
+                    <up-input
+                        border="none"
+                        inputAlign="right"
+                        clearable
+                        v-model="formData.model"
+                        disabled
+                        disabledColor="#fff"
+                        placeholder="请选择机号自动关联"
+                    ></up-input>
                 </up-form-item>
                 <up-form-item label="航司" :borderBottom="true">
-                    <up-input border="none" inputAlign="right" clearable disabled disabledColor="#fff">
+                    <up-input
+                        border="none"
+                        inputAlign="right"
+                        clearable
+                        disabled
+                        disabledColor="#fff"
+                        :placeholder="formData.aviation ? '' : '请选择机号自动关联'"
+                    >
                         <template #suffix>
                             {{ useGetDictByValue('', formData.aviation, { data: baseStore.getAirlineSelect }) }}
                         </template>
                     </up-input>
                 </up-form-item>
                 <up-form-item label="航站" :borderBottom="true">
-                    <global-picker pickAlign="right" v-model="formData.terminal" clearable :options="baseStore.getTerminalSelect"></global-picker>
+                    <global-picker
+                        pickAlign="right"
+                        v-model="formData.terminal"
+                        clearable
+                        :options="baseStore.getTerminalSelect"
+                        filter
+                    ></global-picker>
                 </up-form-item>
                 <up-form-item label="日期" :borderBottom="true">
                     <global-date
@@ -135,7 +157,7 @@ import useMoveDecisionStore from 'mocp/store/move-decision'
 import { storeToRefs } from 'pinia'
 import useBaseStore from 'mocp/store/base'
 import { useGetDictByValue } from 'mocp/hooks/use-dict/useDict'
-import { getAcReduceListApi } from 'mocp/api/base'
+import { getAcReduceListApi } from 'mocp/api/system'
 import { updateDecisionApi } from 'mocp/api/move-decision'
 import { getParamsByType } from 'mocp/hooks/use-params/useParams'
 

src/pages/modules/mocp/panel/support-application/add.vue

+<template>
+    <global-page title="新建支援申请" showFooterBtn footerBtnText="申请" @handleFooterClick="handleFooterClick">
+        <view class="mocp-form">
+            <up-form labelPosition="left" labelWidth="auto" :model="formData" :rules="rules" ref="formRef">
+                <up-form-item label="机号" prop="machineNumber" :borderBottom="true" required>
+                    <global-picker
+                        pickAlign="right"
+                        v-model="formData.machineNumber"
+                        :options="deviceNumList"
+                        clearable
+                        @change="changeAc"
+                        filter
+                    ></global-picker>
+                </up-form-item>
+                <up-form-item label="机型" :borderBottom="true">
+                    <up-input
+                        border="none"
+                        inputAlign="right"
+                        clearable
+                        v-model="formData.model"
+                        disabled
+                        disabledColor="#fff"
+                        placeholder="请选择机号自动关联"
+                    ></up-input>
+                </up-form-item>
+                <up-form-item label="航司" :borderBottom="true">
+                    <up-input
+                        border="none"
+                        inputAlign="right"
+                        clearable
+                        disabled
+                        disabledColor="#fff"
+                        :placeholder="formData.aviation ? '' : '请选择机号自动关联'"
+                    >
+                        <template #suffix>
+                            {{ useGetDictByValue('', formData.aviation, { data: baseStore.getAirlineSelect }) }}
+                        </template>
+                    </up-input>
+                </up-form-item>
+                <up-form-item label="航站" prop="terminal" :borderBottom="true" required>
+                    <global-picker
+                        pickAlign="right"
+                        v-model="formData.terminal"
+                        clearable
+                        :options="baseStore.getTerminalSelect"
+                        filter
+                    ></global-picker>
+                </up-form-item>
+                <up-form-item label="ATA章节" prop="ata" :borderBottom="true" required>
+                    <global-picker v-model="formData.ata" pickAlign="right" :options="baseStore.getATASelect" clearable filter></global-picker>
+                </up-form-item>
+                <up-form-item label="专业" prop="specialty" :borderBottom="true" required>
+                    <global-picker
+                        v-model="formData.specialty"
+                        pickAlign="right"
+                        :options="getParamsByType('MajorCategory')"
+                        clearable
+                    ></global-picker>
+                </up-form-item>
+                <up-form-item label="发动机型号" prop="engineModel" :borderBottom="true">
+                    <global-picker
+                        v-model="formData.engineModel"
+                        pickAlign="right"
+                        :options="baseStore.getEngineSelect"
+                        clearable
+                        filter
+                    ></global-picker>
+                </up-form-item>
+                <up-form-item label="故障描述及处理方案简要描述" prop="faultDescription" :borderBottom="true" labelPosition="top">
+                    <up-textarea
+                        placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
+                        :height="40"
+                        border="none"
+                        v-model="formData.faultDescription"
+                    ></up-textarea>
+                </up-form-item>
+                <up-form-item label="飞机当前状态/下一段航班计划" prop="airplaneState" :borderBottom="true" labelPosition="top">
+                    <up-textarea
+                        placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
+                        :height="40"
+                        border="none"
+                        v-model="formData.airplaneState"
+                    ></up-textarea>
+                </up-form-item>
+                <up-form-item label="手册要求描述" prop="manualDescription" :borderBottom="true" labelPosition="top">
+                    <up-textarea
+                        placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
+                        :height="40"
+                        border="none"
+                        v-model="formData.manualDescription"
+                    ></up-textarea>
+                </up-form-item>
+                <up-form-item label="支援申请描述" prop="supportNeeds" :borderBottom="true" labelPosition="top" required>
+                    <up-textarea
+                        placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
+                        :height="40"
+                        border="none"
+                        v-model="formData.supportNeeds"
+                    ></up-textarea>
+                </up-form-item>
+                <up-form-item label="上传故障描述附件" :borderBottom="true" labelPosition="top">
+                    <view style="margin-top: 24rpx">
+                        <global-upload v-model="formData.supportFile" mapFieldName="id"></global-upload>
+                    </view>
+                </up-form-item>
+                <up-form-item label="执管评估意见" prop="suggestion" :borderBottom="true" labelPosition="top">
+                    <up-textarea
+                        placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
+                        :height="40"
+                        border="none"
+                        v-model="formData.suggestion"
+                    ></up-textarea>
+                </up-form-item>
+                <up-form-item label="相关席位" prop="relevantSeats" :borderBottom="true" required>
+                    <global-picker
+                        v-model="formData.relevantSeats"
+                        pickAlign="right"
+                        :options="relatedSeatSet"
+                        clearable
+                        filter
+                        :beforeOpen="beforeOpen"
+                        label-field="seatName"
+                        value-field="id"
+                    ></global-picker>
+                </up-form-item>
+            </up-form>
+        </view>
+    </global-page>
+</template>
+
+<script setup>
+import useBaseStore from 'mocp/store/base'
+import { getParamsByType } from 'mocp/hooks/use-params/useParams'
+import { useGetDictByValue } from 'mocp/hooks/use-dict/useDict'
+import { formData, formRef, relatedSeatSet, rules } from './constants/add.compositions'
+import { beforeOpen, changeAc, handleSubmit } from './constants/add.functionals'
+import useUserStore from 'mocp/store/user'
+
+const baseStore = useBaseStore()
+const userStore = useUserStore()
+//获取下拉框选项
+const {
+    selectList: { deviceNumList }
+} = useBaseStore()
+
+const handleFooterClick = () => {
+    handleSubmit(userStore.userInfo?.id)
+}
+</script>
+<style lang="scss" scoped>
+.mocp-form {
+    background: #fff;
+    padding: 0 32rpx;
+}
+</style>

src/pages/modules/mocp/panel/support-application/constants/add.compositions.js

+import { reactive, ref } from 'vue'
+
+export const formRef = ref()
+//验证
+export const rules = reactive({
+    machineNumber: [
+        {
+            required: true,
+            message: '请选择机号',
+            trigger: ['blur', 'change']
+        }
+    ],
+    terminal: [
+        {
+            required: true,
+            message: '请选择航站',
+            trigger: ['blur', 'change']
+        }
+    ],
+    ata: [
+        {
+            required: true,
+            message: '请选择ATA章节',
+            trigger: ['blur', 'change']
+        }
+    ],
+    specialty: [
+        {
+            required: true,
+            message: '请选择专业',
+            trigger: ['blur', 'change']
+        }
+    ],
+    supportNeeds: [
+        {
+            required: true,
+            message: '请输入支援需求',
+            trigger: ['blur']
+        }
+    ],
+    relevantSeats: [
+        {
+            required: true,
+            message: '请选择相关席位',
+            trigger: ['blur', 'change']
+        }
+    ]
+})
+// 表单数据
+export const formData = reactive({
+    id: '',
+    machineNumber: null,
+    model: null,
+    aviation: null,
+    terminal: null,
+    ata: null,
+    specialty: null,
+    engineModel: null,
+    supportNeeds: '',
+    supportFile: '',
+    faultDescription: '',
+    airplaneState: '',
+    manualDescription: '',
+    suggestion: '',
+    relevantSeats: null
+})
+//席位
+export const relatedSeatSet = ref([])

src/pages/modules/mocp/panel/support-application/constants/add.functionals.js

+import { getAcReduceListApi, getSysSeatListApi } from 'mocp/api/system'
+import { formData, formRef, relatedSeatSet } from './add.compositions'
+import { addUpdateSupportApi } from 'mocp/api/support-application'
+
+//切换机号
+export const changeAc = async () => {
+    const res = await getAcReduceListApi({ ac: formData.machineNumber }, { loading: true })
+    if (res.code == 200) {
+        formData.model = res.data[0]?.zstortgc
+        formData.aviation = res.data[0]?.zop3
+    } else {
+        uni.$mocpMessage.error(res.message)
+    }
+}
+//选择相关席位
+export const beforeOpen = async () => {
+    if (!formData.machineNumber) {
+        uni.$mocpMessage.error('请选择机号')
+        return false
+    }
+    if (!formData.terminal) {
+        uni.$mocpMessage.error('请选择航站')
+        return false
+    }
+    try {
+        await uni.showLoading({
+            mask: true,
+            title: '检索席位中'
+        })
+        const terminalCode = formData.terminal.match(/[A-Z]+/gi)[0]
+        const resp = await Promise.all([
+            getSysSeatListApi({
+                pid: 0,
+                seatType: 1,
+                pageSize: 1000,
+                terminalCode
+            }),
+            getSysSeatListApi({
+                pid: 0,
+                seatType: 1,
+                pageSize: 1000,
+                acType: formData.model
+            })
+        ])
+        if (resp.every((a) => a.code.toString() === '200')) {
+            relatedSeatSet.value = resp[0].data.list.concat(resp[1].data.list)
+            return true
+        } else {
+            throw new Error('请求席位失败！')
+        }
+    } catch (res) {
+        uni.$mocpMessage.error(res.message)
+    } finally {
+        uni.hideLoading()
+    }
+}
+//提交表单
+export const handleSubmit = async (sponsorSeat) => {
+    await formRef.value?.validate()
+    const res = await addUpdateSupportApi({ ...formData, sponsorSeat }, { loading: true })
+    if (res.code == 200) {
+        uni.$mocpJump.navigateBack()
+        uni.$mocpMessage.success(res.message)
+        uni.$emit('supportApplicationReload')
+    } else {
+        uni.$mocpMessage.error(res.message)
+    }
+}

src/pages/modules/mocp/panel/support-application/details.vue

+<template>
+    <global-page title="支援申请详情">
+        <view class="mocp-cell">
+            <up-cell-group v-if="details">
+                <up-cell title="创建时间" :value="details.createTime"></up-cell>
+                <up-cell title="发起人" :value="details.sponsor"></up-cell>
+                <up-cell title="接收人" :value="details.recipient || '-'"></up-cell>
+                <up-cell title="状态">
+                    <template #value>
+                        <custom-state :value="useGetDictByValue('sa_state', details.state)" :size="28"></custom-state>
+                    </template>
+                </up-cell>
+                <up-cell title="机号" :value="details.machineNumber || '-'"></up-cell>
+                <up-cell title="机型" :value="details.model || '-'"></up-cell>
+                <up-cell title="相关席位" :value="details.relevantSeatsName || '-'"></up-cell>
+                <up-cell title="航司" :value="useGetDictByValue('', details.aviation, { data: baseStore.getAirlineSelect }) || '-'"></up-cell>
+                <up-cell title="航站" :value="details.terminal || '-'"></up-cell>
+                <up-cell title="任务需求" :label="details.supportNeeds || '-'"></up-cell>
+            </up-cell-group>
+        </view>
+    </global-page>
+</template>
+
+<script setup>
+import { storeToRefs } from 'pinia'
+import useSupportApplicationStore from 'mocp/store/support-application'
+import { useGetDictByValue } from 'mocp/hooks/use-dict/useDict'
+import useBaseStore from 'mocp/store/base'
+
+const baseStore = useBaseStore()
+const supportApplicationStore = useSupportApplicationStore()
+const { details } = storeToRefs(supportApplicationStore)
+</script>
+<style lang="scss" scoped>
+.mocp-cell {
+    background: #fff;
+}
+</style>

src/pages/modules/mocp/panel/support-application/list.vue

+<template>
+    <global-page
+        title="支援申请"
+        isDataList
+        refresherEnabled
+        loadingMoreEnabled
+        auto
+        ref="paging"
+        :params="searchData"
+        showNavRight
+        navRightType="icon"
+        navRightIcon="saixuan-01"
+        @handleRightClick="handleRightClick"
+        :api="getSupportRequestListApi"
+        :padding="24"
+        showFooterBtn
+        footerBtnText="新建"
+        @handleFooterClick="handleFooterClick"
+    >
+        <template #="{ dataList }">
+            <view class="item" v-for="item in dataList" :key="item.id" @tap="goDetails(item)">
+                <view class="item-title">
+                    <view class="left">
+                        <custom-state :value="useGetDictByValue('sa_state', item.state)"></custom-state>
+                        <text class="txt u-line-1" v-if="item.supportNumber">{{ item.supportNumber }}</text>
+                    </view>
+                </view>
+                <view class="item-content u-line-3">
+                    {{ item.faultDescription || '无' }}
+                </view>
+                <view class="item-footer">
+                    <view class="left">
+                        <text class="txt u-line-1" v-if="item.machineNumber">{{ item.machineNumber }}</text>
+                        <text class="txt u-line-1" v-if="item.model">{{ item.model }}</text>
+                        <text class="txt u-line-1" v-if="item.aviation">
+                            {{ useGetDictByValue('', item.aviation, { data: baseStore.getAirlineSelect }) }}
+                        </text>
+                    </view>
+                    <view class="label">
+                        <text class="txt u-line-1" v-if="item.terminal">{{ item.terminal }}</text>
+                    </view>
+                </view>
+            </view>
+        </template>
+    </global-page>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { useGetDictByValue } from 'mocp/hooks/use-dict/useDict'
+import { storeToRefs } from 'pinia'
+import { onUnload } from '@dcloudio/uni-app'
+import { getSupportRequestListApi } from 'mocp/api/support-application'
+import useSupportApplicationStore from 'mocp/store/support-application'
+import useBaseStore from 'mocp/store/base'
+
+const baseStore = useBaseStore()
+//跳转
+const supportApplicationStore = useSupportApplicationStore()
+const { searchData } = storeToRefs(supportApplicationStore)
+const goDetails = (data) => {
+    uni.$mocpJump.navigateTo('/panel/support-application/details', { id: data.id }).then(() => {
+        supportApplicationStore.setState('details', data)
+    })
+}
+//筛选
+const handleRightClick = () => {
+    uni.$mocpJump.navigateBack('/panel/support-application/search')
+}
+//刷新
+const paging = ref()
+uni.$on('supportApplicationReload', () => {
+    paging.value?.reload()
+})
+//新建
+const handleFooterClick = () => {
+    uni.$mocpJump.navigateTo('/panel/support-application/add')
+}
+onUnload(() => {
+    uni.$off('supportApplicationReload')
+})
+</script>
+<style lang="scss" scoped>
+@import 'mocpStatic/css/list.scss';
+</style>

src/pages/modules/mocp/panel/support-application/search.vue

+<template>
+    <global-page title="筛选">
+        <view class="search-form">
+            <up-form labelPosition="left" labelWidth="auto">
+                <up-form-item label="状态" prop="state" :borderBottom="true">
+                    <global-picker v-model="formData.state" pickAlign="right" clearable dictkey="wa_state"></global-picker>
+                </up-form-item>
+                <up-form-item label="机号" prop="machineNumber" :borderBottom="true">
+                    <global-picker pickAlign="right" v-model="formData.machineNumber" :options="deviceNumList" clearable filter></global-picker>
+                </up-form-item>
+                <up-form-item label="机型" prop="model" :borderBottom="true">
+                    <global-picker v-model="formData.model" pickAlign="right" :options="baseStore.getTypeSelect" clearable filter></global-picker>
+                </up-form-item>
+                <up-form-item label="航司" prop="aviation" :borderBottom="true">
+                    <global-picker
+                        v-model="formData.aviation"
+                        pickAlign="right"
+                        :options="baseStore.getAirlineSelect"
+                        clearable
+                        filter
+                    ></global-picker>
+                </up-form-item>
+                <up-form-item label="航站" prop="terminal" :borderBottom="true">
+                    <global-picker
+                        pickAlign="right"
+                        v-model="formData.terminal"
+                        clearable
+                        :options="baseStore.getTerminalSelect"
+                        filter
+                    ></global-picker>
+                </up-form-item>
+                <up-form-item label="专业" prop="specialty" :borderBottom="true">
+                    <global-picker
+                        v-model="formData.specialty"
+                        pickAlign="right"
+                        :options="getParamsByType('MajorCategory')"
+                        clearable
+                    ></global-picker>
+                </up-form-item>
+                <up-form-item label="发动机型号" prop="engineModel" :borderBottom="true">
+                    <global-picker
+                        v-model="formData.engineModel"
+                        pickAlign="right"
+                        :options="baseStore.getEngineSelect"
+                        clearable
+                        filter
+                    ></global-picker>
+                </up-form-item>
+            </up-form>
+        </view>
+        <template #bottom>
+            <view class="footer-btn">
+                <up-row gutter="10">
+                    <up-col span="6">
+                        <global-button type="primary" plain size="large" :radius="5" @tap="handleReset">重置</global-button>
+                    </up-col>
+                    <up-col span="6"><global-button type="primary" size="large" :radius="5" @tap="handleConfirm">确定</global-button></up-col>
+                </up-row>
+            </view>
+        </template>
+    </global-page>
+</template>
+
+<script setup>
+import useBaseStore from 'mocp/store/base'
+import { storeToRefs } from 'pinia'
+import { cloneDeep } from 'lodash'
+import { ref } from 'vue'
+import useSupportApplicationStore from 'mocp/store/support-application'
+import { getParamsByType } from 'mocp/hooks/use-params/useParams'
+
+//获取下拉框选项
+const baseStore = useBaseStore()
+const {
+    selectList: { deviceNumList }
+} = useBaseStore()
+const supportApplicationStore = useSupportApplicationStore()
+//获取查询表单数据
+const { searchData } = storeToRefs(supportApplicationStore)
+const formData = ref(cloneDeep(searchData.value))
+const handleReset = () => {
+    supportApplicationStore.resetForm()
+    uni.$mocpJump.navigateTo('/panel/support-application/list')
+    uni.$emit('supportApplicationReload')
+}
+const handleConfirm = () => {
+    supportApplicationStore.setState('searchData', formData.value)
+    uni.$mocpJump.navigateTo('/panel/support-application/list')
+    uni.$emit('supportApplicationReload')
+}
+</script>
+<style lang="scss" scoped>
+.search-form {
+    padding: 24rpx 24rpx 0 24rpx;
+    background: #fff;
+}
+.footer-btn {
+    padding: 24rpx 32rpx;
+    background-color: #fff;
+}
+</style>