1

lzhe

2024-04-08 198a9047f9481e3bebe6d18d03bde4e167d916ec

1

 src/views/master/person/main/personPerson.vue

@@ -2,7 +2,7 @@
 * @Author: lzhe lzhe@example.com
 * @Date: 2024-03-26 10:28:33
 * @LastEditors: lzhe lzhe@example.com
 * @LastEditTime: 2024-03-28 18:18:33
 * @LastEditTime: 2024-04-08 11:03:11
 * @FilePath: /smart-web/src/views/master/person/main/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
@@ -24,24 +24,12 @@
            <div class="right-top">
                <div class="right-title">部门：千文科技</div>
                <div>
                    <el-select v-model="input3" placeholder="状态" class="searchStatus">
                        <el-option
                            v-for="item in options"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                            size="small"
                        />
                    <el-select v-model="searchData.status" placeholder="状态" class="searchStatus">
                        <el-option v-for="item in statusList" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" size="small"/>
                    </el-select>
                    <el-input
                        v-model="input3"
                        style="width: 200px"
                        size="small"
                        placeholder="请输入关键字进行过滤"
                        class="input-with-select"
                        >
                    <el-input v-model="searchData.keywords" style="width: 200px" size="small" placeholder="请输入关键字进行过滤">
                        <template #append>
                            <el-button :icon="Search" />
                            <el-button :icon="searchIcon" @click="searchPerson" />
                        </template>
                    </el-input>
                </div>
