sccg_ui.git - Gitblit

			@@ -11,8 +11,9 @@
			</div>
			<div class="addUser">
			<el-button class="addBtn" type="primary" @click="dialogCreate = true">新建角色</el-button>
			<el-dialog :visible.sync="dialogCreate" title="新增角色" width="45%" v-if="dialogCreate">
			<createUser :refresh="getUserList" />
			<el-dialog :visible.sync="dialogCreate" title="新增角色" width="45%" v-if="dialogCreate"
			:before-close="handleClose2">
			<createUser :refresh="context==='' ? getUserList : search" />
			</el-dialog>
			</div>
			</div>
			@@ -22,7 +23,8 @@
			<!-- 数据展示 -->
			<el-table ref="multipleTable"
			:header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}"
			:data="tableData" style="width: 100%" :row-class-name="tableRowClassName">
			:data="tableData" style="width: 100%" :row-class-name="tableRowClassName"
			@selection-change="tableChange">
			<el-table-column type="selection" min-width="5">
			</el-table-column>
			<!-- <el-table-column label="用户ID" min-width="5">
			@@ -55,23 +57,45 @@
			<span class="line">\|</span>
			<span @click="handleStop(scope.row)">停用</span>
			<span class="line">\|</span>
			<span @click="handleDelete(scope.row)">删除</span>
			<span @click="handleDelete([scope.row.id])">删除</span>
			</div>
			</template>
			</el-table-column>
			</el-table>
			<!-- 查看修改页面 -->
			<!-- 修改页面 -->
			<el-dialog :visible.sync="dialogUpdate" width="45%" :title="updateFlag ? '权限设置' :'查看角色信息'"
			v-if="dialogUpdate">
			<updateUser :updateFlag="updateFlag" :userInfo=userInfo :getUserList=getUserList
			@changeDialog="changeDialog" />
			v-if="dialogUpdate" :before-close="handleClose">
			<updateUser :updateFlag="updateFlag" :userInfo=userInfo
			:getUserList=" context ? getUserList : getUserList" @changeDialog="changeDialog" />
			</el-dialog>
			<!-- 分页 -->
			<div class="pagination">
			<el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum"
			:page-size="pageSize" @current-change="changeCurrentPage" @prev-click="handlePrev"
			@next-click="handleNext">
			</el-pagination>
			<!-- 查看页面 -->
			<el-dialog :visible.sync="dialogView" width="45%" title="查看角色信息"
			v-if="dialogView" :before-close="handleClose">
			<MyView :userInfo=userInfo @changeDialog="changeDialog" />
			</el-dialog>
			<!-- tools -->
			<div class="tools">
			<div class="funs">
			<!-- <div class="funsItem">
			<el-checkbox v-model="all" @change="selectAll()">全选</el-checkbox>
			</div>
			<div class="funsItem">
			<el-checkbox v-model="unsame" @change="disSame(tableData)">反选</el-checkbox>
			</div>
			<div class="funsItem">
			<el-select v-model="myIdx" placeholder="批量操作" @change="selectChange">
			<el-option v-for="item in options" :key="item.value" :label="item.label"
			:value="item.value" :disabled="item.disabled">
			</el-option>
			</el-select>
			</div> -->
			</div>
			<div class="pagination">
			<el-pagination background :current-page="currentPage" layout="prev, pager, next"
			:total="totalNum" :page-size="pageSize" @current-change="changeCurrentPage"
			@prev-click="handlePrev" @next-click="handleNext">
			</el-pagination>
			</div>
			</div>
			</div>
			</main>
			@@ -81,9 +105,10 @@
			import createUser from "./createUser"
			import updateUser from "./updateUser"
			import helper from "@/utils/mydate.js"
			import MyView from './viewRole'
			export default {
			components: {
			createUser, updateUser
			createUser, updateUser,MyView
			},
			data() {
			return {
			@@ -91,28 +116,122 @@
			context: "",
			dialogCreate: false,
			dialogUpdate: false,
			dialogView:false,
			updateFlag: false,
			userInfo: '',
			totalNum: null,
			pageSize: 10,
			currentPage: 1,
			all: false,
			unsame: false,
			myIdx: 0,
			preMyIdx: 0,
			options: [
			{
			value: 0,
			label: '批量操作',
			disabled: true,
			},
			{
			value: 1,
			label: '批量启用',
			},
			{
			value: 2,
			label: '批量禁用',
			},
			{
			value: 3,
			label: '批量删除',
			}
			],
			tempList: []
			}
			},
			created() {
			this.getUserList();
			},
			methods: {
			handleDelete({ id }) {
			async selectChange(list) {
			console.log(this.tempList);
			if (this.tempList.length !== 0) {
			this.preMyIdx = list;
			if (list === 3) {
			await this.handleDelete(this.tempList);
			} else if (list === 2) {
			await this.mulUpdateStatus(this.tempList, 0);
			} else {
			await this.mulUpdateStatus(this.tempList, 1);
			}
			this.myIdx = 0;
			} else {
			this.myIdx = this.preMyIdx;
			this.$message({
			type: 'warning',
			message: '您还没选中任何数据',
			})
			}
			},
			mulUpdateStatus(idArr, flag) {
			this.$confirm(flag === 1 ? "您确定要进行批量启用角色吗?" : '您确定要进行批量禁用角色吗?')
			.then(_ => {
			this.$axios({
			method: 'post',
			url: 'sccg/role/updateStatusBatch?ids=' + idArr + '&status=' + flag,
			})
			.then(res => {
			if (res.code === 200) {
			this.$message({
			type: 'success',
			message: '更改用户状态成功',
			})
			this.getUserList();
			} else {
			this.$message({
			type: 'error',
			message: res.message
			})
			}
			console.log(res);
			})
			})
			.catch(err => { console.log(err) })
			},
			tableChange(list) {
			this.tempList = [];
			list.forEach(item => {
			this.tempList.push(item.id);
			})
			if (list.length === this.tableData.length) {
			this.all = true;
			} else {
			this.all = false
			}
			},
			changeTime({ createTime }) {
			return helper(createTime);
			},
			selectAll() {
			this.$refs.multipleTable.toggleAllSelection();
			},
			disSame(list) {
			list.forEach(row => {
			this.$refs.multipleTable.toggleRowSelection(row)
			})
			},
			handleDelete(id) {
			const that = this;
			let arr = [];
			arr.push(id);
			// let arr = [];
			// arr.push(id);
			this.$confirm('确认删除？')
			.then(_ => {
			that.$axios({
			method: 'post',
			url: 'sccg/role/delete?ids=' + arr,
			url: 'sccg/role/delete?ids=' + id,
			})
			.then(res => {
			this.myIdx = 0;
			this.preMyIdx = 0;
			console.log(res);
			this.$message({
			type: 'success',
			@@ -167,37 +286,26 @@
			if (res.code === 200) {
			console.log(res);
			res.data.list.forEach(item => {
			item.createTime = helper(item.createTime);
			// item.createTime = helper(item.createTime);
			item.status == 1 ? item.status = true : item.status = false;
			})
			that.tableData = res.data.list
			that.tableData = res.data.list;
			this.totalNum = res.data.list.length;
			}
			})
			} else {
			this.$axios({
			method: 'get',
			url: 'sccg/role/list?keyword='+context + '&pageNum=' + currentPage + '&pageSize=' + pageSize,
			url: 'sccg/role/list?keyword=' + context + '&pageNum=' + currentPage + '&pageSize=' + pageSize,
			}).then(res => {
			if (res.code === 200) {
			console.log(2, res);
			res.data.list.forEach(item => {
			item.createTime = helper(item.createTime);
			item.status == 1 ? item.status = true : item.status = false;
			})
			that.tableData = res.data.list
			this.totalNum = res.data.length;
			this.totalNum = res.data.list.length;
			}
			})
			// this.$axios.get('sccg/role/list?'+context).then(res => {
			// if (res.code === 200) {
			// console.log(2,res);
			// res.data.list.forEach(item => {
			// item.createTime = helper(item.createTime);
			// item.status == 1 ? item.status = true : item.status = false;
			// })
			// that.tableData = res.data.list
			// }
			// })
			}
			},
			// 设置表格斑马纹
			@@ -211,8 +319,7 @@
			},
			// 查看用户信息(不可修改)
			handleFind(rowData) {
			this.dialogUpdate = true;
			this.updateFlag = false;
			this.dialogView = true;
			this.userInfo = rowData;
			},
			// 修改用户部门信息
			@@ -236,9 +343,30 @@
			this.currentPage = page;
			this.search();
			},
			changeDialog(val) {
			this.dialogUpdate = val.dialogUpdate;
			console.log(val);
			changeDialog({flag}) {
			this.dialogUpdate = flag;
			this.dialogCreate = flag;
			this.dialogView = flag;
			},
			handleClose(done) {
			if(this.updateFlag){
			this.$confirm('确认关闭？')
			.then(_ => {
			this.dialogUpdate = false;
			this.dialogCreate = false;
			done();
			})
			.catch(_ => { });
			}else{
			done();
			}
			},
			handleClose2(done){
			this.$confirm('确认关闭？')
			.then(_ => {
			done();
			})
			.catch(_ => { });
			}
			}
			}
			@@ -312,17 +440,69 @@
			line-height: 60px;
			}

			.pagination {
			margin-top: 50px;
			.tools {
			display: flex;
			line-height: 50px;
			justify-content: center;
			justify-content: space-between;
			align-items: center;
			padding: 0 20px;

			&::v-deep li,
			&::v-deep .btn-prev,
			&::v-deep .btn-next {
			background-color: #071f39;
			color: #4b9bb7;
			.funs {
			display: flex;

			.funsItem {
			line-height: 28px;
			display: flex;
			align-items: center;
			border: 1px solid #17324c;
			border-radius: 4px;
			font-size: 12px;
			margin-left: 10px;

			.el-checkbox {
			width: 80px;
			padding: 0 10px;
			}

			.el-select {
			width: 120px;
			}

			&::v-deep .el-input__inner {
			border: none;
			background-color: #09152f;
			}

			&:hover {
			border: 1px solid #4b9bb7;
			}

			&:hover .el-checkbox {
			color: #4b9bb7;
			}
			}

			}

			.pagination {
			margin-top: 50px;
			display: flex;
			line-height: 50px;
			justify-content: center;

			.el-pagination {

			&::v-deep li,
			&::v-deep .btn-prev,
			&::v-deep .btn-next {
			background-color: #071f39;
			color: #4b9bb7;
			}

			&::v-deep .active {
			background-color: #409eff;
			color: #fff;
			}
			}
			}
			}