Vue.component('train-list', {
    template: `
    <div class="job-box">
        <div class="job-item" v-for="item in list">
            <div class="job-flex">
                <div class="job-flex-left job-title">{{item.train.title}}</div>
                <div class="job-flex-right salary" @click="onCancel(item.id)">取消报名</div>
            </div>
            <div class="job-flex margin-top-10">
                <div class="job-flex-left">
                    {{item.train.contact}}
                </div>
                <div class="job-flex-right num">{{item.train.mobile}}</div>
            </div>
            <div class="job-flex margin-top-10">
                <div class="job-flex-left">
                    {{item.train.address}}
                </div>
                <div class="job-flex-right"></div>
            </div>
        </div>
    </div>
    `,
    data() {
        return {}
    },
    props: {
        list: {
            type: Array,
            default: [],
        },
    },
    methods: {
        onCancel(id) {
            this.$dialog.confirm({
                title: '提示',
                message: '确定取消？',
            }).then(() => {
                this.$emit('cancel', id);
            })
        },
    },
});