| | |
| | | </div> |
| | | <div class="serch"> |
| | | <div class="time_box"> |
| | | <div class="time">æ´¾å·¥æ¥æ</div> |
| | | <div class="time">åå»ºæ¥æ</div> |
| | | <el-date-picker |
| | | v-model="queryForm.selectTime" |
| | | prefix-icon="none" |
| | |
| | | size="small" |
| | | /> |
| | | </div> |
| | | <div class="serch_box"> |
| | | <div class="serchb">å
¨å±æç´¢</div> |
| | | <!-- <div class="serch_box"> |
| | | <div class="serchb"> |
| | | <el-select |
| | | v-model="queryForm.selectType" |
| | | placeholder="è¯·éæ©" |
| | | size="small" |
| | | style="width: 100%; height: 100%; font-size: 0.15rem" |
| | | > |
| | | <el-option |
| | | v-for="item in selectoptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </div> |
| | | <input |
| | | v-model="queryForm.selectName" |
| | | placeholder="请è¾å
¥å
³é®è¯æç´¢" |
| | | style="border-left: 0.06rem solid #e2e2e2" |
| | | /> |
| | | </div> |
| | | </div> --> |
| | | <el-button |
| | | @click="handleQuery" |
| | | type="primary" |
| | | size="small" |
| | | style="margin-left: 0.98rem; height: 2rem" |
| | | >æ¥è¯¢</el-button |
| | | > |
| | | <el-button size="small" style="height: 2rem">éç½®</el-button> |
| | | <el-button size="small" style="height: 2rem" @click="resetQuery" |
| | | >éç½®</el-button |
| | | > |
| | | </div> |
| | | <div class="btns"> |
| | | <div style="display: flex; align-items: center"> |
| | |
| | | v-if="isactive == 2" |
| | | type="primary" |
| | | size="small" |
| | | @click="dialogVisible2 = true" |
| | | @click="AddRole" |
| | | style=" |
| | | width: 5.5rem; |
| | | height: 2rem; |
| | |
| | | <el-button |
| | | size="small" |
| | | style="width: 5.5rem; height: 2rem; font-size: 0.88rem" |
| | | @click="printExcel" |
| | | >æ¹é导åº</el-button |
| | | > |
| | | <el-button |
| | | @click="deleteAll" |
| | | size="small" |
| | | style="width: 5.5rem; height: 2rem; font-size: 0.88rem" |
| | | >æ¹éå é¤</el-button |
| | |
| | | <div style="margin-top: 1rem; height: 100%"> |
| | | <!-- ç¨æ·å表 --> |
| | | <el-table |
| | | height="450" |
| | | v-if="isactive == 1" |
| | | :data="tableData" |
| | | style="width: 100%" |
| | |
| | | fontSize: '0.88rem', |
| | | height: '3rem', |
| | | }" |
| | | @select="UserSelectionChange" |
| | | > |
| | | <el-table-column type="selection" align="center" /> |
| | | <el-table-column prop="address" label="ç»å½è´¦å·" align="center" /> |
| | | <el-table-column prop="name" label="çå®å§å" align="center" /> |
| | | <el-table-column prop="address" label="èç³»æ¹å¼" align="center" /> |
| | | <el-table-column prop="address" label="ç¨æ·åç»" align="center" /> |
| | | <el-table-column prop="address" label="ç¨æ·è§è²" align="center" /> |
| | | <el-table-column prop="address" label="人è¸ç
§ç" align="center" /> |
| | | <el-table-column prop="address" label="æ¯å¦å¯ç¨" align="center" /> |
| | | <el-table-column prop="address" label="åå»ºæ¥æ" align="center" /> |
| | | <el-table-column prop="address" label="æä½" align="center"> |
| | | <template #default=""> |
| | | <el-button size="small" type="text" @click="Edit">ç¼è¾</el-button> |
| | | <el-button size="small" type="text" @click="Editpassword" |
| | | <el-table-column type="selection" align="center" min-width="1%" /> |
| | | <el-table-column |
| | | prop="userName" |
| | | label="ç»å½è´¦å·" |
| | | align="center" |
| | | min-width="2%" |
| | | /> |
| | | <el-table-column |
| | | prop="userTrueName" |
| | | label="çå®å§å" |
| | | align="center" |
| | | min-width="3%" |
| | | /> |
| | | <el-table-column |
| | | prop="phoneNo" |
| | | label="èç³»æ¹å¼" |
| | | align="center" |
| | | min-width="3%" |
| | | /> |
| | | <el-table-column |
| | | prop="role_Id" |
| | | label="ç¨æ·åç»" |
| | | align="center" |
| | | min-width="2%" |
| | | /> |
| | | <el-table-column |
| | | prop="roleName" |
| | | label="ç¨æ·è§è²" |
| | | align="center" |
| | | min-width="3%" |
| | | /> |
| | | <el-table-column |
| | | prop="address" |
| | | label="人è¸ç
§ç" |
| | | align="center" |
| | | min-width="3%" |
| | | > |
| | | <template #default="scope"> |
| | | <el-image |
| | | style="width: 70px; height: 70px" |
| | | :src="scope.row.headImageUrl" |
| | | show-progress |
| | | :initial-index="4" |
| | | fit="cover" |
| | | /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="æ¯å¦å¯ç¨" align="center" min-width="2%"> |
| | | <template #default="scope"> |
| | | <el-switch |
| | | v-model="scope.row.enable" |
| | | :active-value="1" |
| | | :inactive-value="0" |
| | | @change="changeSwitch(scope.row)" |
| | | /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="createDate" |
| | | label="åå»ºæ¥æ" |
| | | align="center" |
| | | min-width="3%" |
| | | /> |
| | | <el-table-column label="æä½" align="center" min-width="3%"> |
| | | <template #default="scope"> |
| | | <el-button size="small" type="text" @click="Edit(scope.row)" |
| | | >ç¼è¾</el-button |
| | | > |
| | | <el-button |
| | | size="small" |
| | | type="text" |
| | | @click="Editpassword(scope.row)" |
| | | >ä¿®æ¹å¯ç </el-button |
| | | > |
| | | </template> |
| | |
| | | |
| | | <!-- ç¨æ·è§è² --> |
| | | <el-table |
| | | height="450" |
| | | v-if="isactive == 2" |
| | | :data="tableData" |
| | | :data="grideData" |
| | | style="width: 100%" |
| | | :header-cell-style="{ |
| | | background: 'rgba(250,250,250,1)', |
| | |
| | | fontSize: '0.88rem', |
| | | height: '3rem', |
| | | }" |
| | | @select="RoleSelectionChange" |
| | | > |
| | | <el-table-column type="selection" align="center" /> |
| | | <el-table-column prop="address" label="è§è²åç§°" align="center" /> |
| | | <el-table-column prop="name" label="è§è²æé" align="center" /> |
| | | <el-table-column prop="address" label="夿³¨" align="center" /> |
| | | <el-table-column prop="address" label="æ¯å¦å¯ç¨" align="center" /> |
| | | <el-table-column prop="address" label="åå»ºæ¥æ" align="center" /> |
| | | <el-table-column prop="address" label="æä½" align="center"> |
| | | <template #default=""> |
| | | <el-table-column prop="roleName" label="è§è²åç§°" align="center" /> |
| | | <el-table-column prop="name" label="è§è²æé" align="center"> |
| | | <template #default="scope"> |
| | | <span |
| | | @click=" |
| | | router.replace({ |
| | | path: `/permission`, |
| | | state: { info: JSON.stringify(scope.row) }, |
| | | }) |
| | | " |
| | | style="color: #4386ff; cursor: pointer" |
| | | >管ç</span |
| | | > |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="deptName" label="夿³¨" align="center" /> |
| | | <el-table-column label="æ¯å¦å¯ç¨" align="center"> |
| | | <template #default="scope"> |
| | | <el-switch |
| | | v-model="scope.row.enable" |
| | | :active-value="1" |
| | | :inactive-value="0" |
| | | @change="changeRoleSwitch(scope.row)" |
| | | /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="createDate" label="åå»ºæ¥æ" align="center" /> |
| | | <el-table-column label="æä½" align="center"> |
| | | <template #default="scope"> |
| | | <span |
| | | style="color: blue; font-size: 0.88rem; cursor: pointer" |
| | | @click="Findtorque" |
| | | @click="EditRole(scope.row)" |
| | | >ç¼è¾</span |
| | | > |
| | | </template></el-table-column |
| | |
| | | " |
| | | > |
| | | <el-pagination |
| | | v-if="isactive == 1" |
| | | size="small" |
| | | background |
| | | layout="prev, pager, next" |
| | | :total="1" |
| | | :current-page="pageQuery.page" |
| | | :page-size="pageQuery.rows" |
| | | :total="pageTotal" |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | | /> |
| | | <el-pagination |
| | | v-if="isactive == 2" |
| | | size="small" |
| | | background |
| | | layout="prev, pager, next" |
| | | :current-page="pageQuery.page" |
| | | :page-size="pageQuery.rows" |
| | | :total="pageTotal" |
| | | @size-change="RoleSizeChange" |
| | | @current-change="RoleCurrentChange" |
| | | /> |
| | | </div> |
| | | </div> |
| | |
| | | > |
| | | </div> |
| | | </template> |
| | | <el-form :model="form" label-width="auto" label-position="top"> |
| | | <el-form |
| | | :model="formUser" |
| | | label-width="auto" |
| | | label-position="top" |
| | | ref="formRef" |
| | | > |
| | | <el-row :gutter="20"> |
| | | <el-col :span="8"> |
| | | <el-form-item> |
| | | <el-form-item prop="userName"> |
| | | <template #label> |
| | | <div style="display: flex; align-items: flex-end"> |
| | | <span style="color: red; margin-right: 0.2rem">*</span> |
| | |
| | | > |
| | | </div> |
| | | </template> |
| | | <el-input size="small" v-model="form.name" placeholder="请è¾å
¥" /> |
| | | <el-input |
| | | size="small" |
| | | v-model="formUser.userName" |
| | | placeholder="请è¾å
¥" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item> |
| | | <el-form-item prop="userTrueName"> |
| | | <template #label> |
| | | <div style="display: flex; align-items: flex-end"> |
| | | <span style="color: red; margin-right: 0.2rem">*</span> |
| | |
| | | > |
| | | </div> |
| | | </template> |
| | | <el-input size="small" v-model="form.name" placeholder="请è¾å
¥" /> |
| | | <el-input |
| | | size="small" |
| | | v-model="formUser.userTrueName" |
| | | placeholder="请è¾å
¥" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item> |
| | | <el-form-item prop="phoneNo"> |
| | | <template #label> |
| | | <div style="display: flex; align-items: flex-end"> |
| | | <span style="color: red; margin-right: 0.2rem">*</span> |
| | |
| | | > |
| | | </div> |
| | | </template> |
| | | <el-input size="small" v-model="form.name" placeholder="请è¾å
¥" /> |
| | | <el-input |
| | | size="small" |
| | | v-model="formUser.phoneNo" |
| | | placeholder="请è¾å
¥" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <span style="color: red; margin-right: 0.2rem">*</span> |
| | | <span |
| | | style="font-size: 0.88rem; color: black; font-weight: bold" |
| | | >ç¨æ·åç»</span |
| | | > |
| | | </div> |
| | | </template> |
| | | <el-select v-model="value" placeholder="è¯·éæ©" size="small"> |
| | | <el-option |
| | | v-for="item in options" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item> |
| | | <template #label> |
| | | <div style="display: flex; align-items: flex-end"> |
| | | <span style="color: red; margin-right: 0.2rem">*</span> |
| | | <span |
| | | style="font-size: 0.88rem; color: black; font-weight: bold" |
| | | >ç¨æ·è§è²</span |
| | | > |
| | | </div> |
| | | </template> |
| | | <el-select v-model="value" placeholder="è¯·éæ©" size="small"> |
| | | <el-select |
| | | v-model="formUser.role_Id" |
| | | placeholder="è¯·éæ©" |
| | | size="small" |
| | | > |
| | | <el-option |
| | | v-for="item in options" |
| | | v-for="item in groupOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | |
| | | > |
| | | </div> |
| | | </template> |
| | | <el-select v-model="value" placeholder="è¯·éæ©" size="small"> |
| | | <el-select |
| | | v-model="formUser.enable" |
| | | placeholder="è¯·éæ©" |
| | | size="small" |
| | | > |
| | | <el-option |
| | | v-for="item in options" |
| | | v-for="item in isoptins" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | |
| | | action="#" |
| | | list-type="picture-card" |
| | | :auto-upload="false" |
| | | @before-upload="beforeAvatarUpload" |
| | | :on-change="handleAvatarSuccess" |
| | | > |
| | | <el-icon><Plus /></el-icon> |
| | | |
| | | <template #file="{ file }"> |
| | | <div> |
| | | <img |
| | |
| | | <el-button |
| | | size="small" |
| | | type="primary" |
| | | @click="dialogVisible = false" |
| | | @click="saveObj" |
| | | style="height: 2rem; font-size: 0.88rem" |
| | | > |
| | | ä¿å |
| | |
| | | > |
| | | </div> |
| | | </template> |
| | | <el-form :model="form" label-width="auto" label-position="top"> |
| | | <el-form |
| | | :model="formpassword" |
| | | label-width="auto" |
| | | label-position="top" |
| | | ref="formpasswordRef" |
| | | :rules="passwordrules" |
| | | > |
| | | <el-row> |
| | | <el-col> |
| | | <div |
| | |
| | | border-radius: 0.25rem; |
| | | " |
| | | > |
| | | <span style="color: #51b820; font-size: 1rem">è´¦å·ï¼adimin</span |
| | | <span style="color: #51b820; font-size: 1rem" |
| | | >è´¦å·ï¼{{ formpassword.userName }}</span |
| | | ><span style="color: #51b820; font-size: 1rem; margin-left: 2rem" |
| | | >ç¨æ·ï¼è¶
级管çå</span |
| | | >ç¨æ·ï¼{{ formpassword.roleName }}</span |
| | | > |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | <el-form-item> |
| | | <el-form-item prop="password"> |
| | | <el-input |
| | | style="margin-top: 1rem" |
| | | size="large" |
| | | v-model="form.name" |
| | | v-model="formpassword.password" |
| | | placeholder="请è¾å
¥" |
| | | /> |
| | | </el-form-item> |
| | |
| | | <el-button |
| | | size="small" |
| | | type="primary" |
| | | @click="dialogVisible1 = false" |
| | | @click="savePassword(formpasswordRef)" |
| | | style="height: 2rem; font-size: 0.88rem" |
| | | > |
| | | ä¿å |
| | |
| | | > |
| | | </div> |
| | | </template> |
| | | <el-form :model="form" label-width="auto" label-position="top"> |
| | | <el-form-item> |
| | | <el-form |
| | | :model="formRole" |
| | | label-width="auto" |
| | | label-position="top" |
| | | ref="formRoleRef" |
| | | :rules="roleRules" |
| | | :hide-required-asterisk="true" |
| | | > |
| | | <el-form-item prop="roleName"> |
| | | <template #label> |
| | | <div style="display: flex; align-items: flex-end"> |
| | | <span style="color: red; margin-right: 0.2rem">*</span> |
| | |
| | | <el-input |
| | | style="height: 2rem" |
| | | size="small" |
| | | v-model="userform.userName" |
| | | v-model="formRole.roleName" |
| | | placeholder="请è¾å
¥" |
| | | /> |
| | | </el-form-item> |
| | |
| | | <el-input |
| | | style="height: 2rem" |
| | | size="small" |
| | | v-model="userform.description" |
| | | v-model="formRole.description" |
| | | placeholder="请è¾å
¥" |
| | | /> |
| | | </el-form-item> |
| | |
| | | <el-button |
| | | size="small" |
| | | type="primary" |
| | | @click="dialogVisible2 = false" |
| | | @click="saveRole(formRoleRef)" |
| | | style="height: 2rem; font-size: 0.88rem" |
| | | > |
| | | ä¿å |
| | |
| | | </el-dialog> |
| | | |
| | | <!-- æé管çå¼¹åºæ¡ --> |
| | | |
| | | <el-dialog v-model="imgdialogVisible"> |
| | | <div |
| | | style=" |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | " |
| | | > |
| | | <img w-full :src="dialogImageUrl" alt="Preview Image" /> |
| | | </div> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | <script setup> |
| | | import { ref, reactive } from "vue"; |
| | | import { ref, reactive, onMounted } from "vue"; |
| | | import { ElMessage, ElMessageBox } from "element-plus"; |
| | | import { |
| | | GetUserList, |
| | | AddUser, |
| | | UpdateUser, |
| | | DelApi, |
| | | ExportApi, |
| | | ExportApi1, |
| | | } from "@/api/user"; |
| | | import { useRouter } from "vue-router"; |
| | | import { formatTime } from "@/utils/index.js"; |
| | | import { |
| | | GetPageDataApi, |
| | | StatusChangeApiApi, |
| | | AddRoleApi, |
| | | UpdateRoleApi, |
| | | DeleteRoleApi, |
| | | } from "@/api/role"; |
| | | const queryForm = reactive({ |
| | | selectName: "", |
| | | selectTime: [], // æ¶é´èå´ |
| | | selectType: "", |
| | | selectInput: "", |
| | | }); |
| | | const router = useRouter(); |
| | | |
| | | const tableData = ref([]); |
| | | |
| | | const grideData = ref([{ id: 1 }]); |
| | | const formRef = ref(); |
| | | const options = ref([]); |
| | | const props = { multiple: true }; |
| | | |
| | | const isoptins = ref([ |
| | | { |
| | | value: 0, |
| | | label: "å¦", |
| | | }, |
| | | { value: 1, label: "æ¯" }, |
| | | ]); |
| | | //åç» |
| | | const groupOptions = ref([ |
| | | { value: 1, label: "è¶
级管çå" }, |
| | | { value: 2, label: "è´¨æ£ç»" }, |
| | | { value: 3, label: "çµæ°ç»" }, |
| | | { value: 4, label: "æºæ¢°ç»" }, |
| | | { value: 5, label: "å°æ²ç»" }, |
| | | ]); |
| | | const table = ref(false); |
| | | const form = reactive({}); |
| | | const formUser = ref({ |
| | | user_Id: undefined, |
| | | userName: "", |
| | | role_Id: 2, |
| | | roleName: "", |
| | | phoneNo: "", |
| | | remark: "", |
| | | userPwd: "123456", |
| | | userTrueName: "", |
| | | dept_Id: 0, |
| | | enable: 1, |
| | | headImageUrl: "", |
| | | }); |
| | | const userform = reactive({ |
| | | userName: "", |
| | | description: "", |
| | | }); |
| | | const formpasswordRef = ref(); |
| | | const isactive = ref(1); |
| | | const claimdialogVisible = ref(false); |
| | | const dialogVisible = ref(false); |
| | | const imgdialogVisible = ref(false); |
| | | const dialogImageUrl = ref(""); |
| | | //ç¨æ·ä¿¡æ¯ä¿®æ¹å¯ç å¼¹åºæ¡ |
| | | const dialogVisible1 = ref(false); |
| | | //ç¨æ·è§è²æ°å»º |
| | | const dialogVisible2 = ref(false); |
| | | const TorquedialogVisible = ref(false); |
| | | const activities = [ |
| | | { |
| | | content: "1.1å·¥ååå¤", |
| | | timestamp: "2018-04-15", |
| | | }, |
| | | { |
| | | content: "2.1çµå¼çµæºçµç¼å®è£
ï¼ä»
å¨è½¦è½¬åæ¶ï¼", |
| | | timestamp: "2018-04-13", |
| | | }, |
| | | { |
| | | content: "2.2çµå¼çµæºçµç¼å®è£
ï¼ä»
å¨è½¦è½¬åæ¶ï¼", |
| | | timestamp: "2018-04-11", |
| | | }, |
| | | { |
| | | content: "2.3çµå¼çµæºçµç¼å®è£
ï¼ä»
å¨è½¦è½¬åæ¶ï¼", |
| | | timestamp: "2018-04-11", |
| | | }, |
| | | { |
| | | content: "2.4çµå¼çµæºçµç¼å®è£
ï¼ä»
å¨è½¦è½¬åæ¶ï¼", |
| | | timestamp: "2018-04-11", |
| | | }, |
| | | { |
| | | content: "2.4çµå¼çµæºçµç¼å®è£
ï¼ä»
å¨è½¦è½¬åæ¶ï¼", |
| | | timestamp: "2018-04-11", |
| | | }, |
| | | { |
| | | content: "2.4çµå¼çµæºçµç¼å®è£
ï¼ä»
å¨è½¦è½¬åæ¶ï¼", |
| | | timestamp: "2018-04-11", |
| | | }, |
| | | { |
| | | content: "2.4çµå¼çµæºçµç¼å®è£
ï¼ä»
å¨è½¦è½¬åæ¶ï¼", |
| | | timestamp: "2018-04-11", |
| | | }, |
| | | { |
| | | content: "2.4çµå¼çµæºçµç¼å®è£
ï¼ä»
å¨è½¦è½¬åæ¶ï¼", |
| | | timestamp: "2018-04-11", |
| | | }, |
| | | { |
| | | content: "2.4çµå¼çµæºçµç¼å®è£
ï¼ä»
å¨è½¦è½¬åæ¶ï¼", |
| | | timestamp: "2018-04-11", |
| | | }, |
| | | { |
| | | content: "2.4çµå¼çµæºçµç¼å®è£
ï¼ä»
å¨è½¦è½¬åæ¶ï¼", |
| | | timestamp: "2018-04-11", |
| | | }, |
| | | ]; |
| | | //å页请æ±åæ° |
| | | const pageQuery = ref({ |
| | | page: 1, //å½åé¡µé¢ |
| | | rows: 10, //æ¯é¡µæ¾ç¤ºæ¡æ° |
| | | order: "desc", //æåºæ¹å¼ |
| | | sort: "createDate", //æåºå段 |
| | | wheres: "", //æ¡ä»¶æ¥è¯¢ |
| | | }); |
| | | |
| | | const changeactive = (index) => { |
| | | isactive.value = index; |
| | | if (isactive.value == 1) { |
| | | selectoptions.value = userOptions; |
| | | initData(); |
| | | } else { |
| | | selectoptions.value = roleOptions; |
| | | getRole(); |
| | | } |
| | | }; |
| | | function cancelClick() { |
| | | table.value = false; |
| | | |
| | | const userOptions = [ |
| | | { |
| | | value: "userName", |
| | | label: "ç»å½è´¦å·", |
| | | }, |
| | | { |
| | | value: "userTrueName", |
| | | label: "çå®å§å", |
| | | }, |
| | | { |
| | | value: "phoneNo", |
| | | label: "èç³»æ¹å¼", |
| | | }, |
| | | ]; |
| | | |
| | | const roleOptions = [ |
| | | { |
| | | value: "roleName", |
| | | label: "è§è²åç§°", |
| | | }, |
| | | ]; |
| | | const selectoptions = ref([]); |
| | | selectoptions.value = userOptions; |
| | | const formpassword = ref({ |
| | | password: "", |
| | | }); |
| | | const passwordrules = reactive({ |
| | | password: { |
| | | required: true, |
| | | message: "请è¾å
¥å¯ç ", |
| | | trigger: "blur", |
| | | }, |
| | | }); |
| | | const pageTotal = ref(0); |
| | | //ç»å½è®°å½ |
| | | const initData = () => { |
| | | // æ¥è¯¢æ¡ä»¶ |
| | | const startTime = formatTime(queryForm.selectTime[0]); |
| | | const endTime = formatTime(queryForm.selectTime[1]); |
| | | const filter = [ |
| | | { |
| | | name: "", |
| | | value: queryForm.selectType, |
| | | displayType: "int", |
| | | }, |
| | | { name: "createDate", value: startTime, displayType: "ThanOrEqual" }, |
| | | { name: "createDate", value: endTime, displayType: "LessOrEqual" }, |
| | | ]; |
| | | GetUserList({ |
| | | ...pageQuery.value, |
| | | filter, |
| | | }).then((res) => { |
| | | tableData.value = res.rows; |
| | | pageTotal.value = res.total; |
| | | }); |
| | | }; |
| | | |
| | | //æ°æ®æ£ç´¢äºä»¶ |
| | | const handleQuery = () => { |
| | | pageQuery.value.page = 1; |
| | | initData(); |
| | | }; |
| | | |
| | | const resetQuery = () => { |
| | | queryForm.selectName = ""; |
| | | queryForm.selectInput = ""; |
| | | queryForm.selectTime = []; |
| | | queryForm.selectType = ""; |
| | | pageQuery.value.page = 1; |
| | | initData(); |
| | | }; |
| | | //å页页é¢å¤§å°æ¹å |
| | | const handleSizeChange = (val) => { |
| | | pageQuery.value.rows = val; |
| | | initData(); |
| | | }; |
| | | |
| | | //å页页颿¹å |
| | | const handleCurrentChange = (val) => { |
| | | pageQuery.value.page = val; |
| | | initData(); |
| | | }; |
| | | //å页页é¢å¤§å°æ¹å |
| | | const RoleSizeChange = (val) => { |
| | | pageQuery.value.rows = val; |
| | | getRole(); |
| | | }; |
| | | |
| | | //å页页颿¹å |
| | | const RoleCurrentChange = (val) => { |
| | | pageQuery.value.page = val; |
| | | getRole(); |
| | | }; |
| | | const handlePictureCardPreview = (uploadFile) => { |
| | | dialogImageUrl.value = uploadFile.url; |
| | | imgdialogVisible.value = true; |
| | | }; |
| | | const handleAvatarSuccess = (val) => { |
| | | console.log(val); |
| | | }; |
| | | const beforeAvatarUpload = (val) => { |
| | | console.log(val); |
| | | }; |
| | | //æ°å»ºç¨æ·è´¦å· |
| | | const saveObj = () => { |
| | | formRef.value.validate((valid) => { |
| | | if (valid) { |
| | | if (formUser.value.user_Id != undefined) { |
| | | UpdateUser(formUser.value).then((res) => { |
| | | ElMessage({ message: "ä¿®æ¹æå", type: "success" }); |
| | | dialogVisible.value = false; |
| | | initData(); |
| | | }); |
| | | } else { |
| | | AddUser(formUser.value).then((res) => { |
| | | ElMessage({ message: "æäº¤æå", type: "success" }); |
| | | dialogVisible.value = false; |
| | | initData(); |
| | | }); |
| | | } |
| | | function confirmClick() { |
| | | table.value = false; |
| | | } |
| | | // æ¥ç详æ
|
| | | const Findmore = () => { |
| | | }); |
| | | }; |
| | | //æ¯å¦å¯ç¨ |
| | | const changeSwitch = (val) => { |
| | | let data = Object.assign({}, val); |
| | | console.log(data); |
| | | UpdateUser(data).then((res) => { |
| | | ElMessage({ message: "ä¿®æ¹æå", type: "success" }); |
| | | dialogVisible.value = false; |
| | | initData(); |
| | | }); |
| | | console.log(val); |
| | | }; |
| | | // ç¨æ·è§è²æ¯å¦å¯ç¨ |
| | | const changeRoleSwitch = (val) => { |
| | | let data = Object.assign({}, val); |
| | | StatusChangeApiApi(data).then((res) => { |
| | | ElMessage({ message: "ä¿®æ¹æå", type: "success" }); |
| | | dialogVisible.value = false; |
| | | initData(); |
| | | }); |
| | | }; |
| | | //ç¼è¾ç¨æ·è´¦å· |
| | | const Edit = (val) => { |
| | | console.log(val); |
| | | let obj = Object.assign({}, val); |
| | | dialogVisible.value = true; |
| | | formUser.value = obj; |
| | | }; |
| | | // æ¥çåç© |
| | | const Findtorque = () => { |
| | | TorquedialogVisible.value = true; |
| | | const newobj = ref({}); |
| | | //ä¿®æ¹å¯ç |
| | | const Editpassword = (val) => { |
| | | formpassword.value = val; |
| | | newobj.value = val; |
| | | dialogVisible1.value = true; |
| | | }; |
| | | //ä¿åä¿®æ¹å¯ç |
| | | const savePassword = async (formEl) => { |
| | | let obj = Object.assign({}, newobj); |
| | | obj.password = formpassword.value.password; |
| | | if (!formEl) return; |
| | | await formEl.validate((valid, fields) => { |
| | | if (valid) { |
| | | UpdateUser(obj).then((res) => { |
| | | ElMessage({ message: "ä¿®æ¹å¯ç æå", type: "success" }); |
| | | dialogVisible1.value = false; |
| | | initData(); |
| | | }); |
| | | } else { |
| | | console.log("error submit!", fields); |
| | | } |
| | | }); |
| | | }; |
| | | const formRoleRef = ref(); |
| | | const roleRules = reactive({ |
| | | roleName: { |
| | | required: true, |
| | | message: "请è¾å
¥è§è²åç§°", |
| | | trigger: "blur", |
| | | }, |
| | | description: { |
| | | required: true, |
| | | message: "请è¾å
¥è§è²æè¿°", |
| | | trigger: "blur", |
| | | }, |
| | | }); |
| | | const formRole = ref({ |
| | | roleName: "", |
| | | description: "", |
| | | }); |
| | | //æ°å»ºè§è² |
| | | const AddRole = () => { |
| | | Roletype.value = "æ°å»º"; |
| | | dialogVisible2.value = true; |
| | | }; |
| | | const Roletype = ref("æ°å»º"); |
| | | //ä¿åè§è² |
| | | const saveRole = async (formEl) => { |
| | | if (!formEl) return; |
| | | await formEl.validate((valid, fields) => { |
| | | if (valid) { |
| | | if (Roletype.value == "ä¿®æ¹") { |
| | | UpdateRoleApi(formRole.value).then((res) => { |
| | | ElMessage({ message: "ä¿®æ¹æå", type: "success" }); |
| | | dialogVisible2.value = false; |
| | | getRole(); |
| | | }); |
| | | } else { |
| | | AddRoleApi(formRole.value).then((res) => { |
| | | ElMessage({ message: "æ·»å æå", type: "success" }); |
| | | dialogVisible2.value = false; |
| | | getRole(); |
| | | }); |
| | | } |
| | | } else { |
| | | console.log("error submit!", fields); |
| | | } |
| | | }); |
| | | }; |
| | | //ç¼è¾è§è² |
| | | const EditRole = (val) => { |
| | | Roletype.value = "ä¿®æ¹"; |
| | | let obj = Object.assign({}, val); |
| | | formRole.value = obj; |
| | | dialogVisible2.value = true; |
| | | }; |
| | | const getRole = () => { |
| | | GetPageDataApi({ |
| | | page: 1, |
| | | rows: 10, |
| | | total: 100, |
| | | tableName: "", |
| | | sort: "", |
| | | order: "", |
| | | wheres: "", |
| | | export: true, |
| | | value: "", |
| | | filter: [ |
| | | { |
| | | name: "string", |
| | | value: "string", |
| | | displayType: "string", |
| | | }, |
| | | ], |
| | | }).then((res) => { |
| | | grideData.value = res.rows; |
| | | pageTotal.value = res.total; |
| | | }); |
| | | }; |
| | | const printExcel = () => { |
| | | // æ¥è¯¢æ¡ä»¶ |
| | | const startTime = formatTime(queryForm.selectTime[0]); |
| | | const endTime = formatTime(queryForm.selectTime[1]); |
| | | const filter = [ |
| | | { |
| | | name: queryForm.selectType, |
| | | value: queryForm.selectInput, |
| | | displayType: "String", |
| | | }, |
| | | { |
| | | name: "pustatus", |
| | | value: queryForm.selectName, |
| | | displayType: "String", |
| | | }, |
| | | { name: "createDate", value: startTime, displayType: "ThanOrEqual" }, |
| | | { name: "createDate", value: endTime, displayType: "LessOrEqual" }, |
| | | ]; |
| | | if (isactive.value == 1) { |
| | | ExportApi({ |
| | | ...pageQuery.value, |
| | | filter, |
| | | }); |
| | | } |
| | | if (isactive.value == 2) { |
| | | ExportApi1({ |
| | | ...pageQuery.value, |
| | | filter, |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | //æ¹éå é¤ |
| | | const ids = ref([]); |
| | | const UserSelectionChange = (val) => { |
| | | ids.value = []; |
| | | ids.value = val.map((item) => item.user_Id); |
| | | }; |
| | | const RoleSelectionChange = (val) => { |
| | | ids.value = []; |
| | | ids.value = val.map((item) => item.roleId); |
| | | }; |
| | | const deleteAll = () => { |
| | | if (ids.value.length == 0) { |
| | | ElMessage({ message: "è¯·éæ©è¦å é¤çæ°æ®", type: "error" }); |
| | | return; |
| | | } |
| | | if (isactive.value == 1) { |
| | | DelApi(ids.value).then((res) => { |
| | | ElMessage({ message: "å 餿å", type: "success" }); |
| | | initData(); |
| | | }); |
| | | } else { |
| | | DeleteRoleApi(ids.value).then((res) => { |
| | | ElMessage({ message: "å 餿å", type: "success" }); |
| | | getRole(); |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | onMounted(() => { |
| | | initData(); |
| | | }); |
| | | </script> |
| | | <style lang="scss" scoped> |
| | | .Usermanagement { |
| | |
| | | width: 6.88rem; |
| | | height: 2rem; |
| | | text-align: center; |
| | | border: 0.06rem solid rgba(222, 222, 222, 1); |
| | | border-radius: 0.25rem 0 0 0.25rem; |
| | | font-size: 0.75rem; |
| | | display: flex; |
| | | align-items: center; |