<template>
    <global-page
        title="编辑运行决策"
        navLeftType="text"
        :showNavRight="true"
        navRightType="button"
        navRightText="保存"
        @handleRightClick="handleSave"
    >
        <view class="mocp-form">
            <up-form labelPosition="left" labelWidth="auto" :model="formData">
                <up-form-item label="状态" :borderBottom="true">
                    <global-picker pickAlign="right" v-model="formData.state" dictkey="md_state"></global-picker>
                </up-form-item>
                <up-form-item label="机号" :borderBottom="true">
                    <global-picker
                        pickAlign="right"
                        v-model="formData.machineNumber"
                        :options="deviceNumList"
                        clearable
                        @change="changeAc"
                    ></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-form-item>
                <up-form-item label="航司" :borderBottom="true">
                    <up-input border="none" inputAlign="right" clearable disabled disabledColor="#fff">
                        <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>
                </up-form-item>
                <up-form-item label="日期" :borderBottom="true">
                    <global-date
                        pickAlign="right"
                        v-model="formData.dateTime"
                        clearable
                        mode="datetime"
                        format="YYYY/MM/DD HH:mm"
                        placeholder="请选择日期"
                        :emptyValue="0"
                    ></global-date>
                </up-form-item>
                <up-form-item label="航班号" :borderBottom="true">
                    <global-picker
                        pickAlign="right"
                        v-model="formData.flight"
                        clearable
                        :options="baseStore.selectList.flightNumList"
                    ></global-picker>
                </up-form-item>
                <up-form-item label="预计起飞时间" :borderBottom="true">
                    <global-date
                        pickAlign="right"
                        v-model="formData.takeOff"
                        clearable
                        mode="datetime"
                        format="YYYY/MM/DD HH:mm"
                        placeholder="请选择日期"
                        :emptyValue="0"
                    ></global-date>
                </up-form-item>
                <up-form-item label="运行决策类型" :borderBottom="true">
                    <global-picker
                        pickAlign="right"
                        v-model="formData.technicalType"
                        clearable
                        :options="baseStore.getParamsByType('OperationalDecisionType')"
                    ></global-picker>
                </up-form-item>
                <up-form-item label="故障描述" :borderBottom="true" labelPosition="top">
                    <up-textarea
                        v-model.trim="formData.faultDescription"
                        placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
                        :height="40"
                        border="none"
                    ></up-textarea>
                </up-form-item>
                <up-form-item label="邮件/电话记录" :borderBottom="true" labelPosition="top">
                    <up-textarea
                        v-model.trim="formData.phone"
                        placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
                        :height="40"
                        border="none"
                    ></up-textarea>
                </up-form-item>
                <up-form-item label="附件" :borderBottom="true" labelPosition="top">
                    <global-upload
                        :fileList="getFileList"
                        v-model="formData.file"
                        mapFieldName="ids"
                        @getFileList="getFileDataList"
                        style="margin-top: 24rpx"
                    ></global-upload>
                </up-form-item>
                <up-form-item label="批准人" :borderBottom="true">
                    <up-input
                        v-model="formData.approver"
                        border="none"
                        inputAlign="right"
                        placeholder="请输入"
                        :adjustPosition="false"
                        clearable
                    ></up-input>
                </up-form-item>
                <up-form-item label="决策结果" :borderBottom="true">
                    <global-picker
                        pickAlign="right"
                        v-model="formData.decisionState"
                        style="margin-top: 24rpx"
                        dictkey="md_decisionState"
                    ></global-picker>
                </up-form-item>
                <up-form-item label="详情" :borderBottom="true" labelPosition="top" v-if="formData.decisionState == '0'">
                    <up-textarea
                        v-model.trim="formData.remark"
                        placeholder="一段很长很长的内容文字，长文本自动换行，该选项的描述是一段很长的内容"
                        :height="40"
                        border="none"
                    ></up-textarea>
                </up-form-item>
            </up-form>
        </view>
    </global-page>
</template>

<script setup>
import { onLoad } from '@dcloudio/uni-app'
import { reactive, ref } from 'vue'
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 { updateDecisionApi } from 'mocp/api/move-decision'

const baseStore = useBaseStore()
//获取下拉框选项
const {
    selectList: { deviceNumList }
} = useBaseStore()
const moveDecisionStore = useMoveDecisionStore()
const { details, getFileList } = storeToRefs(moveDecisionStore)
const formData = reactive({
    approver: '',
    aviation: '',
    dateTime: '',
    faultDescription: '',
    file: '',
    flight: '',
    id: '',
    machineNumber: '',
    model: '',
    phone: '',
    state: '',
    takeOff: '',
    technicalType: '',
    terminal: '',
    decisionState: '',
    remark: ''
})
//页面初始化
onLoad(() => {
    formData.approver = details.value.approver
    formData.aviation = details.value.aviation
    formData.dateTime = details.value.dateTime
    formData.faultDescription = details.value.faultDescription
    formData.flight = details.value.flight
    formData.id = details.value.id
    formData.machineNumber = details.value.machineNumber
    formData.model = details.value.model
    formData.phone = details.value.phone
    formData.state = details.value.state
    formData.takeOff = details.value.takeOff
    formData.technicalType = details.value.technicalType
    formData.terminal = details.value.terminal
    formData.decisionState = details.value.decisionState || ''
    formData.remark = details.value.remark
})
//切换机号
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)
    }
}
//获取文件列表
const fileList = ref([])
const getFileDataList = (data) => {
    fileList.value = data
}
//保存
const handleSave = async () => {
    const res = await updateDecisionApi(formData, { loading: true })
    if (res.code == 200) {
        uni.$mocpJump.navigateBack()
        uni.$mocpMessage.success(res.message)
        //更新详情
        res.data.file = JSON.stringify(fileList.value)
        moveDecisionStore.setState('details', res.data)
    } else {
        uni.$mocpMessage.error(res.message)
    }
}
</script>
<style lang="scss" scoped>
.mocp-form {
    background: #fff;
    margin-bottom: 24rpx;
    padding: 0 32rpx;
}
</style>
