<template>
    <Wraper :hidden="hidden" :onOk="submit" :refresh="refresh" :noFooter="isView">
        <a-form-model layout="vertical" :model="form" :rules="rules" ref="form">
            <a-form-model-item label="线路名称" prop="routeName">
                <a-input v-model="form.routeName" :disabled="isView" />
            </a-form-model-item>
            <a-form-model-item label="所属地区" prop="regionId">
                <UrlSelect
                    v-model="form.regionId"
                    url="/ranger/inspection/api/v1/region/list"
                    labelFiled="regionName"
                    valueFiled="regionId"
                    :disabled="isView"
                />
            </a-form-model-item>
            <a-form-model-item label="专业" prop="specialityId">
                <UrlSelect
                    v-model="form.specialityId"
                    :url="
                        form.regionId
                            ? `/ranger/inspection/api/v1/specialities/valid/regions/${form.regionId}/list`
                            : ''
                    "
                    labelFiled="specialityName"
                    valueFiled="specialityId"
                    :disabled="isView"
                />
            </a-form-model-item>
            <a-form-model-item label="分配方式" prop="dispatchType">
                <a-select v-model="form.dispatchType" style="width: 100%" :disabled="isView">
                    <a-select-option key="PERSON" value="PERSON">按人分配</a-select-option>
                    <a-select-option key="SPECIALITY" value="SPECIALITY">按专业分配</a-select-option>
                </a-select>
            </a-form-model-item>
            <a-form-model-item label="过期方式" prop="expirationType">
                <a-select v-model="form.expirationType" style="width: 100%" :disabled="isView">
                    <a-select-option key="NEXT" value="NEXT">下次任务开始过期</a-select-option>
                    <a-select-option key="ONE_DAY" value="ONE_DAY">一天后过期</a-select-option>
                    <a-select-option key="SEVEN_DAY" value="SEVEN_DAY">七天后过期</a-select-option>
                    <a-select-option key="FIFTEEN_DAY" value="FIFTEEN_DAY">十五天后过期</a-select-option>
                    <a-select-option key="NEVER" value="NEVER">不过期</a-select-option>
                </a-select>
            </a-form-model-item>
            <a-form-model-item label="备注" prop="remark">
                <a-textarea placeholder="Basic usage" :rows="4" v-model="form.remark" :disabled="isView" />
            </a-form-model-item>
        </a-form-model>
    </Wraper>
</template>

<script>
import Wraper from '@/components/table/wraper.vue';
import UrlSelect from '@/components/MySelect/url_select.vue';
import { addRouteInfoApi, updateRouteInfoApi, getRouteInfoApi } from '@/api';

export default {
    components: { Wraper, UrlSelect },
    props: { hidden: Function, row: Object, type: String, refresh: Function },
    data: () => ({
        form: {},
        rules: {
            routeName: [{ required: true }],
            regionId: [{ required: true }],
            specialityId: [{ required: true }],
            dispatchType: [{ required: true }],
            expirationType: [{ required: true }],
        },
    }),

    computed: {
        isView() {
            return this.type === 'view';
        },
        isEdit() {
            return this.type === 'edit';
        },
        isAdd() {
            return this.type === null;
        },
    },

    async mounted() {
        if (!this.isAdd) {
            this.form = await getRouteInfoApi(this.row.routeId);
        }
    },

    methods: {
        async submit() {
            await this.$refs.form.validate();
            if (this.isAdd) return addRouteInfoApi(this.form);
            if (this.isEdit) return updateRouteInfoApi(this.form);
        },
    },
};
</script>
