<template>
  <el-dialog :title="title" :visible.sync="dialogVisible" width="500px" :before-close="doClose" center>
    <data-form ref="dataform" :form="form" :form-model="formModel" :rules="rules" />
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="doCreate">{{ $t('global.confirm') }}</el-button>
      <el-button @click="doClose">{{ $t('global.cancel') }}</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { getStationList } from '@/api/runplan';
import {getAllMapOnline} from '@/api/jmap/map';
import { getIbpList, copyIbpData } from '@/api/ibp';
export default {
    name: 'Copy',
    data() {
        return {
            dialogVisible: false,
            stationList: [],
            ibpId: '',
            title: '',
            formModel: {
                dataMapId: '',
                dataStationCode: '',
                stationCode: ''
            },
            mapList: [],
            dataStationList: [],
            ibpStationMap: {},
            ibpMap: {}
        };
    },
    computed: {
        form() {
            const form = {
                labelWidth: '150px',
                items: [
                    { prop: 'dataMapId', label: '发布数据地图:', type: 'select', options: this.mapList, change: true, onChange: this.changeMapId},
                    { prop: 'dataStationCode', label: '发布地图车站:', type: 'select', options: this.dataStationList },
                    { prop: 'stationCode', label: '关联站台:', type: 'select', options: this.stationList }
                ]
            };
            return form;
        },
        rules() {
            const crules = {
                stationCode: [
                    { required: true, message: '请选择', trigger: 'change' }
                ]
            };
            return crules;
        }
    },
    async created () {
        this.getIbpList();
        this.getStationLIst();
    },
    methods: {
        async getIbpList() {
            try {
                const res = await getIbpList({pageSize: 9999, pageIndex: 0});
                const rest = await getAllMapOnline();
                if (rest.data && rest.data.length) {
                    rest.data.forEach(item => {
                        const param = {
                            label: item.name,
                            value: item.id
                        };
                        this.mapList.push(param);
                    });
                }
                if (res.data && res.data.list) {
                    res.data.list.forEach(item => {
                        if (this.ibpStationMap[item.mapId]) {
                            this.ibpStationMap[item.mapId].push(item.stationCode);
                        } else {
                            this.ibpStationMap[item.mapId] = [item.stationCode];
                        }
                        this.ibpMap[item.stationCode] = item.id;
                    });
                }
            } catch (e) {
                console.log(e);
            }
        },
        async getStationLIst() {
            try {
                const res = await getStationList(this.$route.params.mapId);
                this.stationList = [];
                if (res.code == 200) {
                    res.data.forEach(station => {
                        const param = {
                            label: station.name,
                            value: station.code
                        };
                        this.stationList.push(param);
                    });
                }
            } catch (error) {
                console.log(error);
            }
        },
        doShow() {
            this.dialogVisible = true;
        },
        doCreate() {
            this.$refs.dataform.validateForm(() => {
                const param = {
                    mapId: this.$route.params.mapId,
                    ibpId: this.ibpMap[this.formModel.dataStationCode],
                    stationCode: this.formModel.stationCode
                };
                copyIbpData(param).then(resp => {
                    this.$message.success('创建成功');
                    this.$emit('reloadTable');
                }).catch(error => {
                    this.$messageBox(`创建失败: ${error.message}`);
                });
                this.doClose();
            });
        },
        doClose() {
            this.$refs.dataform.resetForm();
            this.dialogVisible = false;
        },
        async changeMapId(val) {
            try {
                const res = await getStationList(val);
                this.dataStationList = [];
                this.formModel.dataStationCode = '';
                if (res.code == 200 || this.ibpStationMap[val]) {
                    res.data.forEach(station => {
                        if (this.ibpStationMap[val].includes(station.code)) {
                            const param = {
                                label: station.name,
                                value: station.code
                            };
                            this.dataStationList.push(param);
                        }
                    });
                }
            } catch (error) {
                console.log(error);
            }
        }
    }
};
</script>

<style scoped>

</style>
