<template>
    <div>
        <el-button type="warning" size="mini" icon="el-icon-sort" :disabled="multiple" @click="putsHandle">指派投放助理</el-button>
        <el-dialog title="指派投放助手" :visible.sync="show" width="450px" append-to-body>
            <el-form :model="paramsForm" :rules="rules" ref="PUTUSERS" label-width="80px" label-position="top">
                <el-form-item label="投放助理" prop="putUserIds">
                    <el-select v-model="paramsForm.putUserIds" multiple placeholder="请选择" filterable style="width: 100%" clearable>
                        <el-option v-for="item in userAll" :key="item.id" :label="item.nickName" :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="paramsForm = {}; show = false">取 消</el-button>
                <el-button type="primary" @click="submitPUt('PUTUSERS')" :loading="loading">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
import { addAccountUser } from "@/api/accounts/adApi";
export default {
    name: 'putUsers',
    data() {
        return {
            loading: false,
            show: false,
            paramsForm: {
                putUserIds: []
            },
            rules: {
                putUserIds: [
                    { required: true, message: '请选择投放助理', trigger: 'blur' }
                ],
            }
        }
    },
    props: {
        multiple: {
            type: Boolean,
            default: false
        },
        accountIds: {
            type: Array,
            default: [],
        },
        userAll: {
            type: Array,
            default: [],
        }
    },
    methods: {
        putsHandle() {
            this.show = true
            this.paramsForm = {}
        },
        submitPUt(type) {
            this.$refs[type].validate((valid) => {
                if (valid) {
                    this.loading = true
                    addAccountUser({ accountIds: this.accountIds, ...this.paramsForm }).then(res => {
                        this.loading = false
                        if (res.data) {
                            this.msgSuccess('切换成功')
                            this.paramsForm = {}
                            this.show = false
                            this.$emit('change')
                        }
                    }).catch(() => this.loading = false)
                }
            })
        },
    }
}
</script>