Merge branch 'master' of https://gitee.com/beijing_hongye_huicheng/lilishop-ui
commit
66462b9085
|
@ -8,113 +8,52 @@
|
||||||
<Button @click="addRole" type="primary">添加角色</Button>
|
<Button @click="addRole" type="primary">添加角色</Button>
|
||||||
<Button @click="delAll">批量删除</Button>
|
<Button @click="delAll">批量删除</Button>
|
||||||
</Row>
|
</Row>
|
||||||
<Table
|
<Table :loading="loading" border :columns="columns" :data="data" ref="table" sortable="custom" @on-sort-change="changeSort" @on-selection-change="changeSelect"></Table>
|
||||||
:loading="loading"
|
|
||||||
border
|
|
||||||
:columns="columns"
|
|
||||||
:data="data"
|
|
||||||
ref="table"
|
|
||||||
sortable="custom"
|
|
||||||
@on-sort-change="changeSort"
|
|
||||||
@on-selection-change="changeSelect"
|
|
||||||
></Table>
|
|
||||||
<Row type="flex" justify="end" class="mt_10">
|
<Row type="flex" justify="end" class="mt_10">
|
||||||
<Page
|
<Page :current="pageNumber" :total="total" :page-size="pageSize" @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" size="small" show-total
|
||||||
:current="pageNumber"
|
show-elevator show-sizer></Page>
|
||||||
:total="total"
|
|
||||||
:page-size="pageSize"
|
|
||||||
@on-change="changePage"
|
|
||||||
@on-page-size-change="changePageSize"
|
|
||||||
:page-size-opts="[10, 20, 50]"
|
|
||||||
size="small"
|
|
||||||
show-total
|
|
||||||
show-elevator
|
|
||||||
show-sizer
|
|
||||||
></Page>
|
|
||||||
</Row>
|
</Row>
|
||||||
</Card>
|
</Card>
|
||||||
|
|
||||||
<!-- 编辑 -->
|
<!-- 编辑 -->
|
||||||
<Modal
|
<Modal :title="modalTitle" v-model="roleModalVisible" :mask-closable="false" :width="500">
|
||||||
:title="modalTitle"
|
<Form ref="roleForm" :model="roleForm" :label-width="80" :rules="roleFormValidate">
|
||||||
v-model="roleModalVisible"
|
|
||||||
:mask-closable="false"
|
|
||||||
:width="500"
|
|
||||||
>
|
|
||||||
<Form
|
|
||||||
ref="roleForm"
|
|
||||||
:model="roleForm"
|
|
||||||
:label-width="80"
|
|
||||||
:rules="roleFormValidate"
|
|
||||||
>
|
|
||||||
<FormItem label="角色名称" prop="name">
|
<FormItem label="角色名称" prop="name">
|
||||||
<Input v-model="roleForm.name"/>
|
<Input v-model="roleForm.name" />
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="备注" prop="description">
|
<FormItem label="备注" prop="description">
|
||||||
<Input v-model="roleForm.description"/>
|
<Input v-model="roleForm.description" />
|
||||||
</FormItem>
|
</FormItem>
|
||||||
</Form>
|
</Form>
|
||||||
<div slot="footer">
|
<div slot="footer">
|
||||||
<Button type="text" @click="cancelRole">取消</Button>
|
<Button type="text" @click="cancelRole">取消</Button>
|
||||||
<Button type="primary" :loading="submitLoading" @click="submitRole"
|
<Button type="primary" :loading="submitLoading" @click="submitRole">提交
|
||||||
>提交
|
</Button>
|
||||||
</Button
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
<!-- 菜单权限 -->
|
<!-- 菜单权限 -->
|
||||||
<Modal
|
<Modal :title="modalTitle" v-model="permModalVisible" :mask-closable="false" :width="500" :styles="{ top: '30px' }" class="permModal">
|
||||||
:title="modalTitle"
|
|
||||||
v-model="permModalVisible"
|
|
||||||
:mask-closable="false"
|
|
||||||
:width="500"
|
|
||||||
:styles="{ top: '30px' }"
|
|
||||||
class="permModal"
|
|
||||||
>
|
|
||||||
<div style="position: relative">
|
<div style="position: relative">
|
||||||
<Tree
|
<Tree ref="tree" :data="permData" show-checkbox :render="renderContent" :check-strictly="true">
|
||||||
ref="tree"
|
|
||||||
:data="permData"
|
|
||||||
show-checkbox
|
|
||||||
:render="renderContent"
|
|
||||||
:check-strictly="true"
|
|
||||||
>
|
|
||||||
</Tree>
|
</Tree>
|
||||||
<Spin size="large" fix v-if="treeLoading"></Spin>
|
<Spin size="large" fix v-if="treeLoading"></Spin>
|
||||||
</div>
|
</div>
|
||||||
<div slot="footer">
|
<div slot="footer">
|
||||||
<Button type="text" @click="cancelPermEdit">取消</Button>
|
<Button type="text" @click="cancelPermEdit">取消</Button>
|
||||||
<Select
|
<Select v-model="openLevel" @on-change="changeOpen" style="width: 110px; text-align: left; margin-right: 10px">
|
||||||
v-model="openLevel"
|
|
||||||
@on-change="changeOpen"
|
|
||||||
style="width: 110px; text-align: left; margin-right: 10px"
|
|
||||||
>
|
|
||||||
<Option value="0">展开所有</Option>
|
<Option value="0">展开所有</Option>
|
||||||
<Option value="1">收合所有</Option>
|
<Option value="1">收合所有</Option>
|
||||||
<Option value="2">仅展开一级</Option>
|
<Option value="2">仅展开一级</Option>
|
||||||
<Option value="3">仅展开两级</Option>
|
<Option value="3">仅展开两级</Option>
|
||||||
</Select>
|
</Select>
|
||||||
<Button
|
<Button type="primary" :loading="submitPermLoading" @click="submitPermEdit(true)">编辑
|
||||||
type="primary"
|
</Button>
|
||||||
:loading="submitPermLoading"
|
|
||||||
@click="submitPermEdit(true)"
|
|
||||||
>编辑
|
|
||||||
</Button
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
<!-- 数据权限 -->
|
<!-- 数据权限 -->
|
||||||
<Modal
|
<Modal :title="modalTitle" v-model="depModalVisible" :mask-closable="false" :width="500" class="depModal">
|
||||||
:title="modalTitle"
|
<Alert show-icon>默认可查看全部数据,自定义数据范围时请勾选下方数据
|
||||||
v-model="depModalVisible"
|
</Alert>
|
||||||
:mask-closable="false"
|
|
||||||
:width="500"
|
|
||||||
class="depModal"
|
|
||||||
>
|
|
||||||
<Alert show-icon
|
|
||||||
>默认可查看全部数据,自定义数据范围时请勾选下方数据
|
|
||||||
</Alert
|
|
||||||
>
|
|
||||||
<Form :label-width="85">
|
<Form :label-width="85">
|
||||||
<FormItem label="数据范围">
|
<FormItem label="数据范围">
|
||||||
<Select v-model="dataType" transfer>
|
<Select v-model="dataType" transfer>
|
||||||
|
@ -127,46 +66,37 @@
|
||||||
</Form>
|
</Form>
|
||||||
<div v-show="dataType == 1" style="margin-top: 15px">
|
<div v-show="dataType == 1" style="margin-top: 15px">
|
||||||
<div style="position: relative">
|
<div style="position: relative">
|
||||||
<Tree
|
<Tree ref="depTree" :data="depData" :load-data="loadData" @on-toggle-expand="expandCheckDep" multiple style="margin-top: 15px"></Tree>
|
||||||
ref="depTree"
|
|
||||||
:data="depData"
|
|
||||||
:load-data="loadData"
|
|
||||||
@on-toggle-expand="expandCheckDep"
|
|
||||||
multiple
|
|
||||||
style="margin-top: 15px"
|
|
||||||
></Tree>
|
|
||||||
<Spin size="large" fix v-if="depTreeLoading"></Spin>
|
<Spin size="large" fix v-if="depTreeLoading"></Spin>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div slot="footer">
|
<div slot="footer">
|
||||||
<Button type="text" @click="depModalVisible = false">取消</Button>
|
<Button type="text" @click="depModalVisible = false">取消</Button>
|
||||||
<Button
|
<Button type="primary" :loading="submitDepLoading" @click="submitDepEdit">提交
|
||||||
type="primary"
|
</Button>
|
||||||
:loading="submitDepLoading"
|
|
||||||
@click="submitDepEdit"
|
|
||||||
>提交
|
|
||||||
</Button
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
||||||
<!-- 保存权限弹出选择权限 -->
|
<!-- 保存权限弹出选择权限 -->
|
||||||
<Modal
|
<Modal width="800" v-model="selectIsSuperModel" title="选择菜单权限" :loading="superModelLoading" @on-ok="saveRole">
|
||||||
v-model="selectIsSuperModel"
|
<!-- <div class="btns">
|
||||||
title="选择菜单权限"
|
<Button type="primary" class="btn-item">一键选中·数据权限</Button>
|
||||||
:loading="superModelLoading"
|
<Button class="btn-item">一键选中·查看权限</Button>
|
||||||
@on-ok="saveRole"
|
</div> -->
|
||||||
>
|
<div class="role-list">
|
||||||
<div v-for="(item, index) in saveRoleWay" :key="index">
|
<div class="role-item" v-for="(item, index) in saveRoleWay" :key="index">
|
||||||
<span class="title">{{ item.title }}</span>
|
<div class="title">{{ item.title }}</div>
|
||||||
<RadioGroup type="button" button-style="solid" v-model="item.isSuper">
|
<div class="content">
|
||||||
<Radio :label="true">
|
<RadioGroup type="button" button-style="solid" v-model="item.isSuper">
|
||||||
<span>操作数据权限</span>
|
<Radio :label="true">
|
||||||
</Radio>
|
<span>操作数据权限</span>
|
||||||
<Radio :label="false">
|
</Radio>
|
||||||
<span>查看权限</span>
|
<Radio :label="false">
|
||||||
</Radio>
|
<span>查看权限</span>
|
||||||
</RadioGroup>
|
</Radio>
|
||||||
|
</RadioGroup>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
</div>
|
</div>
|
||||||
|
@ -207,19 +137,22 @@ export default {
|
||||||
permModalVisible: false, // 菜单权限modal
|
permModalVisible: false, // 菜单权限modal
|
||||||
depModalVisible: false, // 部门modal
|
depModalVisible: false, // 部门modal
|
||||||
modalTitle: "", // modal标题
|
modalTitle: "", // modal标题
|
||||||
roleForm: { // 角色表单
|
roleForm: {
|
||||||
|
// 角色表单
|
||||||
name: "",
|
name: "",
|
||||||
description: "",
|
description: "",
|
||||||
},
|
},
|
||||||
roleFormValidate: { // 验证规则
|
roleFormValidate: {
|
||||||
|
// 验证规则
|
||||||
name: [
|
name: [
|
||||||
{required: true, message: "角色名称不能为空", trigger: "blur"},
|
{ required: true, message: "角色名称不能为空", trigger: "blur" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
submitLoading: false, // 提交loading
|
submitLoading: false, // 提交loading
|
||||||
selectList: [], // 已选列表
|
selectList: [], // 已选列表
|
||||||
selectCount: 0, // 已选总数
|
selectCount: 0, // 已选总数
|
||||||
columns: [ // 表头
|
columns: [
|
||||||
|
// 表头
|
||||||
{
|
{
|
||||||
type: "selection",
|
type: "selection",
|
||||||
width: 60,
|
width: 60,
|
||||||
|
@ -234,7 +167,7 @@ export default {
|
||||||
title: "备注",
|
title: "备注",
|
||||||
key: "description",
|
key: "description",
|
||||||
minWidth: 150,
|
minWidth: 150,
|
||||||
tooltip: true
|
tooltip: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "创建时间",
|
title: "创建时间",
|
||||||
|
@ -285,7 +218,7 @@ export default {
|
||||||
{
|
{
|
||||||
props: {
|
props: {
|
||||||
size: "small",
|
size: "small",
|
||||||
type: "info"
|
type: "info",
|
||||||
},
|
},
|
||||||
style: {
|
style: {
|
||||||
marginRight: "5px",
|
marginRight: "5px",
|
||||||
|
@ -342,7 +275,7 @@ export default {
|
||||||
console.log(val);
|
console.log(val);
|
||||||
},
|
},
|
||||||
|
|
||||||
renderContent(h, {root, node, data}) {
|
renderContent(h, { root, node, data }) {
|
||||||
let icon = "";
|
let icon = "";
|
||||||
|
|
||||||
if (data.level == 0) {
|
if (data.level == 0) {
|
||||||
|
@ -384,7 +317,7 @@ export default {
|
||||||
h("span", data.title),
|
h("span", data.title),
|
||||||
h(
|
h(
|
||||||
"span",
|
"span",
|
||||||
{class: {tips: true}},
|
{ class: { tips: true } },
|
||||||
data.isSuper ? "操作权限" : "查看权限"
|
data.isSuper ? "操作权限" : "查看权限"
|
||||||
),
|
),
|
||||||
]),
|
]),
|
||||||
|
@ -655,7 +588,6 @@ export default {
|
||||||
way.push(perm);
|
way.push(perm);
|
||||||
this.saveRoleWay = way;
|
this.saveRoleWay = way;
|
||||||
});
|
});
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
/**保存权限 */
|
/**保存权限 */
|
||||||
|
@ -678,7 +610,7 @@ export default {
|
||||||
this.permModalVisible = false;
|
this.permModalVisible = false;
|
||||||
},
|
},
|
||||||
loadData(item, callback) {
|
loadData(item, callback) {
|
||||||
loadDepartment(item.id, {openDataFilter: false}).then((res) => {
|
loadDepartment(item.id, { openDataFilter: false }).then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
res.result.forEach(function (e) {
|
res.result.forEach(function (e) {
|
||||||
e.selected = false;
|
e.selected = false;
|
||||||
|
@ -777,3 +709,33 @@ export default {
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.role-list {
|
||||||
|
height: 500px;
|
||||||
|
overflow-y: auto;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
.role-item {
|
||||||
|
width: 50%;
|
||||||
|
display: flex;
|
||||||
|
padding: 20px 0;
|
||||||
|
align-items: center;
|
||||||
|
>.title{
|
||||||
|
flex: 2;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
>.content{
|
||||||
|
flex: 10;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btns{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.btn-item{
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
|
@ -102,12 +102,10 @@
|
||||||
{
|
{
|
||||||
title: "订单编号",
|
title: "订单编号",
|
||||||
key: "orderSn",
|
key: "orderSn",
|
||||||
sortType: "desc",
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "商品名称",
|
title: "商品名称",
|
||||||
slot: "goodsName",
|
slot: "goodsName",
|
||||||
sortType: "desc",
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "投诉主题",
|
title: "投诉主题",
|
||||||
|
@ -197,7 +195,7 @@
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 初始化数据
|
// 初始化数据
|
||||||
init() {
|
init() {
|
||||||
this.getDataList();
|
this.getDataList();
|
||||||
},
|
},
|
||||||
// 改变页码
|
// 改变页码
|
||||||
|
|
Loading…
Reference in New Issue