用户上传头像部门添加字段

4 years ago · 4132518cd8
3 changed files with 178 additions and 9 deletions
--- a/src/views/modules/sys/dept-add-or-update.vue
+++ b/src/views/modules/sys/dept-add-or-update.vue
@ -61,6 +61,24 @@
          </el-option>
        </el-select>
      </el-form-item>
+      <el-form-item prop="mobile"
+                    label="联系方式">
+        <el-input v-model="dataForm.mobile"
+                  placeholder="请输入联系方式"
+                  style="width:200px"></el-input>
+      </el-form-item>
+      <el-form-item prop="longitude"
+                    label="经度">
+        <el-input v-model="dataForm.longitude"
+                  placeholder="经度"
+                  style="width:200px"></el-input>
+      </el-form-item>
+      <el-form-item prop="latitude"
+                    label="纬度">
+        <el-input v-model="dataForm.latitude"
+                  placeholder="纬度"
+                  style="width:200px"></el-input>
+      </el-form-item>
      <el-form-item prop="sort"
                    :label="$t('dept.sort')">
        <el-input-number v-model="dataForm.sort"
@ -69,6 +87,13 @@
                         :label="$t('dept.sort')"
                         style="width:200px"></el-input-number>
      </el-form-item>
+      <el-form-item prop="address"
+                    label="地址">
+        <el-input v-model="dataForm.address"
+                  maxlength="200"
+                  show-word-limit
+                  placeholder="请输入地址"></el-input>
+      </el-form-item>
    </el-form>
    <template slot="footer">
      <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
@ -94,7 +119,11 @@ export default {
        sort: 0,
        typeKey: '',
        typeName: '',
-        partyCode: ''
+        partyCode: '',
+        mobile:'',
+        longitude:'',
+        latitude:'',
+        address:''
      },
      secondOrgDictList: []
    }
--- a/src/views/modules/sys/user-add-or-update.vue
+++ b/src/views/modules/sys/user-add-or-update.vue
@ -115,6 +115,23 @@
          <el-radio :label="1">{{ $t('user.status1') }}</el-radio>
        </el-radio-group>
      </el-form-item>
+      <el-form-item label="照片"
+                    v-loading="loading"
+                    prop="headUrl">
+        <el-upload class="avatar-uploader"
+                   :action="uploadUrl"
+                   :show-file-list="false"
+                   :on-success="handleAvatarSuccess"
+                   :before-upload="beforeAvatarUpload">
+          <img v-if="dataForm.headUrl"
+               :src="dataForm.headUrl"
+               class="avatar">
+          <i v-else
+             class="el-icon-plus avatar-uploader-icon"></i>
+          <div slot="tip"
+               class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+        </el-upload>
+      </el-form-item>
    </el-form>
    <template slot="footer">
      <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
@ -128,6 +145,7 @@
 <script>
 import debounce from 'lodash/debounce'
 import { isEmail, isMobile } from '@/utils/validate'
+import Cookies from 'js-cookie'
 export default {
  data () {
    return {
@ -151,7 +169,9 @@ export default {
        status: 1,
        userTagKey: ''
      },
-      userTagDictList: []
+      userTagDictList: [],
+      uploadUrl: '',
+      loading: false,
    }
  },
  computed: {
@ -213,6 +233,11 @@ export default {
      }
    }
  },
+  created () {
+    this.$nextTick(() => {
+      this.uploadUrl = `${window.SITE_CONFIG['apiURL']}/oss/file/upload?token=${Cookies.get('token')}`
+    })
+  },
  methods: {
    init () {
      this.visible = true
@ -230,6 +255,14 @@ export default {
      })
      this.getUserTagDicList()
    },
