k94314517
2024-10-16 17efddc6a667670dca682bf36b51a43e99615e6d
admin/src/components/business/OperaMemberWindow.vue
@@ -1,63 +1,77 @@
<template>
    <GlobalWindow
        :title="title"
        width="60%"
        :visible.sync="visible"
        :confirm-working="isWorking"
        @confirm="confirm"
    >
        <el-form :model="form" ref="form" :rules="rules">
            <el-form-item label="姓名" prop="name">
                <el-input v-model="form.name" placeholder="请输入姓名" v-trim/>
            </el-form-item>
            <el-form-item label="所属组织" prop="companyId">
              <el-cascader
                  v-model="form.company"
                  :options="department"
                  @change="handleChangeCompany"
                  :show-all-levels="false"
                  clearable
                  :props="departprops"
              ></el-cascader>
            </el-form-item>
            <el-form-item label="手机号" prop="phone">
                <el-input v-model="form.phone" placeholder="请输入手机号" v-trim/>
              <div style="color: #F56C6C;font-size: 12px">(注:员工手机号将作为平台登录账号,初始密码为系统默认密码配置项)</div>
            </el-form-item>
            <el-form-item label="身份证号" prop="idcardNo" v-if="form.id ==null">
                <el-input v-model="form.idcardNo" placeholder="请输入身份证号" v-trim/>
            </el-form-item>
            <el-form-item label="修改身份证号" prop="idcardNoNew" v-if="form.id !=null">
                <el-input v-model="form.idcardNoNew" placeholder="可修改身份证号" v-trim/>
              <div style="font-size: 12px" v-if="form.id !=null">
                (注:当前身份证号为<span style="color: #F56C6C">【{{form.idcardDecode}}】</span>,如需修改,请在输入栏填写新的身份证号!)
              </div>
            </el-form-item>
            <el-form-item label="工号" prop="code">
                <el-input v-model="form.code" placeholder="请输入员工工号" v-trim/>
            </el-form-item>
          <el-form-item label="人脸照片" prop="faceImgFull" >
            <UploadAvatarImage
                :file="{ 'imgurlfull': form.faceImgFull, 'imgurl': form.faceImg }"
                :uploadData="uploadData"
                @uploadSuccess="uploadAvatarSuccess"
                @uploadEnd="isUploading = false"
                @uploadBegin="isUploading = true"
            />
          </el-form-item>
</el-form>
</GlobalWindow>
  <GlobalWindow :title="title" width="60%" :visible.sync="visible" :confirm-working="isWorking" @confirm="confirm">
    <el-form :model="form" ref="form" :rules="rules">
      <el-form-item label="姓名" prop="name">
        <el-input v-model="form.name" placeholder="请输入姓名" v-trim />
      </el-form-item>
      <el-form-item label="所属组织" prop="companyId">
        <el-cascader v-model="form.company" :options="department" @change="handleChangeCompany" :show-all-levels="false"
          clearable filterable :props="departprops"></el-cascader>
        <div style="font-size: 12px;color: #F56C6C">
          注:仅支持选择 【{{ companyType === 0 ? '相关方组织' : '内部组织' }}】
        </div>
      </el-form-item>
      <el-form-item label="选择岗位:" prop="positionId" >
        <el-select v-model="form.positionId" clearable filterable placeholder="请选择">
          <el-option v-for="item in positionList" :key="item.id" :label="item.name" :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="手机号" prop="phone">
        <el-input v-model="form.phone" placeholder="请输入手机号" v-trim />
        <div style="color: #F56C6C;font-size: 12px">注:员工手机号将作为平台登录账号,初始密码为系统默认密码配置项</div>
      </el-form-item>
      <el-form-item label="身份证号" v-if="form.id == null">
        <el-input v-model="form.idcardNo" placeholder="请输入身份证号" v-trim />
      </el-form-item>
      <el-form-item label="修改身份证号" v-if="form.id != null">
        <el-input v-model="form.idcardNoNew" placeholder="可修改身份证号" v-trim />
        <div style="font-size: 12px" v-if="form.id != null">
          注:当前身份证号为<span style="color: #F56C6C">【{{ form.idcardDecode }}】</span>,如需修改,请在输入栏填写新的身份证号!
        </div>
      </el-form-item>
      <el-form-item label="工号" prop="code">
        <el-input v-model="form.code" placeholder="请输入员工工号" v-trim />
      </el-form-item>
      <el-form-item label="入职日期" prop="jobDate">
        <el-date-picker
            v-model="form.jobDate"
            value-format="yyyy-MM-dd"
            type="date">
        </el-date-picker>
      </el-form-item>
        <el-form-item label="是否党员" prop="isDangyuan">
          <el-radio-group v-model="form.isDangyuan" >
            <el-radio :label="0">非党员</el-radio>
            <el-radio :label="1">党员</el-radio>
          </el-radio-group>
        </el-form-item>
      <el-form-item label="人脸照片" prop="faceImgFull">
        <div class="upload_wrap">
          <UploadFaceImg :file="{ 'imgurlfull': form.faceImgFull, 'imgurl': form.faceImg }" :uploadData="uploadData"
            @uploadSuccess="uploadAvatarSuccess" @uploadEnd="isUploading = false" @uploadBegin="isUploading = true" />
          <div class="content">
            <div>1、请选择浅色或中性背景,使用均匀光线拍照。</div>
            <div>2、请保持面部正对镜头,勿遮挡面部,保持中立表情。</div>
            <div>3、请避免后期修图,确保人脸轮廓清晰、完整,尽可能减少非脸部内容占比。</div>
          </div>
        </div>
      </el-form-item>
    </el-form>
  </GlobalWindow>
