zx

src/views/Basic/Authority/index.vue

@@ -1,21 +1,391 @@
-<!--
- * @Author: your name
- * @Date: 2021-11-22 15:56:04
- * @LastEditTime: 2021-11-22 17:14:10
- * @LastEditors: Please set LastEditors
- * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
- * @FilePath: /ansu-business/src/views/Waybill/index.vue
--->
 <template>
-   <router-view></router-view>
+  <div>
+    <a-tabs default-active-key="1"  @change="change">
+      <a-tab-pane key="1" tab="人员角色分配">
+        <a-row>
+          <!-- 角色列表 -->
+          <a-col :span="5">
+            <div class="cardTitle">所有角色</div>
+            <a-button
+              class="add-btn"
+              style="margin: 10px"
+              @click="add.show = true"
+              >新增角色</a-button
+            >
+            <a-collapse accordion @change="rolechange">
+              <a-collapse-panel
+                v-for="(item, index) in afterroleList"
+                :key="index"
+                :header="item.name"
+              >
+                <a-button
+                  type="link"
+                  icon="form"
+                  slot="extra"
+                  @click.stop="editRole(item.id)"
+                >
+                </a-button>
+                <a-button
+                  type="link"
+                  slot="extra"
+                  style="color: #ff4d4f"
+                  icon="delete"
+                  @click.stop="delRole(item.id)"
+                ></a-button>
+                <div
+                  v-for="(rolechild, indexs) in item.childrenList"
+                  class="role-card"
+                  :key="indexs"
+                  @click="rolechoose(rolechild.id)"
+                >
+                  <span class="role-li">
+                    <span>{{ rolechild.name || "无" }}</span>
+                    <span v-show="rolechild.name"
+                      ><a-button
+                        type="link"
+                        icon="form"
+                        @click="editRole(rolechild.id)"
+                      >
+                      </a-button>
+                      <a-button
+                        type="link"
+                        style="color: #ff4d4f"
+                        icon="delete"
+                        @click="delRole(rolechild.id)"
+                      ></a-button
+                    ></span>
+                  </span>
+                </div>
+              </a-collapse-panel>
+            </a-collapse>
+          </a-col>
+          <!-- 人员表格 -->
+          <a-col :span="19">
+            <div class="search-box">
+              <a-space size="large">
+                <a-input
+                  v-model="searchForm.keyword"
+                  placeholder="请输入申请人/公司名"
+                />
+                <a-button type="primary" @click="getPeople">查 询</a-button>
+                <a-button @click="reset">重 置</a-button>
+              </a-space>
+            </div>
+			<div style="padding: 9px 16px 16px 20px">
+            <!-- <commonTable
+              :columns="columns"
+              :tableData="tableData"
+              :ActionsList="ActionsList"
+			  :pagination="pagination"
+              @handleTableChange="handleTableChange"
+              @Actions="Actions"
+              @selectionChoosed="selectionChoosed"
+            >
+              <template v-slot:actionBox="data">
+                <a-space size="small">
+                  <a class="ant-dropdown-link" @click="sendRole(data.data)"
+                    >分配角色</a
+                  >
+                </a-space>
+              </template>
+            </commonTable> -->
+			<a-table :columns="columns" :data-source="tableData" :pagination="pagination" @change="handleTableChange"
+				:row-selection="{
+					selectedRowKeys: selectedRowKeys,
+					onChange: onSelectChange,
+				}"
+				:row-key="
+					(record, index) => {
+						return record.id;
+					}
+				"
+			>
+			  <template slot="action" slot-scope="text,record">
+                  <a @click="sendRole(record)">分配角色</a>
+              </template>
+			</a-table>
+			</div>
+          </a-col>
+        </a-row>
+      </a-tab-pane>
+      <a-tab-pane key="2" tab="角色权限设置" force-render>
+        <role-permissions ref="permissions"></role-permissions>
+      </a-tab-pane>
+    </a-tabs>
+    <!-- <a-modal title="分配角色" :visible="send.show" @ok="sendSubmit" @cancel="sendClose">
+		请选择角色：<el-cascader :options="roleList" :show-all-levels="false" :props="{ multiple: true, checkStrictly: true,value:'id',label:'name', children:'childrenList',disabled:'disabled'}" clearable  ></el-cascader></a-modal> -->
+    <!-- 分配角色 -->
+    <a-drawer
+      title="分配角色"
+      :width="720"
+      :visible="send.show"
+      :body-style="{ paddingBottom: '80px' }"
+      @close="sendClose"
+    >
+      <div class="drawer-content">
+        <div class="cardTitle">所有角色</div>
+        <a-tree
+          v-model="tree.checkedKeys"
+          checkable
+		  defaultExpandAll
+          :selected-keys="tree.selectedKeys"
+          :tree-data="roleList"
+          :checkStrictly="true"
+          :replaceFields="{
+            children: 'childrenList',
+            title: 'name',
+            key: 'id',
+          }"
+          @select="onSelect"
+          @check="onCheck"
+        />
+      </div>
+      <div class="drawer-footer">
+        <a-button :style="{ marginRight: '8px' }" @click="sendClose">
+          关闭
+        </a-button>
+        <a-button type="primary" @click="sendSubmit"> 提交 </a-button>
+      </div>
+    </a-drawer>
+    <!-- 新增角色 -->
+    <add-form
+      :show="add.show"
+      :title="add.title"
+      :list="roleList"
+      @close="addClose"
+      @success="success"
+      :id="add.editId"
+    />
+  </div>
 </template>
 
 <script>
