<!--
 * @Author: wanglj 471442253@qq.com
 * @Date: 2022-12-26 14:34:34
 * @LastEditors: wanglj
 * @LastEditTime: 2022-12-29 11:26:07
 * @Description: file content
 * @FilePath: \opms_frontend\src\views\customer\components\allocate.vue
-->
<template>
  <el-dialog title="分配客户" :visible.sync="visible" width="30%" @close="handleClose">
    <el-form label-width="80px" :model="form">
      <el-form-item label="销售代表">
        <el-input v-model="form.allocate" readonly>
          <el-button slot="append" icon="el-icon-search" @click="choose" />
        </el-input>
      </el-form-item>
    </el-form>
    <span slot="footer">
      <el-button size="mini" type="primary">保存</el-button>
      <el-button size="mini" @click="visible = false">取消</el-button>
    </span>
    <!--    <Transfer ref="transfer" />-->
    <select-user
      ref="selectUser"
      :multiple="true"
      :query-params="{ roles: ['Sales', 'SalesManager'] }"
      @save="selectUser" />
  </el-dialog>
</template>

<script>
  // import Transfer from './Transfer.vue'
  import SelectUser from '@/components/select/SelectUser'

  export default {
    components: {
      // Transfer,
      SelectUser,
    },
    data() {
      const generateData = () => {
        const data = []
        const cities = ['上海', '北京', '广州', '深圳', '南京', '西安', '成都']
        const pinyin = ['shanghai', 'beijing', 'guangzhou', 'shenzhen', 'nanjing', 'xian', 'chengdu']
        cities.forEach((city, index) => {
          data.push({
            label: city,
            key: index,
            pinyin: pinyin[index],
          })
        })
        return data
      }
      return {
        visible: false,
        innerVisible: false,
        form: {
          allocate: '',
        },
        allocate: [],
        data: generateData(),
        options: [],
        salesId: '',
      }
    },
    methods: {
      handleClose() {},
      choose() {
        // this.$refs.transfer.innerVisible = true
        this.$refs.selectUser.open()
      },
      selectUser(userList) {
        console.log(userList)
      },
    },
  }
</script>

<style></style>