+    // 上传图片
+    handleAvatarSuccess (res, file) {
+      this.loading = false
+      this.dataForm.headUrl = res.data.url
+    },
+    beforeAvatarUpload (file) {
+      this.loading = true
+    },
    // 获取部门列表
    getDeptList () {
      return this.$http.get('/sys/dept/list').then(({ data: res }) => {
@ -346,5 +379,28 @@ export default {
      background:#f5f7fa;
    }
 }
+.avatar-uploader .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+.avatar-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 178px;
+  height: 178px;
+  line-height: 178px;
+  text-align: center;
+}
+.avatar {
+  width: 178px;
+  height: 178px;
+  display: block;
+}
 </style>

--- a/src/views/modules/user/partymembers-add-or-update.vue
+++ b/src/views/modules/user/partymembers-add-or-update.vue
@ -3,6 +3,7 @@
             :title="!dataForm.id ? $t('add') : $t('update')"
             :close-on-click-modal="false"
             :close-on-press-escape="false"
+             width="700px"
             customClass="customWidth">
    <el-form :model="dataForm"
             :rules="dataRule"
@ -10,17 +11,17 @@
             @keyup.enter.native="dataFormSubmitHandle()"
             :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'">
      <el-form-item label="姓名"
-                    prop="realName">
+                    prop="realName" label-width="120px">
        <el-input v-model="dataForm.realName"
                  placeholder="姓名" style="width:90%;" maxlength="10"></el-input>
      </el-form-item>
      <el-form-item label="手机号"
-                    prop="mobile">
+                    prop="mobile" label-width="120px">
        <el-input v-model="dataForm.mobile"
                  placeholder="手机号" style="width:90%;"></el-input>
      </el-form-item>
      <el-form-item label="身份证号"
-                    prop="identityNo">
+                    prop="identityNo" label-width="120px">
        <el-input v-model="dataForm.identityNo"
                  placeholder="身份证号" style="width:90%;"></el-input>
      </el-form-item>
@ -37,7 +38,7 @@
          </el-option>
        </el-select>
      </el-form-item> -->
-      <el-form-item label="所属网格">
+      <el-form-item label="所属网格" label-width="120px">
        <el-cascader v-model="dataForm.allDeptIds"
                     :options="options"
                     clearable></el-cascader>
@ -65,7 +66,7 @@
          </el-option>
        </el-select>
      </el-form-item> -->
-      <el-form-item label="干部下沉">
+      <el-form-item label="干部下沉" label-width="120px">
        <el-select v-model="dataForm.cadreFlag"
                   placeholder="请选择">
          <el-option v-for="item in cadreOptions"
@ -82,6 +83,52 @@
                       :label="item.id">{{item.tagName}}</el-checkbox>
        </el-checkbox-group>
      </el-form-item> -->
+      <el-form-item label="入党时间" prop="joinDate" label-width="120px">
+        <el-date-picker
+                v-model="dataForm.joinDate"
+                type="date"
+                placeholder="入党时间"
+                label-width="150px"
+                value-format="yyyy-MM-dd"
+                format="yyyy-MM-dd"
+                style="width:200px">
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="职务" prop="position" label-width="120px">
+        <el-select v-model="dataForm.position" clearable placeholder="职务">
+          <el-option v-for="item in positionList" :key="item.dictValue" :label="item.dictName" :value="item.dictValue">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="文化程度" prop="education" label-width="120px">
+        <el-select v-model="dataForm.education"  clearable placeholder="文化程度">
+          <el-option v-for="item in educationList" @click.native="changeEducationList(item.dictName)" :key="item.dictValue" :label="item.dictName" :value="item.dictValue">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="是否流动党员" prop="isMobility" label-width="120px">
+        <el-select v-model="dataForm.isMobility" clearable placeholder="是否流动党员">
+          <el-option v-for="item in isMobilityList" :key="item.dictValue" :label="item.dictName" :value="item.dictValue">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="流动党员证号"
+                    prop="mobilityNum" label-width="120px">
+        <el-input v-model="dataForm.mobilityNum"
+                  placeholder="流动党员证号" style="width:90%;"></el-input>
+      </el-form-item>
+      <el-form-item label="地址"
+                    prop="address" label-width="120px">
+        <el-input v-model="dataForm.address"
+                  placeholder="地址" style="width:90%;" maxlength="200"
+                  show-word-limit></el-input>
+      </el-form-item>
+      <el-form-item label="备注"
+                    prop="note" label-width="120px">
+        <el-input v-model="dataForm.note"
+                  placeholder="备注" style="width:90%;" maxlength="200"
+                  show-word-limit></el-input>
+      </el-form-item>
    </el-form>
    <template slot="footer">
      <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
@ -105,14 +152,28 @@ export default {
        cadreFlag: '',
        gridId: '',
        tagIds: [],
-        allDeptIds: []
+        allDeptIds: [],
+        joinDate:'',
+        position:'',
+        positionName:'',
+        isMobility:'',
+        mobilityNum:'',
+        education:'',
+        note:'',
+        address:''
      },
      streetOptions: [],
      communityOptions: [],
      gridOptions: [],
      cadreOptions: [{ cadreFlag: '1', cadreTitle: '是' }, { cadreFlag: '0', cadreTitle: '否' }],
      tagOptions: [],
-      options: []
+      options: [],
+      positionList:[],
+      educationList:[],
+      isMobilityList:[
+        {dictValue: '0', dictName: '否'},
+        {dictValue: '1', dictName: '是'},
+      ]
    }
  },
  watch: {
@ -145,6 +206,8 @@ export default {
      // this.getStreetList()
      this.getTagOptions()
      this.getByLoginUser()
+      this.getPositionListInfo()
+      this.geEducationListInfo()
      this.visible = true
      this.$nextTick(() => {
        this.$refs['dataForm'].resetFields()
@ -157,6 +220,27 @@ export default {
        }
      })
    },
+    changeEducationList(val){
+      this.dataForm.positionName = val
+    },
+    // 职务
+    getPositionListInfo () {
+      this.$http.get(`/sys/dict/listSimple/party_member_position`).then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.positionList = res.data
+      }).catch(() => {})
+    },
+    // 文化程度
+    geEducationListInfo () {
+      this.$http.get(`/sys/dict/listSimple/party_memeber_education`).then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.educationList = res.data
+      }).catch(() => {})
+    },
    getByLoginUser () {
      this.$http
        .get(`/sys/dept/party/getDeptTree`)