+import {columns, pagination, searchForm } from "./depend/config.js";
+import {
+	getrolelist,
+	listByRole,
+	assignRoles,
+	roleDel,
+} from "@/api/basic/role";
+import rolePermissions from "./depend/permissions.vue";
+import addForm from "./depend/form.vue";
 export default {
-    name: "Authority"
+	components: {
+		rolePermissions,
+		addForm,
+	},
+	data() {
+		return {
+			tree: {
+				expandedKeys: [],
+				autoExpandParent: true,
+				checkedKeys: [],
+				selectedKeys: [],
+			},
+			pagination,
+			columns,
+			searchForm,
+			add: {
+				show: false,
+				title: "新增角色",
+				editId: null,
+			},
+			tableChoosed: [],
+			roleList: [],
+			afterroleList: [],
+			tableData: [], //   数据
+			ActionsList: [],
+			selectedRowKeys:[],
+			send: {
+				show: false,
+			},
+			form: {
+				manageUserId: undefined,
+				roleId: "",
+			},
+		};
+	},
+	watch: {
+		afterroleList: {
+			handler(val) {
+				val.forEach((ele, index) => {
+					if (ele.childrenList === undefined || ele.childrenList === null) {
+						this.afterroleList[index].childrenList = [{ disabled: true }];
+					}
+				});
+			},
+			deep: true,
+		},
+	},
+	mounted() {
+		this.getData();
+		this.getPeople();
+	},
+	methods: {
+		getData() {
+			getrolelist().then((res) => {
+				this.roleList = res.data;
+				this.afterroleList = JSON.parse(JSON.stringify(this.roleList));
+			});
+		},
+		change(){
+			this.$refs.permissions.getData()
+		},
+		getPeople() {
+			listByRole({
+				pageNum: this.pagination.current,
+				size: this.pagination.pageSize,
+				roleId: this.searchForm.roleId,
+				keyword: this.searchForm.keyword,
+			}).then((res) => {
+				this.tableData = res.data.rows;	
+				this.pagination.total = res.data.total
+			});
+		},
+		success() {
+			this.getData();
+			this.getPeople();
+		},
+		addClose() {
+			this.add.show = false;
+			this.add.editId = undefined;
+			this.add.title = "新增角色";
+		},
+		// 编辑角色
+		editRole(id) {
+			this.add.editId = id;
+			this.add.title = "修改角色";
+			this.add.show = true;
+		},
+		// 删除角色
+		delRole(id) {
+			this.$confirm({
+				title: "是否删除",
+				// okText:'删除',
+				// cancelText:'取消',
+				icon: "delete",
+				onOk: () => {
+					roleDel({ roleId: id }).then((res) => {
+						if (res.code === 200) {
+							this.$message.success(res.msg);
+							this.getData();
+						} else {
+							this.$message.error(res.msg);
+						}
+					});
+				},
+			});
+		},
+		rolechange(data) {
+			if (data) {
+				this.searchForm.roleId = this.roleList[data].id;
+			} else {
+				this.searchForm.roleId = null;
+			}
+			this.getPeople();
+		},
+		rolechoose(data) {
+			if (data) {
+				this.searchForm.roleId = data;
+			} else {
+				this.searchForm.roleId = null;
 			}
+			this.getPeople();
+		},
+		reset() {
+			this.searchForm.keyword = "";
+			this.getPeople();
+		},
+		handleTableChange(pagination) {
+			this.pagination.current = pagination.current;
+			this.pagination.pageSize = pagination.pageSize;
+			this.getPeople()
+		},
+		sendRole(data) {
+			this.form.manageUserId = data.id;
+			let haveid = [];
+			for (let name of data.roleNameList) {
+				haveid.push(name.id);
+			}
+			this.tree.checkedKeys = haveid;
+			this.send.show = true;
+		},
+		onExpand(expandedKeys) {
+			// console.log('onExpand', expandedKeys);
+			// if not set autoExpandParent to false, if children expanded, parent can not collapse.
+			// or, you can remove all expanded children keys.
+			this.tree.expandedKeys = expandedKeys;
+			this.tree.autoExpandParent = false;
+		},
+		onCheck(checkedKeys) {
+			const arr = [];
+			this.tree.checkedKeys = checkedKeys;
+			for (let k of this.tree.checkedKeys.checked) {
+				arr.push(k);
+			}
+			this.form.roleId = arr.toString();
+		},
+		onSelect(selectedKeys, info) {
+			this.tree.selectedKeys = selectedKeys;
+		},
+		onSelectChange(val) {
+			this.selectedRowKeys = val
+		},
+		// multiRole(data){
+		// 	console.log(data);
+		// 	let arr = []
+		// 	for(let a of data){
+		// 		if(a.length > 0){
+		// 			for(let b of a){
+		// 				arr.push(b);
+		// 			}
+		// 		}else{
+		// 			arr.push(a);
+		// 		}
+		// 	}
+		// 	this.form.roleId = arr.toString()
+		// },
+		async sendSubmit() {
+			if(this.form.roleId == ''){
+				this.form.roleId = null
+			};
+			const res = await assignRoles(this.form);
+			if (res.code === 200) {
+				this.$message.success(res.msg);
+				this.getPeople();
+				this.sendClose();
+			} else {
+				this.$message.error(res.msg);
+			}
+		},
+		sendClose() {
+			this.form.manageUserId = undefined;
+			this.send.show = false;
+		},
+		Actions(data) {
+			// console.log(data);
+		},
+		selectionChoosed(data) {
+			// console.log(data);
+			this.tableChoosed = data;
+		},
+	},
+};
 </script>
 
 <style lang="less" scoped>