</template>
<script>
import BaseOpera from '@/components/base/BaseOpera'
import GlobalWindow from '@/components/common/GlobalWindow'
import UploadAvatarImage from '@/components/common/UploadAvatarImage'
import {checkMobile, validIdCardNo, validIdCardNoNew} from '@/utils/form'
import UploadFaceImg from '@/components/common/UploadFaceImg'
import { checkMobile, validIdCardNo, validIdCardNoNew } from '@/utils/form'
import { allList   } from '@/api/business/position'
export default {
  name: 'OperaCompanyWindow',
  extends: BaseOpera,
  components: { GlobalWindow, UploadAvatarImage },
  components: { GlobalWindow, UploadAvatarImage, UploadFaceImg },
  data () {
    return {
      uploadData: {
@@ -68,7 +82,9 @@
        value: 'id',
        checkStrictly: true
      },
      companyType: 0,
      department: [],
      positionList: [],
      // 表单数据
      form: {
        id: null,
@@ -84,6 +100,9 @@
        idcardType: 0,
        phone: '',
        faceImg: '',
        jobDate: null,
        isDangyuan: 0,
        positionId: null,
        faceImgFull: ''
      },
      // 验证规则
@@ -113,10 +132,12 @@
     * @title 窗口标题
     * @target 编辑的对象
     */
    open (title, target, depart) {
    open (title, target, depart, companyType) {
      this.title = title
      this.department = depart
      this.visible = true
      this.companyType = companyType
      this.getPositionList()
      // 新建
      if (target == null) {
        this.$nextTick(() => {
@@ -133,7 +154,7 @@
          this.form[key] = target[key]
          this.form.idcardNo = ''
        }
        this.form.company =[]
        this.form.company = []
        if (target.companyId && target.companyPath) {
          var array = target.companyPath.split('/')
          array.forEach(item => {
@@ -142,8 +163,13 @@
            }
          })
        }
        console.log(that.form.company)
      })
    },
    getPositionList () {
      allList({})
        .then(res => {
          this.positionList = res
        })
    },
    // 上传图片
    uploadAvatarSuccess (file) {
@@ -153,3 +179,27 @@
  }
}
</script>
<style lang="scss" scoped>
.upload_wrap{
  display: flex;
  align-items: center;
  .avatar-uploader{
    display: flex;
    align-items: center;
    justify-content: center;
  }
  ::v-deep .avatar{
    max-width: 90px;
    max-height: 90px;
  }
  .content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 12px;
    color: #999999;
    margin-left: 12px;
    line-height: 24px;
  }
}
</style>