rmLayGaoujU9O46l603ccl_plm-vue/src/views/modules/sys/user-add-or-update.vue

<template>
  <div class="user-add-or-update">
    <el-dialog
      width="530px"
      :title="!dataForm.id ?  buttons.add :buttons.edit"
      :close-on-click-modal="false"
      :visible.sync="visible"
      @close="closeDataDialog">
      <!-- 取消    :rules="dataRule"-->
      <el-form :inline="true" :model="dataForm" label-position="top" ref="dataForm"
               @keyup.enter.native="dataFormSubmit()"
               label-width="80px">
        <el-form>
          <el-form-item :label="buttons.username||'用户账号'" prop="userName">
            <el-input v-model="dataForm.userName" style="width: 150px;" placeholder="登录帐号"></el-input>
          </el-form-item>
          <el-form-item :label="buttons.password||'密码'" prop="password" :class="{ 'is-required': !dataForm.id }">
            <el-input v-model="dataForm.password" style="width: 150px;" type="password" ></el-input>
          </el-form-item>
          <el-form-item :label="buttons.comfirmPassword||'确认密码'" prop="comfirmPassword" :class="{ 'is-required': !dataForm.id }">
            <el-input v-model="dataForm.comfirmPassword" style="width: 150px;" type="password"
                      ></el-input>
          </el-form-item>
        </el-form>
        <el-form>
          <el-form-item :label="buttons.userDisplay||'用户名'" prop="email">
            <el-input v-model="dataForm.userDisplay" style="width: 150px;" ></el-input>
          </el-form-item>
          <el-form-item :label="buttons.email||'邮箱'" prop="email">
            <el-input v-model="dataForm.email" style="width: 150px;" ></el-input>
          </el-form-item>
          <el-form-item :label="buttons.mobile||'手机号'" prop="mobile">
            <el-input v-model="dataForm.mobile" style="width: 150px;" placeholder="手机号"></el-input>
          </el-form-item>
        </el-form>
        <el-form>
          <el-form-item :label="'工厂'">
            <el-select v-model="dataForm.siteID" clearable style="width: 150px;" placeholder="请选择" @change="getBUDepartmentPostList">
              <el-option
                :label="i.siteID + '-' + i.siteName"
                :value="i.siteID"
                v-for="i in siteList "
                :key="i.siteID">
              </el-option>
            </el-select>
          </el-form-item>
<!--          <el-form-item >-->
<!--            <span slot="label" style="" @click="getBaseList(18)"><a herf="#">{{buttons.site||'工厂'}}</a></span>-->
<!--            <el-input v-model="dataForm.site" style="width: 150px;" placeholder="工厂"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item :label="buttons.language||'语言'" prop="languageDefault">-->
<!--            <el-select filterable v-model="dataForm.languageDefault" clearable style="width: 150px;">-->
<!--              <el-option :label="item.languageName" :value="item.languageCode" v-for="(item,index) in languageList "-->
<!--                         :key="index"></el-option>-->
<!--            </el-select>-->
<!--          </el-form-item>-->
          <el-form-item :label="'BU'">
            <el-select v-model="dataForm.buNo" clearable style="width: 150px;" placeholder="请选择">
              <el-option
                :label="i.buNo + '-' + i.buDesc"
                :value="i.buNo"
                v-for="i in buList "
                :key="i.buNo">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="buttons.department||'部门'" prop="department">
            <el-select v-model="dataForm.departmentNo" clearable style="width: 150px;" placeholder="请选择">
              <el-option
                :label="i.departmentNo + '-' + i.departmentName"
                :value="i.departmentNo"
                v-for="i in departmentList "
                :key="i.departmentNo">
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
        <el-form>
          <el-form-item :label="buttons.post||'岗位'" prop="post">
            <el-select v-model="dataForm.postNo" clearable style="width: 150px;" placeholder="请选择">
              <el-option
                :label="i.postNo + '-' + i.postName"
                :value="i.postNo"
                v-for="i in postList "
                :key="i.postNo">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="角色" size="mini" prop="roleIdList">
            <el-checkbox-group v-model="dataForm.roleIdList">
              <el-checkbox v-for="role in roleList" :key="role.roleId" :label="role.roleId">{{
                  role.roleName
                }}
              </el-checkbox>
            </el-checkbox-group>
          </el-form-item>
          <el-form-item label="状态" size="mini" prop="status">
            <el-radio-group v-model="dataForm.status">
              <el-radio :label="0">{{buttons.disable||'禁用'}}</el-radio>
              <el-radio :label="1">{{buttons.normal||'正常'}}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-form>
      </el-form>
      <span slot="footer" class="dialog-footer">
         <el-button type="primary" @click="dataFormSubmit()">{{buttons.submit||'确定'}}</el-button>
         <el-button type="primary" @click="visible = false">{{buttons.close||'取消'}}</el-button>
    </span>
    </el-dialog>

    <Chooselist ref="baseList"  @getBaseData="getBaseData"></Chooselist>
  </div>