-
+.role-card {
+  line-height: 30px;
+  font-size: 16px;
+  cursor: pointer;
+  border-bottom: 1px solid #d9d9d9;
+  margin-bottom: 10px;
+  display: flex;
+  justify-content: space-between;
+}
+.role-li {
+  display: flex;
+  justify-content: space-between;
+  width: 100%;
+}
 </style>

src/views/Layout/index.vue

@@ -9,7 +9,7 @@
 <template>
     <a-layout id="components-layout-demo-custom-trigger">
         <a-layout-sider v-model="collapsed" :trigger="null" collapsible>
-            <div class="logo"><img class="m1" src="../../assets/images/512_512.png" /><span class="s1" v-if="!collapsed">小蜜蜂SaaS</span></div>
+            <div class="logo"><img class="m1" src="../../assets/images/logo.png" /><span class="s1" v-if="!collapsed">小蜜蜂SaaS</span></div>
             <yMenu :csd="collapsed" :num='tagActive'></yMenu>
         </a-layout-sider>
         <a-layout>

src/views/Login/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="bg">
     <div class="logo-box">
-      <img src="@/assets/images/512_512.png" alt="" />
+      <img src="@/assets/images/logo.png" alt="" />
       <span class="title">智慧小区后台管理系统</span>
     </div>
     <div class="login-box">