@@ -52,58 +40,41 @@
                <el-button type="danger" plain @click="delPerson">删除</el-button>
            </div>
            <div class="right-table">
                <el-table
                    ref="multipleTableRef"
                    :data="tableData"
                    border
                    style="width: 100%"
                    class="multipleTableRef"
                    @selection-change="handleSelectionChange"
                >
                <el-table ref="multipleTableRef" :data="tableData" border style="width: 100%" class="multipleTableRef" @selection-change="handleSelectionChange">
                    <el-table-column type="selection" width="55" />
                    <el-table-column
                    prop="date"
                    label="张三"
                    width="150">
                    <el-table-column prop="name" label="姓名" width="150"></el-table-column>
                    <el-table-column prop="jobNumber" label="工号" width="150"></el-table-column>
                    <el-table-column label="关联账号" width="120">
                        <template #default="scope">
                            <span>{{scope.row.account?scope.row.account:'-'}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column
                    prop="name"
                    label="关联账号"
                    width="120">
                    <el-table-column label="部门" width="120">
                        <template #default="scope">
                            <span>{{scope.row.organizationName?scope.row.organizationName:'-'}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column
                    prop="province"
                    label="部门"
                    width="120">
                    <el-table-column label="岗位" width="120">
                        <template #default="scope">
                            <span>{{scope.row.postName?scope.row.postName:'-'}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column
                    prop="city"
                    label="岗位"
                    width="120">
                    <el-table-column label="邮箱" width="120">
                        <template #default="scope">
                            <span>{{scope.row.email?scope.row.email:'-'}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column
                    prop="address"
                    label="邮箱"
                    width="300">
                    <el-table-column prop="tel" label="手机号" width="120"></el-table-column>
                    <el-table-column prop="tel" label="状态" width="120">
                        <template #default="scope">
                            <span>{{scope.row.status == "1"?"在职":'离职'}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column
                    prop="zip"
                    label="手机号"
                    width="120">
                    </el-table-column>
                    <el-table-column
                    prop="zip"
                    label="状态"
                    width="120">
                    </el-table-column>
                    <el-table-column
                    fixed="right"
                    label="操作"
                    width="140">
                    <template #default="scope">
                        <el-button type="text" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
                        <el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
                    </template>
                    <el-table-column fixed="right" label="操作" width="140">
                        <template #default="scope">
                            <el-button type="text" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
                            <el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination
@@ -142,9 +113,19 @@
<script>
    import saveDialog from './save'
    export default {
        name: "bakalaka",
        name: "personPerson",
        data(){
            return {
                searchIcon: "el-icon-search",
                searchData: {
                    current: 1,
                    size: 15,
                    total: 0,
                    status: "1",
                    keywords: "",
                    postId: "",
                    organizationCode: "00001"
                },
                isSaveing: false,
                groups: [],
                departmentFrom: {
@@ -161,52 +142,41 @@
                },
                leftActive: true,
                input: '',
                options: [{
                    value: '选项1',
                    label: '黄金糕'
                }],
                statusList: [],
                input3: '',
                tableData: [{
                    date: '2016-05-02',
                    name: '王小虎',
                    province: '上海',
                    city: '普陀区',
                    address: '上海市普陀区金沙江路 1518 弄',
                    zip: 200333
                    }, {
                    date: '2016-05-04',
                    name: '王小虎',
                    province: '上海',
                    city: '普陀区',
                    address: '上海市普陀区金沙江路 1517 弄',
                    zip: 200333
                    }, {
                    date: '2016-05-01',
                    name: '王小虎',
                    province: '上海',
                    city: '普陀区',
                    address: '上海市普陀区金沙江路 1519 弄',
                    zip: 200333
                    }, {
                    date: '2016-05-03',
                    name: '王小虎',
                    province: '上海',
                    city: '普陀区',
                    address: '上海市普陀区金沙江路 1516 弄',
                    zip: 200333
                }]
                tableData: []
            }
        },
        created(){
            
        },
        mounted(){
			
            this.getStatus();
            this.searchPerson(); //员工列表
        },
        components: {
            saveDialog
        },
        methods: {
            searchPerson() {
                this.$HTTP.get(`/api/blade-cps/employee/list?`+this.$TOOL.qsStringify(this.searchData)).then(res=> {
                    if(res.code == 200) {
                        res.data.records.forEach(item=> {
                            if(item.dictValue == "在职") {
                                this.searchData.status = item.dictKey;
                            }
                        })
                        this.tableData = res.data.records;
                    }
                })
            },
            getStatus() {  //获取全部账号
                this.$HTTP.get(`/api/blade-system/dict/dictionary?code=employee_status`).then(res=> {
                    if(res.code == 200) {
                        this.statusList = res.data;
                    }
                })
            },
            departmentSubmit() {
                this.departmentVisible=false;  //部门调整
            },

 src/views/master/person/main/save.vue

@@ -1,84 +1,79 @@
<template>
    <el-dialog :title="titleMap[mode]" v-model="visible" :width="800" destroy-on-close @closed="$emit('closed')">
        <el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="dialogForm" label-width="120px" label-position="center">
        <el-form :model="addPersonForm" :rules="rules" :disabled="mode=='show'" ref="dialogForm" label-width="120px" label-position="center">
            <el-row>
                <el-col :span="24">
                    <el-form-item label="头像" prop="avatar">
                        <sc-upload v-model="form.avatar" title="上传头像"></sc-upload>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="工号" prop="userName">
                        <el-input v-model="form.userName" placeholder="用于登录系统" clearable></el-input>
                    <el-form-item label="工号" prop="jobNumber">
                        <el-input v-model="addPersonForm.jobNumber" placeholder="工号" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="姓名" prop="name">
                        <el-input v-model="form.name" placeholder="请输入完整的真实姓名" clearable></el-input>
                        <el-input v-model="addPersonForm.name" placeholder="姓名" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="手机号" prop="name">
                        <el-input v-model="form.name" placeholder="请输入手机号" clearable></el-input>
                    <el-form-item label="手机号" prop="tel">
                        <el-input v-model="addPersonForm.tel" placeholder="手机号" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="状态" prop="name">
                        <el-select v-model="form.group" multiple filterable style="width: 100%">
                    <el-form-item label="状态" prop="status">
                        <el-select v-model="addPersonForm.status" placeholder="状态" class="searchStatus">
                            <el-option v-for="item in statusList" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" size="small"/>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="岗位">
                        <el-select v-model="addPersonForm.postId" style="width: 100%">
                            <el-option v-for="item in groups" :key="item.id" :label="item.label" :value="item.id"/>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="岗位" prop="dept">
                        <el-select v-model="form.group" multiple filterable style="width: 100%">
                    <el-form-item label="邮箱">
                        <el-input v-model="addPersonForm.email" placeholder="邮箱" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="部门">
                        <el-select v-model="addPersonForm.organizationId" multiple filterable style="width: 100%" placeholder="部门">
                            <el-option v-for="item in groups" :key="item.id" :label="item.label" :value="item.id"/>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="邮箱" prop="name">
                        <el-input v-model="form.name" placeholder="请输入邮箱" clearable></el-input>
                    <el-form-item label="PIN码">
                        <el-input v-model="addPersonForm.pinCode" placeholder="PIN码" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="部门" prop="dept">
                        <el-select v-model="form.group" multiple filterable style="width: 100%">
                            <el-option v-for="item in groups" :key="item.id" :label="item.label" :value="item.id"/>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="PIN码" prop="name">
                        <el-input v-model="form.name" placeholder="请输入PIN码" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="入职时间" prop="name">
                    <el-form-item label="入职时间">
                        <el-date-picker
                            style="width: 100%;"
                            v-model="value1"
                            v-model="addPersonForm.hireDate"
                            type="date"
                            placeholder="Pick a day"
                            placeholder="入职时间"
                            :size="size"
                        />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="关联账号" prop="name">
                        <el-input v-model="form.name" placeholder="请输入关联账号" clearable></el-input>
                    <el-form-item label="关联账号">
                        <el-input v-model="form.jobNumber" placeholder="请输入关联账号" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="数据权限配置" prop="name">
                        <el-input v-model="form.name" placeholder="请输入数据权限配置" clearable></el-input>
                    <el-form-item label="数据权限配置">
                        <el-input v-model="form.deptId" placeholder="请输入数据权限配置" clearable></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <template #footer>
            <el-button @click="visible=false" >取 消</el-button>
            <el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
            <el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="saveSubmit()">保 存</el-button>
        </template>
    </el-dialog>
</template>
@@ -88,6 +83,7 @@
        emits: ['success', 'closed'],
        data() {
            return {
                statusList: [],
                mode: "add",
                titleMap: {
                    add: '添加员工',
@@ -97,46 +93,23 @@
                visible: false,
                isSaveing: false,
                //表单数据
                form: {
                    id:"",
                    userName: "",
                    avatar: "",
                addPersonForm: {
                    jobNumber: "",
                    name: "",
                    dept: "",
                    group: []
                    tel: "",
                    status: "",
                    postId: "",
                    email: "",
                    organizationId: "",
                    pinCode: "",
                    hireDate: "",
                    jobNumber: "",
                    deptId: ""
                },
                //验证规则
                rules: {
                    avatar:[
                        {required: true, message: '请上传头像'}
                    ],
                    userName: [
                        {required: true, message: '请输入登录账号'}
                    ],
                    name: [
                        {required: true, message: '请输入真实姓名'}
                    ],
                    password: [
                        {required: true, message: '请输入登录密码'},
                        {validator: (rule, value, callback) => {
                            if (this.form.password2 !== '') {
                                this.$refs.dialogForm.validateField('password2');
                            }
                            callback();
                        }}
                    ],
                    password2: [
                        {required: true, message: '请再次输入密码'},
                        {validator: (rule, value, callback) => {
                            if (value !== this.form.password) {
                                callback(new Error('两次输入密码不一致!'));
                            }else{
                                callback();
                            }
                        }}
                    ],
                    dept: [
                        {required: true, message: '请选择所属部门'}
                    ],
                    group: [
                        {required: true, message: '请选择所属角色', trigger: 'change'}
@@ -157,10 +130,17 @@
            }
        },
        mounted() {
            // this.getGroup()
            this.getStatus();
            // this.getDept()
        },
        methods: {
            getStatus() {  //获取全部账号
                this.$HTTP.get(`/api/blade-system/dict/dictionary?code=employee_status`).then(res=> {
                    if(res.code == 200) {
                        this.statusList = res.data;
                    }
                })
            },
            //显示
            open(mode='add'){
                this.mode = mode;
@@ -177,19 +157,21 @@
                this.depts = res.data;
            },
            //表单提交方法
            submit(){
            saveSubmit(){
                var obj = Object.assign({},this.addDictForm);
                this.$refs.dialogForm.validate(async (valid) => {
                    if (valid) {
                        this.isSaveing = true;
                        var res = await this.$API.demo.post.post(this.form);
                        this.isSaveing = false;
                        if(res.code == 200){
                            this.$emit('success', this.form, this.mode)
                            this.visible = false;
                            this.$message.success("操作成功")
                        }else{
                            this.$alert(res.message, "提示", {type: 'error'})
                        }
                        this.$HTTP.post("/api/blade-cps/employee/submit",obj).then(res=> {
                            this.isSaveing = false;
                            if(res.code == 200) {
                                this.$emit('success', this.addDictForm, this.mode);
                                this.visible = false;
                                this.$message.success("操作成功");
                            }else {
                                this.$alert(res.message, "提示", {type: 'error'});
                            }
                        })
                    }else{
                        return false;
                    }
@@ -197,12 +179,7 @@
            },
            //表单注入数据
            setData(data){
                this.form.id = data.id
                this.form.userName = data.userName
                this.form.avatar = data.avatar
                this.form.name = data.name
                this.form.group = data.group
                this.form.dept = data.dept
                this.addPersonForm.id = data.id

                //可以和上面一样单个注入，也可以像下面一样直接合并进去
                //Object.assign(this.form, data)