</template>

<script>
  import Chooselist from '@/views/modules/common/Chooselist'
import {getFactory} from "@/api/factory";
import {searchSysLanguage} from "@/api/sysLanguage.js"
  import {
    searchFunctionButtonList,
  } from "@/api/sysLanguage.js"
  import {getBUList, getDepartmentList, getPostList, getSiteList} from '../../../api/base/site'
export default {
  components: {
    Chooselist
  },
  data() {
    return {
      tagNo:'',
      visible: false,
      roleList: [],
      factorys: [],
      languageList: [],
      siteList:[],
      buList:[],
      departmentList:[],
      postList:[],
      dataForm: {
        id: 0,
        userName: '',
        password: '',
        comfirmPassword: '',
        languageDefault: '',
        salt: '',
        email: '',
        mobile: '',
        buNo: '',
        buDesc: '',
        department:'',
        departmentNo:'',
        departmentName:'',
        post:'',
        postNo:'',
        postName:'',
        roleIdList: [],
        status: 1,
        site: '',
        siteID: '',
        bu:'',
        siteName:'',
        userDisplay: ''
      },
      buttons: {
        add: '添加',
        edit: '编辑',
        username: '用户账号',
        userDisplay: '用户名',
        email: '邮箱',
        mobile: '手机号',
        bu:'BU',
        department:'部门',
        post:'岗位',
        status: '状态',
        disable: '禁用',
        normal: '正常',
        password:'密码',
        comfirmPassword:'确认密码',
        submit: '确定',
        close: '取消',
        siteID: '工厂',
        siteName:'工厂名称',
        language: '语言',
      },
    }
  },
  methods: {
    getSiteList () {
      getSiteList().then(({data}) => {
        this.siteList = data.rows
        // let list = data.rows.map(item=>{
        //   return {
        //     site:item.siteID,
        //     siteName:item.siteName
        //   }
        // })
        // console.log(list)
      })
    },
    getBUDepartmentPostList () {
      let tempData ={
        site:this.dataForm.siteID
      }
      this.dataForm.buNo = ''
      this.dataForm.buDesc = ''
      this.dataForm.departmentNo = ''
      this.dataForm.departmentName = ''
      this.dataForm.postNo = ''
      this.dataForm.postName = ''
      getBUList(tempData).then(({data}) => {
        this.buList = data.rows
        this.dataForm.buDesc = data.rows.buDesc
      })
      getDepartmentList(tempData).then(({data}) => {
        this.departmentList = data.rows
        this.dataForm.departmentName = data.rows.departmentName
      })
      getPostList(tempData).then(({data}) => {
        this.postList = data.rows
        this.dataForm.postName = data.rows.postName
      })
    },
    getBDPList () {
      let tempData ={
        site:this.dataForm.siteID
      }
      getBUList(tempData).then(({data}) => {
        this.buList = data.rows
        this.dataForm.buDesc = data.rows.buDesc
      })
      getDepartmentList(tempData).then(({data}) => {
        this.departmentList = data.rows
        this.dataForm.departmentName = data.rows.departmentName
      })
      getPostList(tempData).then(({data}) => {
        this.postList = data.rows
        this.dataForm.postName = data.rows.postName
      })
    },
    getFunctionButtonList() {
      let queryButton = {
        functionId: this.$route.meta.menuId,
        tableId: '*',
        languageCode: this.$i18n.locale,
        objectType: 'button'
      }
      searchFunctionButtonList(queryButton).then(({data}) => {
        if (data.code == 0 && data.data) {
          this.buttons = data.data
        }
      })
    },
    getBaseData(val){
      if (this.tagNo === 18){
        this.dataForm.site = val.SiteID
      }
    },
    // 获取基础数据列表
    getBaseList(val){
      this.tagNo = val
      this.$nextTick(() => {
        let strVal = "";
        if (val === 18){
          strVal = this.dataForm.site
        }
        this.$refs.baseList.init(val,strVal)
      })
    },
    // 获取多语言列表
    getLanguageList() {
      let queryLanguage = { languageCode: this.$i18n.locale}
      searchSysLanguage(queryLanguage).then(({data}) => {
        this.languageList = data.rows
      })
    },


    init(id) {
      this.dataForm.id = id || 0
      // this.factoryList();
      this.getLanguageList();
      this.$http({
        url: this.$http.adornUrl('/sys/role/select'),
        method: 'get',
        params: this.$http.adornParams()
      }).then(({data}) => {
        this.roleList = data && data.code === 0 ? data.list : []
      }).then(() => {
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
        })
      }).then(() => {
        if (this.dataForm.id) {
          this.$http({
            url: this.$http.adornUrl(`/sys/user/info/${this.dataForm.id}`),
            method: 'get',
            params: this.$http.adornParams()
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.dataForm.userName = data.user.username
              this.dataForm.salt = data.user.salt
              this.dataForm.email = data.user.email
              this.dataForm.mobile = data.user.mobile
              this.dataForm.roleIdList = data.user.roleIdList
              this.dataForm.status = data.user.status
              this.dataForm.languageDefault = data.user.languageDefault
              this.dataForm.userDisplay = data.user.userDisplay
              this.dataForm.siteID = data.user.site
              this.dataForm.buNo = data.user.buNo
              this.dataForm.buDesc = data.user.buDesc
              this.dataForm.department = data.user.department
              this.dataForm.departmentNo = data.user.departmentNo
              this.dataForm.departmentName = data.user.departmentName
              this.dataForm.post = data.user.post
              this.dataForm.postNo = data.user.postNo
              this.getBDPList()
            }
          })
        } else {
          this.dataForm = {
            buNo: '',
            buDesc: '',
            userName: '',
            password: '',
            comfirmPassword: '',
            languageDefault: '',
            salt: '',
            email: '',
            mobile: '',
            bu:'',
            department:'',
            departmentNo:'',
            departmentName:'',
            post:'',
            postNo:'',
            postName:'',
            roleIdList: [],
            status: 1,
            site: '',
            siteID: '',
            siteName:'',
            userDisplay: ''
          }
        }
      })
    },
    // 表单提交
    dataFormSubmit() {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          this.$http({
            url: this.$http.adornUrl(`/sys/user/${!this.dataForm.id ? 'save' : 'update'}`),
            method: 'post',
            data: this.$http.adornData({
              'userId': this.dataForm.id || undefined,
              'username': this.dataForm.userName,
              'password': this.dataForm.password,
              'salt': this.dataForm.salt,
              'email': this.dataForm.email,
              'mobile': this.dataForm.mobile,
              'status': this.dataForm.status,
              'roleIdList': this.dataForm.roleIdList,
              'languageDefault': this.dataForm.languageDefault,
              'site': this.dataForm.siteID,
              'userDisplay': this.dataForm.userDisplay,
              'buNo': this.dataForm.buNo,
              'departmentNo': this.dataForm.departmentNo,
              'postNo': this.dataForm.postNo,
            })
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.$message.success( '操作成功')
              this.visible = false
              this.$emit('refreshDataList')
            } else {
              this.$message.error(data.msg)
            }
          })
        }
      })
    },
    // 关闭弹窗
    closeDataDialog() {
      this.dataForm = {
        buNo: '',
        buDesc: '',
        userName: '',
        password: '',
        comfirmPassword: '',
        languageDefault: '',
        salt: '',
        email: '',
        mobile: '',
        bu:'',
        department:'',
        departmentNo:'',
        departmentName:'',
        post:'',
        postNo:'',
        postName:'',
        roleIdList: [],
        status: 1,
        site: '',
        siteID: '',
        siteName:'',
        userDisplay: ''
      }
    }
  },
  created() {
    this.getFunctionButtonList()
    this.getSiteList()
  }
}
</script>
<style lang="scss" scoped>

</style>