@@ -34,7 +34,7 @@
               </a-button>
               <a-row style="margin-top: 20px; margin-left: 23px">
                 <a-col :span="14">
-                  <a-checkbox></a-checkbox>&nbsp;&nbsp;我已同意<a href="/#/rule" target="tar">《用户协议》</a>
+                  <a-checkbox></a-checkbox>&nbsp;&nbsp;我已同意<a href="https://api.xiatabooking.com/uploads/privacy_xmf_manage.html" target="tar">《用户协议》</a>
                 </a-col>
                 <a-col :span="10">
                   <!-- <span class="logintext" @click="status = 3">忘记密码</span
@@ -108,7 +108,7 @@
               </a-button>
               <a-row style="margin-top: 20px; margin-left: 23px">
                 <a-col :span="14">
-                  <a-checkbox v-model="isChecked"></a-checkbox>&nbsp;&nbsp;我已同意<a href="/#/rule" target="tar">《用户协议》</a>
+                  <a-checkbox v-model="isChecked"></a-checkbox>&nbsp;&nbsp;我已同意<a href="https://api.xiatabooking.com/uploads/privacy_xmf_manage.html" target="tar">《用户协议》</a>
                 </a-col>
                 <a-col :span="10">
                   <!-- <span class="logintext" @click="status = 3">忘记密码</span

src/views/Shop/GoodsManage/_goodsList/depend/config.js

@@ -1,7 +1,22 @@
 export const columns = [
+	{
+		title: "商品状态",
+		width: "6%",
+		dataIndex: "status",
+		customRender: function (status) {
+			switch (status) {
+			case true:
+				return '已下架'
+			case false:
+				return '上架中'
+			default:
+				break;
+			}
+		}
+	},
 	{
 		title: "商品名称",
-		width: "12%",
+		width: "11%",
 		dataIndex: "skuName",
 	},
 	{
@@ -12,7 +27,7 @@ export const columns = [
 	},
 	{
 		title: "sku编码",
-		width: "10%",
+		width: "8%",
 		dataIndex: "skuId",
 	},
 	{
@@ -31,17 +46,17 @@ export const columns = [
 	},
 	{
 		title: "店铺名",
-		width: "8%",
+		width: "7%",
 		dataIndex: "shopName",
 	},
 	{
 		title: "品牌名",
-		width: "8%",
+		width: "7%",
 		dataIndex: "brandName",
 	},
 	{
 		title: "供应商名",
-		width: "8%",
+		width: "7%",
 		dataIndex: "vendorName",
 	},
 	{
@@ -96,6 +111,13 @@ export const formItem = [
 		prop:'skuName',
 		placeholder:'请输入'
 	},
+	// {
+	// 	type: 'select',
+	// 	label:'上架状态',
+	// 	prop:'status',
+	// 	placeholder:'请选择',
+	// 	option:[{ id: false,name:'下架'},{ id: true,name:'上架'}],
+	// },
 ]
 export const pagination = {
 	current: 1,

src/views/Shop/GoodsManage/_goodsList/index.vue

@@ -70,6 +70,7 @@ export default {
 			searchForm: {
 				skuId: undefined,
 				skuName: undefined,
+				status: undefined
 			},
 			columns,
 			goodsId:null,