Merge branch 'master' of http://118.178.224.202:3000/ewide/ewide_core
This commit is contained in:
@@ -21,6 +21,7 @@
|
|||||||
"swiper": "^6.5.0",
|
"swiper": "^6.5.0",
|
||||||
"vue": "^2.6.11",
|
"vue": "^2.6.11",
|
||||||
"vue-awesome-swiper": "^4.1.1",
|
"vue-awesome-swiper": "^4.1.1",
|
||||||
|
"vue-color": "^2.8.1",
|
||||||
"vue-highlight.js": "^3.1.0",
|
"vue-highlight.js": "^3.1.0",
|
||||||
"vue-router": "^3.5.1"
|
"vue-router": "^3.5.1"
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -1,78 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
:visible="visible"
|
|
||||||
@cancel="onCancel"
|
|
||||||
@ok="onOk"
|
|
||||||
class="yo-modal-form"
|
|
||||||
title="新增XX"
|
|
||||||
>
|
|
||||||
<FormBody ref="form-body" />
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import FormBody from './form';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
FormBody,
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
visible: false,
|
|
||||||
confirmLoading: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
formBody() {
|
|
||||||
return this.$refs['form-body'];
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 从外部调用打开本窗口
|
|
||||||
*/
|
|
||||||
async onOpen() {
|
|
||||||
this.visible = true;
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.formBody.onInit();
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 点击保存时的操作
|
|
||||||
*/
|
|
||||||
onOk() {
|
|
||||||
this.formBody.onGetData().then((data) => {
|
|
||||||
this.confirmLoading = true;
|
|
||||||
this.$api
|
|
||||||
/** !!此处必须修改调用的接口方法 */
|
|
||||||
.testAddApi(data)
|
|
||||||
.then(({ success }) => {
|
|
||||||
if (success) {
|
|
||||||
this.$message.success('新增成功');
|
|
||||||
this.onCancel();
|
|
||||||
this.$emit('ok');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
this.confirmLoading = false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 关闭窗口时的操作
|
|
||||||
*/
|
|
||||||
onCancel() {
|
|
||||||
this.formBody.onResetFields();
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
@@ -1,79 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
:visible="visible"
|
|
||||||
@cancel="onCancel"
|
|
||||||
@ok="onOk"
|
|
||||||
class="yo-modal-form"
|
|
||||||
title="编辑XX"
|
|
||||||
>
|
|
||||||
<FormBody ref="form-body" />
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import FormBody from './form';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
FormBody,
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
visible: false,
|
|
||||||
confirmLoading: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
formBody() {
|
|
||||||
return this.$refs['form-body'];
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 从外部调用打开本窗口,并填充外部传入的数据
|
|
||||||
*/
|
|
||||||
onOpen(record) {
|
|
||||||
this.visible = true;
|
|
||||||
this.$nextTick(async () => {
|
|
||||||
await this.formBody.onInit();
|
|
||||||
this.formBody.onFillData(record);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 点击保存时的操作
|
|
||||||
*/
|
|
||||||
onOk() {
|
|
||||||
this.formBody.onGetData().then((data) => {
|
|
||||||
this.confirmLoading = true;
|
|
||||||
this.$api
|
|
||||||
/** !!此处必须修改调用的接口方法 */
|
|
||||||
.testEditApi(data)
|
|
||||||
.then(({ success }) => {
|
|
||||||
if (success) {
|
|
||||||
this.$message.success('编辑成功');
|
|
||||||
this.onCancel();
|
|
||||||
this.$emit('ok');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
this.confirmLoading = false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 关闭窗口时的操作
|
|
||||||
*/
|
|
||||||
onCancel() {
|
|
||||||
this.formBody.onResetFields();
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
@@ -1,27 +1,41 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<!--
|
||||||
|
普通编辑窗体
|
||||||
|
v 1.2
|
||||||
|
2021-04-30
|
||||||
|
Lufthafen
|
||||||
|
-->
|
||||||
<a-form-model :model="form" :rules="rules" class="yo-form" ref="form">
|
<a-form-model :model="form" :rules="rules" class="yo-form" ref="form">
|
||||||
<a-spin :spinning="loading">
|
<a-spin :spinning="loading">
|
||||||
<a-icon slot="indicator" spin type="loading" />
|
<a-icon slot="indicator" spin type="loading" />
|
||||||
<div class="yo-form-group">
|
<div class="yo-form-group">
|
||||||
<!-- 表单控件 -->
|
<!-- 表单控件 -->
|
||||||
|
<!-- ... -->
|
||||||
</div>
|
</div>
|
||||||
</a-spin>
|
</a-spin>
|
||||||
</a-form-model>
|
</a-form-model>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
/* 表单内容默认值 */
|
||||||
|
const defaultForm = {
|
||||||
|
/* ... */
|
||||||
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
/** 表单数据 */
|
/** 表单数据 */
|
||||||
form: {},
|
form: {},
|
||||||
/** 验证格式 */
|
/** 验证格式 */
|
||||||
rules: {},
|
rules: {
|
||||||
|
/* ... */
|
||||||
|
},
|
||||||
|
|
||||||
/** 加载异步数据状态 */
|
/** 加载异步数据状态 */
|
||||||
loading: false,
|
loading: false,
|
||||||
|
|
||||||
/** 其他成员属性 */
|
/** 其他成员属性 */
|
||||||
/** ... */
|
/* ... */
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -30,12 +44,13 @@ export default {
|
|||||||
* 必要的方法
|
* 必要的方法
|
||||||
* 在打开编辑页时允许填充数据
|
* 在打开编辑页时允许填充数据
|
||||||
*/
|
*/
|
||||||
onFillData(record) {
|
onFillData(params) {
|
||||||
/** 将默认数据覆盖到form */
|
/** 将默认数据覆盖到form */
|
||||||
this.form = this.$_.cloneDeep({
|
this.form = this.$_.cloneDeep({
|
||||||
...record,
|
...defaultForm,
|
||||||
/** 在此处添加默认数据转换 */
|
...params.record,
|
||||||
/** ... */
|
/** 在此处添加其他默认数据转换 */
|
||||||
|
/* ... */
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -50,7 +65,7 @@ export default {
|
|||||||
const record = this.$_.cloneDeep(this.form);
|
const record = this.$_.cloneDeep(this.form);
|
||||||
|
|
||||||
/** 验证通过后可以对数据进行转换得到想要提交的格式 */
|
/** 验证通过后可以对数据进行转换得到想要提交的格式 */
|
||||||
/** ... */
|
/* ... */
|
||||||
|
|
||||||
reslove(record);
|
reslove(record);
|
||||||
} else {
|
} else {
|
||||||
@@ -77,7 +92,7 @@ export default {
|
|||||||
this.$refs.form.resetFields();
|
this.$refs.form.resetFields();
|
||||||
|
|
||||||
/** 在这里可以初始化当前组件中其他属性 */
|
/** 在这里可以初始化当前组件中其他属性 */
|
||||||
/** ... */
|
/* ... */
|
||||||
}, 300);
|
}, 300);
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -85,16 +100,15 @@ export default {
|
|||||||
* 必要方法
|
* 必要方法
|
||||||
* 加载当前表单中所需要的异步数据
|
* 加载当前表单中所需要的异步数据
|
||||||
*/
|
*/
|
||||||
async onInit() {
|
async onInit(params) {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
/** 可以在这里await获取一些异步数据 */
|
/** 可以在这里await获取一些异步数据 */
|
||||||
/** ...BEGIN */
|
/* ... */
|
||||||
/** ...END */
|
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
},
|
},
|
||||||
|
|
||||||
/** 当前组件的其他方法 */
|
/** 当前组件的其他方法 */
|
||||||
/** ... */
|
/* ... */
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -1,26 +1,29 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<!--
|
||||||
|
普通查询表格
|
||||||
|
v 1.2
|
||||||
|
2021-04-30
|
||||||
|
Lufthafen
|
||||||
|
-->
|
||||||
<container>
|
<container>
|
||||||
<br />
|
<br />
|
||||||
<a-card :bordered="false">
|
<a-card :bordered="false">
|
||||||
<Auth auth="authCode:page">
|
<yo-table
|
||||||
<div class="yo-query-bar">
|
:columns="columns"
|
||||||
<a-form-model :model="query" layout="inline">
|
:load-data="loadData"
|
||||||
<!-- 此处添加查询表单控件 -->
|
@query="onQuery"
|
||||||
<a-form-model-item>
|
@resetQuery="onResetQuery"
|
||||||
<a-button-group>
|
ref="table"
|
||||||
<a-button @click="onQuery" type="primary">查询</a-button>
|
>
|
||||||
<a-button @click="onResetQuery">重置</a-button>
|
<Auth auth="authCode:page" slot="query">
|
||||||
</a-button-group>
|
<!-- 此处添加查询表单控件 -->
|
||||||
</a-form-model-item>
|
<!-- ... -->
|
||||||
</a-form-model>
|
</Auth>
|
||||||
</div>
|
|
||||||
</Auth>
|
|
||||||
|
|
||||||
<yo-table :columns="columns" :load-data="loadData" ref="table">
|
|
||||||
<Auth auth="authCode:add" slot="operator">
|
<Auth auth="authCode:add" slot="operator">
|
||||||
<a-button @click="onOpen('add-form')" icon="plus">新增XX</a-button>
|
<a-button @click="onOpen('add-form')" icon="plus">新增...</a-button>
|
||||||
</Auth>
|
</Auth>
|
||||||
<!-- 格式化字段内容 -->
|
<!-- 格式化字段内容 -->
|
||||||
|
<!-- ... -->
|
||||||
<!-- 添加操作控件 -->
|
<!-- 添加操作控件 -->
|
||||||
<span slot="action" slot-scope="text, record">
|
<span slot="action" slot-scope="text, record">
|
||||||
<yo-table-actions>
|
<yo-table-actions>
|
||||||
@@ -33,35 +36,52 @@
|
|||||||
</a-popconfirm>
|
</a-popconfirm>
|
||||||
</Auth>
|
</Auth>
|
||||||
<!-- 可在此处添加其他操作控件 -->
|
<!-- 可在此处添加其他操作控件 -->
|
||||||
|
<!-- ... -->
|
||||||
</yo-table-actions>
|
</yo-table-actions>
|
||||||
</span>
|
</span>
|
||||||
</yo-table>
|
</yo-table>
|
||||||
</a-card>
|
</a-card>
|
||||||
<br />
|
|
||||||
<add-form @ok="onReloadData" ref="add-form" />
|
<!-- 新增表单 -->
|
||||||
<edit-form @ok="onReloadData" ref="edit-form" />
|
<yo-modal-form :action="$api[api.add]" :title="'新增' + name" @ok="onReloadData" ref="add-form">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
|
|
||||||
|
<!-- 编辑表单 -->
|
||||||
|
<yo-modal-form :action="$api[api.edit]" :title="'编辑' + name" @ok="onReloadData" ref="edit-form">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
</container>
|
</container>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import AddForm from './addForm';
|
import FormBody from './form';
|
||||||
import EditForm from './editForm';
|
|
||||||
|
|
||||||
/* 在此管理整个页面需要的接口名称 */
|
/* 在此管理整个页面需要的接口名称 */
|
||||||
const api = {
|
const api = {
|
||||||
page: 'testPageApi',
|
page: 'testPageApi...',
|
||||||
delete: 'testDeleteApi',
|
add: 'testAddApi',
|
||||||
|
edit: 'testEditApi',
|
||||||
|
delete: 'testDeleteApi...',
|
||||||
/* ... */
|
/* ... */
|
||||||
};
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
AddForm,
|
FormBody,
|
||||||
EditForm,
|
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
api,
|
||||||
|
|
||||||
|
name: '...',
|
||||||
|
|
||||||
|
/* 查询条件 */
|
||||||
query: {},
|
query: {},
|
||||||
|
|
||||||
|
/* 表格字段 */
|
||||||
columns: [],
|
columns: [],
|
||||||
|
|
||||||
|
/* 字典编码储存格式 */
|
||||||
codes: {
|
codes: {
|
||||||
code1: [],
|
code1: [],
|
||||||
code2: [],
|
code2: [],
|
||||||
@@ -69,10 +89,11 @@ export default {
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
/** 按需加载字典编码 */
|
||||||
this.onLoadCodes();
|
this.onLoadCodes();
|
||||||
|
|
||||||
/** 根据权限添加操作列 */
|
/** 根据权限添加操作列 */
|
||||||
const flag = this.$auth(/** ... */);
|
const flag = this.$auth(/* ... */);
|
||||||
if (flag) {
|
if (flag) {
|
||||||
this.columns.push({
|
this.columns.push({
|
||||||
title: '操作',
|
title: '操作',
|
||||||
@@ -132,10 +153,12 @@ export default {
|
|||||||
.$queue([
|
.$queue([
|
||||||
this.$api.sysDictTypeDropDownAwait({ code: 'code1' }),
|
this.$api.sysDictTypeDropDownAwait({ code: 'code1' }),
|
||||||
this.$api.sysDictTypeDropDownAwait({ code: 'code2' }),
|
this.$api.sysDictTypeDropDownAwait({ code: 'code2' }),
|
||||||
|
/* ... */
|
||||||
])
|
])
|
||||||
.then(([code1, code2]) => {
|
.then(([code1, code2]) => {
|
||||||
this.codes.code1 = code1.data;
|
this.codes.code1 = code1.data;
|
||||||
this.codes.code2 = code2.data;
|
this.codes.code2 = code2.data;
|
||||||
|
/* ... */
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -156,7 +179,11 @@ export default {
|
|||||||
* 从列表页调用窗口的打开方法
|
* 从列表页调用窗口的打开方法
|
||||||
*/
|
*/
|
||||||
onOpen(formName, record) {
|
onOpen(formName, record) {
|
||||||
this.$refs[formName].onOpen(record);
|
this.$refs[formName].onOpen({
|
||||||
|
record,
|
||||||
|
/* 按需添加其他参数 */
|
||||||
|
/* ... */
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -1,4 +1,10 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<!--
|
||||||
|
普通树查询表格
|
||||||
|
v 1.2
|
||||||
|
2021-04-30
|
||||||
|
Lufthafen
|
||||||
|
-->
|
||||||
<yo-tree-layout
|
<yo-tree-layout
|
||||||
:load-data="loadTreeData"
|
:load-data="loadTreeData"
|
||||||
@select="onSelect"
|
@select="onSelect"
|
||||||
@@ -7,72 +13,90 @@
|
|||||||
>
|
>
|
||||||
<container>
|
<container>
|
||||||
<a-card :bordered="false">
|
<a-card :bordered="false">
|
||||||
<Auth auth="authCode:page">
|
<yo-table
|
||||||
<div class="yo-query-bar">
|
:columns="columns"
|
||||||
<a-form-model :model="query" layout="inline">
|
:load-data="loadData"
|
||||||
<!-- 此处添加查询表单控件 -->
|
@query="onQuery"
|
||||||
<a-form-model-item>
|
@resetQuery="onResetQuery"
|
||||||
<a-button-group>
|
ref="table"
|
||||||
<a-button @click="onQuery" type="primary">查询</a-button>
|
>
|
||||||
<a-button @click="onReset">重置</a-button>
|
<Auth auth="authCode:page" slot="query">
|
||||||
</a-button-group>
|
<!-- 此处添加查询表单控件 -->
|
||||||
</a-form-model-item>
|
<!-- ... -->
|
||||||
</a-form-model>
|
</Auth>
|
||||||
</div>
|
<Auth auth="authCode:add" slot="operator">
|
||||||
|
<a-button @click="onOpen('add-form')" icon="plus">新增机构</a-button>
|
||||||
<yo-table :columns="columns" :load-data="loadData" ref="table">
|
</Auth>
|
||||||
<Auth auth="authCode:add" slot="operator">
|
<!-- 格式化字段内容 -->
|
||||||
<a-button @click="onOpen('add-form')" icon="plus">新增机构</a-button>
|
<!-- ... -->
|
||||||
</Auth>
|
<!-- 添加操作控件 -->
|
||||||
<!-- 格式化字段内容 -->
|
<span slot="action" slot-scope="text, record">
|
||||||
<!-- 添加操作控件 -->
|
<yo-table-actions>
|
||||||
<span slot="action" slot-scope="text, record">
|
<Auth auth="authCode:edit">
|
||||||
<yo-table-actions>
|
<a @click="onOpen('edit-form', record)">编辑</a>
|
||||||
<Auth auth="authCode:edit">
|
</Auth>
|
||||||
<a @click="onOpen('edit-form', record)">编辑</a>
|
<Auth auth="authCode:delete">
|
||||||
</Auth>
|
<a-popconfirm @confirm="onDelete(record)" placement="topRight" title="是否确认删除">
|
||||||
<Auth auth="authCode:delete">
|
<a>删除</a>
|
||||||
<a-popconfirm @confirm="onDelete(record)" placement="topRight" title="是否确认删除">
|
</a-popconfirm>
|
||||||
<a>删除</a>
|
</Auth>
|
||||||
</a-popconfirm>
|
<!-- 可在此处添加其他操作控件 -->
|
||||||
</Auth>
|
<!-- ... -->
|
||||||
<!-- 可在此处添加其他操作控件 -->
|
</yo-table-actions>
|
||||||
</yo-table-actions>
|
</span>
|
||||||
</span>
|
</yo-table>
|
||||||
</yo-table>
|
|
||||||
</Auth>
|
|
||||||
</a-card>
|
</a-card>
|
||||||
</container>
|
</container>
|
||||||
<add-form @ok="onReloadData" ref="add-form" />
|
|
||||||
<edit-form @ok="onReloadData" ref="edit-form" />
|
<!-- 新增表单 -->
|
||||||
|
<yo-modal-form :action="$api[api.add]" :title="'新增' + name" @ok="onReloadData" ref="add-form">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
|
|
||||||
|
<!-- 编辑表单 -->
|
||||||
|
<yo-modal-form :action="$api[api.edit]" :title="'编辑' + name" @ok="onReloadData" ref="edit-form">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
</yo-tree-layout>
|
</yo-tree-layout>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
/* 需要引用YoTreeLayout组件 */
|
/* 需要引用YoTreeLayout组件 */
|
||||||
import YoTreeLayout from '@/components/yoTreeLayout';
|
import YoTreeLayout from '@/components/yoTreeLayout';
|
||||||
|
import FormBody from './form';
|
||||||
import AddForm from './addForm';
|
|
||||||
import EditForm from './editForm';
|
|
||||||
|
|
||||||
/* 在此管理整个页面需要的接口名称 */
|
/* 在此管理整个页面需要的接口名称 */
|
||||||
const api = {
|
const api = {
|
||||||
tree: 'testTreeApi',
|
tree: 'testTreeApi...',
|
||||||
page: 'testPageApi',
|
page: 'testPageApi...',
|
||||||
delete: 'testDeleteApi',
|
add: 'testAddApi',
|
||||||
|
edit: 'testEditApi',
|
||||||
|
delete: 'testDeleteApi...',
|
||||||
/* ... */
|
/* ... */
|
||||||
};
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
YoTreeLayout,
|
YoTreeLayout,
|
||||||
AddForm,
|
FormBody,
|
||||||
EditForm,
|
|
||||||
},
|
},
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
api,
|
||||||
|
|
||||||
|
name: '...',
|
||||||
|
|
||||||
|
/* 查询条件 */
|
||||||
query: {},
|
query: {},
|
||||||
|
|
||||||
|
/* 表格字段 */
|
||||||
columns: [],
|
columns: [],
|
||||||
|
|
||||||
|
/* 字典编码储存格式 */
|
||||||
|
codes: {
|
||||||
|
code1: [],
|
||||||
|
code2: [],
|
||||||
|
},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -80,7 +104,7 @@ export default {
|
|||||||
this.onLoadCodes();
|
this.onLoadCodes();
|
||||||
|
|
||||||
/** 根据权限添加操作列 */
|
/** 根据权限添加操作列 */
|
||||||
const flag = this.$auth(/** ... */);
|
const flag = this.$auth(/* ... */);
|
||||||
if (flag) {
|
if (flag) {
|
||||||
this.columns.push({
|
this.columns.push({
|
||||||
title: '操作',
|
title: '操作',
|
||||||
@@ -107,7 +131,7 @@ export default {
|
|||||||
* 选择树节点事件
|
* 选择树节点事件
|
||||||
*/
|
*/
|
||||||
onSelect([id]) {
|
onSelect([id]) {
|
||||||
/* 在选择事件中可以对右侧表格添加父节点id的查询条件 */
|
/** 在选择事件中可以对右侧表格添加父节点id的查询条件 */
|
||||||
this.query = {
|
this.query = {
|
||||||
pid: id,
|
pid: id,
|
||||||
};
|
};
|
||||||
@@ -168,10 +192,12 @@ export default {
|
|||||||
.$queue([
|
.$queue([
|
||||||
this.$api.sysDictTypeDropDownAwait({ code: 'code1' }),
|
this.$api.sysDictTypeDropDownAwait({ code: 'code1' }),
|
||||||
this.$api.sysDictTypeDropDownAwait({ code: 'code2' }),
|
this.$api.sysDictTypeDropDownAwait({ code: 'code2' }),
|
||||||
|
/* ... */
|
||||||
])
|
])
|
||||||
.then(([code1, code2]) => {
|
.then(([code1, code2]) => {
|
||||||
this.codes.code1 = code1.data;
|
this.codes.code1 = code1.data;
|
||||||
this.codes.code2 = code2.data;
|
this.codes.code2 = code2.data;
|
||||||
|
/* ... */
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -192,7 +218,12 @@ export default {
|
|||||||
* 从列表页调用窗口的打开方法
|
* 从列表页调用窗口的打开方法
|
||||||
*/
|
*/
|
||||||
onOpen(formName, record) {
|
onOpen(formName, record) {
|
||||||
this.$refs[formName].onOpen(record, this.query['pid']);
|
this.$refs[formName].onOpen({
|
||||||
|
record,
|
||||||
|
pid: this.query.pid,
|
||||||
|
/* 按需添加其他参数 */
|
||||||
|
/* ... */
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -4,12 +4,9 @@
|
|||||||
.main(@nav-background: @layout-header-background;
|
.main(@nav-background: @layout-header-background;
|
||||||
@nav-box-shadow-color: fade(@black, 25%);
|
@nav-box-shadow-color: fade(@black, 25%);
|
||||||
@nav-scrollbar-background: fade(@white, 50%);
|
@nav-scrollbar-background: fade(@white, 50%);
|
||||||
|
@nav-app-color: fade(@white, 35%);
|
||||||
@logo-color: @white;
|
@logo-color: @white;
|
||||||
@logo-box-shadow: none;
|
@logo-box-shadow: none;
|
||||||
@app-selector-color: @white;
|
|
||||||
@app-selector-border-color: fade(@white, 10%);
|
|
||||||
@app-selector-background-color: fade(@white, 30%);
|
|
||||||
@app-selector-box-shadow-color: fade(@white, 15%);
|
|
||||||
@header-action-color: fade(@white, 60%);
|
@header-action-color: fade(@white, 60%);
|
||||||
@header-action-hover-color: @white;
|
@header-action-hover-color: @white;
|
||||||
@header-action-hover-background: fade(@white, 20%);
|
@header-action-hover-background: fade(@white, 20%);
|
||||||
|
|||||||
@@ -3,12 +3,9 @@
|
|||||||
.main(@nav-background: @white;
|
.main(@nav-background: @white;
|
||||||
@nav-box-shadow-color: fade(@black, 5%);
|
@nav-box-shadow-color: fade(@black, 5%);
|
||||||
@nav-scrollbar-background: fade(@black, 30%);
|
@nav-scrollbar-background: fade(@black, 30%);
|
||||||
|
@nav-app-color: fade(@black, 35%);
|
||||||
@logo-color: @black;
|
@logo-color: @black;
|
||||||
@logo-box-shadow: inset -1px -1px 1px @border-color-split;
|
@logo-box-shadow: inset -1px -1px 1px @border-color-split;
|
||||||
@app-selector-color: @primary-6;
|
|
||||||
@app-selector-border-color: @primary-3;
|
|
||||||
@app-selector-background-color: @primary-1;
|
|
||||||
@app-selector-box-shadow-color: @primary-1;
|
|
||||||
@header-action-color: fade(@black, 35%);
|
@header-action-color: fade(@black, 35%);
|
||||||
@header-action-hover-color: @icon-color-hover;
|
@header-action-hover-color: @icon-color-hover;
|
||||||
@header-action-hover-background: fade(@black, 5%);
|
@header-action-hover-background: fade(@black, 5%);
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
@import (reference) '~@/assets/style/extend.less';
|
@import (reference) '~@/assets/style/extend.less';
|
||||||
@container-width: 1200px;
|
@container-width: 1400px;
|
||||||
.container {
|
.container {
|
||||||
width: @container-width;
|
width: @container-width;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
|||||||
@@ -207,22 +207,34 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.yo-drawer-form {
|
.yo-drawer-form {
|
||||||
|
.ant-drawer-wrapper-body {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
.ant-drawer-header {
|
.ant-drawer-header {
|
||||||
position: absolute;
|
flex: 0 0 auto;
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
z-index: 7;
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
}
|
}
|
||||||
.ant-drawer-body {
|
.ant-drawer-body {
|
||||||
padding: @padding-lg + 56px @padding-lg;
|
position: relative;
|
||||||
|
|
||||||
|
flex: 1 1 100%;
|
||||||
|
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.yo-drawer-form--body {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: @border-width-base + 20px + @padding-md * 2;
|
||||||
|
|
||||||
|
overflow: auto;
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
padding: @padding-lg;
|
||||||
}
|
}
|
||||||
.ant-drawer-footer {
|
.ant-drawer-footer {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
z-index: 7;
|
|
||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 10px @padding-md;
|
padding: 10px @padding-md;
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
@import (reference) '~@/assets/style/extend.less';
|
||||||
.hide {
|
.hide {
|
||||||
visibility: hidden !important;
|
visibility: hidden !important;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,3 +0,0 @@
|
|||||||
.w-100-p {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
@@ -1,3 +1,4 @@
|
|||||||
|
@import (reference) '~@/assets/style/extend.less';
|
||||||
.w-100-p {
|
.w-100-p {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -4,12 +4,9 @@
|
|||||||
.main(@nav-background: @layout-header-background,
|
.main(@nav-background: @layout-header-background,
|
||||||
@nav-box-shadow-color: fade(@black, 25%),
|
@nav-box-shadow-color: fade(@black, 25%),
|
||||||
@nav-scrollbar-background: fade(@white, 30%),
|
@nav-scrollbar-background: fade(@white, 30%),
|
||||||
|
@nav-app-color: fade(@white, 35%),
|
||||||
@logo-color: @white,
|
@logo-color: @white,
|
||||||
@logo-box-shadow: none,
|
@logo-box-shadow: none,
|
||||||
@app-selector-color: @white,
|
|
||||||
@app-selector-border-color: fade(@white, 10%),
|
|
||||||
@app-selector-background-color: fade(@white, 30%),
|
|
||||||
@app-selector-box-shadow-color: fade(@white, 15%),
|
|
||||||
@header-action-color: fade(@white, 60%),
|
@header-action-color: fade(@white, 60%),
|
||||||
@header-action-hover-color: @white,
|
@header-action-hover-color: @white,
|
||||||
@header-action-hover-background: fade(@white, 20%),
|
@header-action-hover-background: fade(@white, 20%),
|
||||||
@@ -251,6 +248,52 @@
|
|||||||
border-right: 0;
|
border-right: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.yo-nav {
|
||||||
|
padding-top: @padding-lg;
|
||||||
|
padding-bottom: @padding-lg;
|
||||||
|
&--row {
|
||||||
|
padding: 1px 0;
|
||||||
|
|
||||||
|
column-gap: @padding-md;
|
||||||
|
column-count: 3;
|
||||||
|
}
|
||||||
|
&--col {
|
||||||
|
break-inside: avoid;
|
||||||
|
}
|
||||||
|
&--sub-item {
|
||||||
|
}
|
||||||
|
&--item-group {
|
||||||
|
font-size: @font-size-base;
|
||||||
|
line-height: 1.5;
|
||||||
|
|
||||||
|
margin-bottom: @padding-xs;
|
||||||
|
padding-top: @padding-xs * 2;
|
||||||
|
|
||||||
|
color: fade(@black, 35%);
|
||||||
|
border: @border-width-base @border-style-base transparent;
|
||||||
|
}
|
||||||
|
&--item {
|
||||||
|
font-size: @font-size-base;
|
||||||
|
line-height: 1.5;
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
margin-bottom: @padding-xs;
|
||||||
|
padding: @padding-xs @padding-sm;
|
||||||
|
|
||||||
|
cursor: pointer;
|
||||||
|
transition: @animation-duration-fast;
|
||||||
|
|
||||||
|
border: @border-width-base @border-style-base @border-color-split;
|
||||||
|
border-radius: @border-radius-base;
|
||||||
|
background-color: @white;
|
||||||
|
&:hover {
|
||||||
|
color: @white;
|
||||||
|
border-color: @primary-color;
|
||||||
|
background-color: @primary-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.yo-layout--left-menu,
|
.yo-layout--left-menu,
|
||||||
.yo-layout--right-menu {
|
.yo-layout--right-menu {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@@ -345,15 +388,21 @@
|
|||||||
position: relative;
|
position: relative;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex: 1 1 100%;
|
flex: 1 1 100%;
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
box-shadow: 2px 0 8px @nav-box-shadow-color;
|
box-shadow: 2px 0 8px @nav-box-shadow-color;
|
||||||
|
&--app {
|
||||||
|
font-size: @font-size-sm;
|
||||||
|
|
||||||
|
margin-top: @padding-sm;
|
||||||
|
padding: 0 @padding-md;
|
||||||
|
|
||||||
|
color: @nav-app-color;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.swiper-container {
|
.swiper-container {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: (@layout-header-height / 2) + (@padding-xxs * 2);
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
|
|
||||||
@@ -385,28 +434,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.yo-apps-selector {
|
|
||||||
>span {
|
|
||||||
line-height: @layout-header-height / 2 - 2px;
|
|
||||||
|
|
||||||
display: block;
|
|
||||||
|
|
||||||
height: @layout-header-height / 2;
|
|
||||||
margin: @padding-xxs @padding-xs;
|
|
||||||
|
|
||||||
cursor: pointer;
|
|
||||||
transition: @animation-duration-slow box-shadow;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
color: @app-selector-color;
|
|
||||||
border: @border-width-base @border-style-base @app-selector-border-color;
|
|
||||||
border-radius: @border-radius-base;
|
|
||||||
background-color: @app-selector-background-color;
|
|
||||||
&:hover {
|
|
||||||
box-shadow: 0 0 15px @app-selector-box-shadow-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { api } from '@/common/api'
|
import { api } from '@/common/api'
|
||||||
import { token } from '@/common/token'
|
import { token } from '@/common/token'
|
||||||
import { GLOBAL_INFO_KEY, ACTIVE_APP_KEY } from '@/common/storage'
|
import { GLOBAL_INFO_KEY } from '@/common/storage'
|
||||||
import { encryptByDES, decryptByDES } from '@/util/des'
|
import { encryptByDES, decryptByDES } from '@/util/des'
|
||||||
import app from '@/main'
|
import app from '@/main'
|
||||||
|
|
||||||
@@ -50,7 +50,6 @@ const doLogout = () => {
|
|||||||
if (success) {
|
if (success) {
|
||||||
removeGlobal()
|
removeGlobal()
|
||||||
token.value = ''
|
token.value = ''
|
||||||
window.localStorage.removeItem(ACTIVE_APP_KEY)
|
|
||||||
if (app.$route.path === '/') {
|
if (app.$route.path === '/') {
|
||||||
app.$router.replace('/login')
|
app.$router.replace('/login')
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
@@ -1,11 +1,9 @@
|
|||||||
const SESSION_KEY = '__SESSION'
|
const SESSION_KEY = '__SESSION'
|
||||||
const SETTING_KEY = '__SETTINGS'
|
const SETTING_KEY = '__SETTINGS'
|
||||||
const GLOBAL_INFO_KEY = '__GLOBAL_INFO'
|
const GLOBAL_INFO_KEY = '__GLOBAL_INFO'
|
||||||
const ACTIVE_APP_KEY = '__ACTIVE_APP'
|
|
||||||
|
|
||||||
export {
|
export {
|
||||||
SESSION_KEY,
|
SESSION_KEY,
|
||||||
SETTING_KEY,
|
SETTING_KEY,
|
||||||
GLOBAL_INFO_KEY,
|
GLOBAL_INFO_KEY,
|
||||||
ACTIVE_APP_KEY
|
|
||||||
}
|
}
|
||||||
148
Web/src/components/yoModalForm/index.js
Normal file
148
Web/src/components/yoModalForm/index.js
Normal file
@@ -0,0 +1,148 @@
|
|||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
type: {
|
||||||
|
type: String,
|
||||||
|
default: 'modal',
|
||||||
|
validator: function (value) {
|
||||||
|
return ['modal', 'drawer'].indexOf(value) > -1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
compareOnClose: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
|
},
|
||||||
|
action: {
|
||||||
|
type: Function
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
visible: false,
|
||||||
|
confirmLoading: false,
|
||||||
|
|
||||||
|
form: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
computed: {
|
||||||
|
body() {
|
||||||
|
return this.$slots.default && this.$slots.default[0].componentInstance
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
created() {
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
renderModal(props) {
|
||||||
|
|
||||||
|
const _props = {
|
||||||
|
...props,
|
||||||
|
confirmLoading: this.confirmLoading
|
||||||
|
}
|
||||||
|
|
||||||
|
const _on = {
|
||||||
|
cancel: () => this.onClose(this.compareOnClose),
|
||||||
|
ok: () => this.onOk()
|
||||||
|
}
|
||||||
|
|
||||||
|
return (<a-modal {...{ props: _props, on: _on }} class="yo-modal-form">
|
||||||
|
{this.renderBody()}
|
||||||
|
</a-modal>)
|
||||||
|
},
|
||||||
|
|
||||||
|
renderDrawer(props) {
|
||||||
|
|
||||||
|
const _props = {
|
||||||
|
...props
|
||||||
|
}
|
||||||
|
|
||||||
|
const _on = {
|
||||||
|
close: () => this.onClose(this.compareOnClose),
|
||||||
|
ok: () => this.onOk()
|
||||||
|
}
|
||||||
|
|
||||||
|
return (<a-drawer {...{ props: _props, on: _on }} class="yo-drawer-form">
|
||||||
|
<div class="yo-drawer-form--body">
|
||||||
|
{this.renderBody()}
|
||||||
|
</div>
|
||||||
|
<div class="ant-drawer-footer">
|
||||||
|
<a-button onClick={_on.close}>取消</a-button>
|
||||||
|
<a-button loading={this.confirmLoading} onClick={_on.ok} type="primary">确定</a-button>
|
||||||
|
</div >
|
||||||
|
</a-drawer>)
|
||||||
|
},
|
||||||
|
|
||||||
|
renderBody() {
|
||||||
|
return this.$scopedSlots.default && this.$scopedSlots.default()
|
||||||
|
},
|
||||||
|
|
||||||
|
onOpen(data) {
|
||||||
|
this.visible = true
|
||||||
|
this.$nextTick(async () => {
|
||||||
|
if (!this.body) return
|
||||||
|
|
||||||
|
this.body.onInit && await this.body.onInit(data)
|
||||||
|
this.body.onFillData && this.body.onFillData(data)
|
||||||
|
this.form = this.$_.cloneDeep(this.body.form)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
onClose(compare = false) {
|
||||||
|
const close = () => {
|
||||||
|
this.body
|
||||||
|
&& this.body.onResetFields
|
||||||
|
&& this.body.onResetFields()
|
||||||
|
this.visible = false
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.body) {
|
||||||
|
if (!this.$_.isEqual(this.form, this.body.form) && compare) {
|
||||||
|
this.$confirm({
|
||||||
|
title: '是否确认关闭',
|
||||||
|
content: '当前内容已更改，是否确认不保存并且关闭',
|
||||||
|
onOk: () => {
|
||||||
|
close()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
close()
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
close()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
onOk() {
|
||||||
|
this.body
|
||||||
|
&& this.body.onGetData
|
||||||
|
&& this.body.onGetData()
|
||||||
|
.then((data) => {
|
||||||
|
this.confirmLoading = true
|
||||||
|
this.action
|
||||||
|
&& this.action(data)
|
||||||
|
.then(({ success }) => {
|
||||||
|
if (success) {
|
||||||
|
this.$message.success('保存成功');
|
||||||
|
this.onClose();
|
||||||
|
this.$emit('ok');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
this.confirmLoading = false
|
||||||
|
})
|
||||||
|
}).catch(() => { })
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const props = {
|
||||||
|
...this.$props,
|
||||||
|
...this.$attrs,
|
||||||
|
visible: this.visible
|
||||||
|
}
|
||||||
|
|
||||||
|
return this.type === 'modal' ? this.renderModal(props) : this.renderDrawer(props)
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -151,6 +151,15 @@ export default {
|
|||||||
})
|
})
|
||||||
return data
|
return data
|
||||||
},
|
},
|
||||||
|
|
||||||
|
onQuery() {
|
||||||
|
this.$emit('query')
|
||||||
|
},
|
||||||
|
|
||||||
|
onResetQuery() {
|
||||||
|
this.$emit('resetQuery')
|
||||||
|
this.$emit('reset-query')
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
@@ -161,7 +170,7 @@ export default {
|
|||||||
columns: this.columns.filter(p => !p.hidden),
|
columns: this.columns.filter(p => !p.hidden),
|
||||||
bordered: true,
|
bordered: true,
|
||||||
size: 'middle',
|
size: 'middle',
|
||||||
rowKey: record => record.id,
|
rowKey: record => record.id || Math.random().toString(16).slice(2),
|
||||||
scroll: { x: 'max-content' }
|
scroll: { x: 'max-content' }
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -169,16 +178,33 @@ export default {
|
|||||||
change: this.onTableChange,
|
change: this.onTableChange,
|
||||||
...this.$listeners
|
...this.$listeners
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const queryOn = {
|
||||||
|
'submit.native.prevent': () => { }
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section>
|
<section>
|
||||||
<a-alert type="warning" closable>
|
<a-alert type="warning" closable>
|
||||||
<template slot="message">
|
<template slot="message">
|
||||||
后端没有排序参数
|
|
||||||
<br />
|
|
||||||
字段固定应该遵循左侧固定到最左,右侧固定到最右(此逻辑难以实现)
|
字段固定应该遵循左侧固定到最左,右侧固定到最右(此逻辑难以实现)
|
||||||
</template>
|
</template>
|
||||||
</a-alert>
|
</a-alert>
|
||||||
<br />
|
<br />
|
||||||
|
{
|
||||||
|
this.$scopedSlots.query &&
|
||||||
|
<div class="yo-query-bar">
|
||||||
|
<a-form-model layout="inline" {...{ on: queryOn }}>
|
||||||
|
{this.$scopedSlots.query()}
|
||||||
|
<a-form-model-item>
|
||||||
|
<a-button-group>
|
||||||
|
<a-button onClick={this.onQuery} html-type="submit" type="primary">查询</a-button>
|
||||||
|
<a-button onClick={this.onResetQuery}>重置</a-button>
|
||||||
|
</a-button-group>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-form-model>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
<div class="yo-action-bar">
|
<div class="yo-action-bar">
|
||||||
<div class="yo-action-bar--actions">
|
<div class="yo-action-bar--actions">
|
||||||
{this.$scopedSlots.operator && this.$scopedSlots.operator()}
|
{this.$scopedSlots.operator && this.$scopedSlots.operator()}
|
||||||
|
|||||||
@@ -78,6 +78,8 @@ import YoTable from './components/yoTable'
|
|||||||
Vue.component('YoTable', YoTable)
|
Vue.component('YoTable', YoTable)
|
||||||
import YoTableActions from './components/yoTableActions'
|
import YoTableActions from './components/yoTableActions'
|
||||||
Vue.component('YoTableActions', YoTableActions)
|
Vue.component('YoTableActions', YoTableActions)
|
||||||
|
import YoModalForm from './components/yoModalForm'
|
||||||
|
Vue.component('YoModalForm', YoModalForm)
|
||||||
import YoImage from './components/yoImage'
|
import YoImage from './components/yoImage'
|
||||||
Vue.component('YoImage', YoImage)
|
Vue.component('YoImage', YoImage)
|
||||||
|
|
||||||
|
|||||||
@@ -10,8 +10,10 @@
|
|||||||
}
|
}
|
||||||
.home-header-content {
|
.home-header-content {
|
||||||
margin-left: @padding-lg;
|
margin-left: @padding-lg;
|
||||||
span {
|
h4 {
|
||||||
color: @primary-color;
|
span {
|
||||||
|
color: @primary-color;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
p {
|
p {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|||||||
@@ -9,11 +9,15 @@
|
|||||||
<yo-image :id="$root.global.info.avatar" :size="64" icon="user" type="avatar" />
|
<yo-image :id="$root.global.info.avatar" :size="64" icon="user" type="avatar" />
|
||||||
</div>
|
</div>
|
||||||
<div class="home-header-content">
|
<div class="home-header-content">
|
||||||
<h2>
|
<h4>
|
||||||
{{ $moment().format('A') }}好，
|
{{ $moment().format('A') }}好，
|
||||||
<span>{{ $root.global.info.nickName || $root.global.info.name }}</span>，欢迎您登录系统！
|
<span>{{ $root.global.info.nickName || $root.global.info.name }}</span>，欢迎您登录系统！
|
||||||
</h2>
|
</h4>
|
||||||
<p>上次IP：{{ $root.global.info.lastLoginIp }} 上次登录时间：{{ $root.global.info.lastLoginTime }}</p>
|
<p>
|
||||||
|
<span>上次IP：{{ $root.global.info.lastLoginIp }}</span>
|
||||||
|
<a-divider type="vertical" />
|
||||||
|
<span>上次登录时间：{{ $root.global.info.lastLoginTime }}</span>
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</a-col>
|
</a-col>
|
||||||
|
|||||||
@@ -1,78 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
:visible="visible"
|
|
||||||
@cancel="onCancel"
|
|
||||||
@ok="onOk"
|
|
||||||
class="yo-modal-form"
|
|
||||||
title="新增XX"
|
|
||||||
>
|
|
||||||
<FormBody ref="form-body" />
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import FormBody from './form';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
FormBody,
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
visible: false,
|
|
||||||
confirmLoading: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
formBody() {
|
|
||||||
return this.$refs['form-body'];
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 从外部调用打开本窗口
|
|
||||||
*/
|
|
||||||
async onOpen() {
|
|
||||||
this.visible = true;
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.formBody.onInit();
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 点击保存时的操作
|
|
||||||
*/
|
|
||||||
onOk() {
|
|
||||||
this.formBody.onGetData().then((data) => {
|
|
||||||
this.confirmLoading = true;
|
|
||||||
this.$api
|
|
||||||
/** !!此处必须修改调用的接口方法 */
|
|
||||||
.testAddApi(data)
|
|
||||||
.then(({ success }) => {
|
|
||||||
if (success) {
|
|
||||||
this.$message.success('新增成功');
|
|
||||||
this.onCancel();
|
|
||||||
this.$emit('ok');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
this.confirmLoading = false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 关闭窗口时的操作
|
|
||||||
*/
|
|
||||||
onCancel() {
|
|
||||||
this.formBody.onResetFields();
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
@@ -1,79 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
:visible="visible"
|
|
||||||
@cancel="onCancel"
|
|
||||||
@ok="onOk"
|
|
||||||
class="yo-modal-form"
|
|
||||||
title="编辑XX"
|
|
||||||
>
|
|
||||||
<FormBody ref="form-body" />
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import FormBody from './form';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
FormBody,
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
visible: false,
|
|
||||||
confirmLoading: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
formBody() {
|
|
||||||
return this.$refs['form-body'];
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 从外部调用打开本窗口,并填充外部传入的数据
|
|
||||||
*/
|
|
||||||
onOpen(record) {
|
|
||||||
this.visible = true;
|
|
||||||
this.$nextTick(async () => {
|
|
||||||
await this.formBody.onInit();
|
|
||||||
this.formBody.onFillData(record);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 点击保存时的操作
|
|
||||||
*/
|
|
||||||
onOk() {
|
|
||||||
this.formBody.onGetData().then((data) => {
|
|
||||||
this.confirmLoading = true;
|
|
||||||
this.$api
|
|
||||||
/** !!此处必须修改调用的接口方法 */
|
|
||||||
.testEditApi(data)
|
|
||||||
.then(({ success }) => {
|
|
||||||
if (success) {
|
|
||||||
this.$message.success('编辑成功');
|
|
||||||
this.onCancel();
|
|
||||||
this.$emit('ok');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
this.confirmLoading = false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 关闭窗口时的操作
|
|
||||||
*/
|
|
||||||
onCancel() {
|
|
||||||
this.formBody.onResetFields();
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
@@ -1,27 +1,41 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<!--
|
||||||
|
普通编辑窗体
|
||||||
|
v 1.2
|
||||||
|
2021-04-30
|
||||||
|
Lufthafen
|
||||||
|
-->
|
||||||
<a-form-model :model="form" :rules="rules" class="yo-form" ref="form">
|
<a-form-model :model="form" :rules="rules" class="yo-form" ref="form">
|
||||||
<a-spin :spinning="loading">
|
<a-spin :spinning="loading">
|
||||||
<a-icon slot="indicator" spin type="loading" />
|
<a-icon slot="indicator" spin type="loading" />
|
||||||
<div class="yo-form-group">
|
<div class="yo-form-group">
|
||||||
<!-- 表单控件 -->
|
<!-- 表单控件 -->
|
||||||
|
<!-- ... -->
|
||||||
</div>
|
</div>
|
||||||
</a-spin>
|
</a-spin>
|
||||||
</a-form-model>
|
</a-form-model>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
/* 表单内容默认值 */
|
||||||
|
const defaultForm = {
|
||||||
|
/* ... */
|
||||||
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
/** 表单数据 */
|
/** 表单数据 */
|
||||||
form: {},
|
form: {},
|
||||||
/** 验证格式 */
|
/** 验证格式 */
|
||||||
rules: {},
|
rules: {
|
||||||
|
/* ... */
|
||||||
|
},
|
||||||
|
|
||||||
/** 加载异步数据状态 */
|
/** 加载异步数据状态 */
|
||||||
loading: false,
|
loading: false,
|
||||||
|
|
||||||
/** 其他成员属性 */
|
/** 其他成员属性 */
|
||||||
/** ... */
|
/* ... */
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -30,12 +44,13 @@ export default {
|
|||||||
* 必要的方法
|
* 必要的方法
|
||||||
* 在打开编辑页时允许填充数据
|
* 在打开编辑页时允许填充数据
|
||||||
*/
|
*/
|
||||||
onFillData(record) {
|
onFillData(params) {
|
||||||
/** 将默认数据覆盖到form */
|
/** 将默认数据覆盖到form */
|
||||||
this.form = this.$_.cloneDeep({
|
this.form = this.$_.cloneDeep({
|
||||||
...record,
|
...defaultForm,
|
||||||
/** 在此处添加默认数据转换 */
|
...params.record,
|
||||||
/** ... */
|
/** 在此处添加其他默认数据转换 */
|
||||||
|
/* ... */
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -50,7 +65,7 @@ export default {
|
|||||||
const record = this.$_.cloneDeep(this.form);
|
const record = this.$_.cloneDeep(this.form);
|
||||||
|
|
||||||
/** 验证通过后可以对数据进行转换得到想要提交的格式 */
|
/** 验证通过后可以对数据进行转换得到想要提交的格式 */
|
||||||
/** ... */
|
/* ... */
|
||||||
|
|
||||||
reslove(record);
|
reslove(record);
|
||||||
} else {
|
} else {
|
||||||
@@ -77,7 +92,7 @@ export default {
|
|||||||
this.$refs.form.resetFields();
|
this.$refs.form.resetFields();
|
||||||
|
|
||||||
/** 在这里可以初始化当前组件中其他属性 */
|
/** 在这里可以初始化当前组件中其他属性 */
|
||||||
/** ... */
|
/* ... */
|
||||||
}, 300);
|
}, 300);
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -85,16 +100,15 @@ export default {
|
|||||||
* 必要方法
|
* 必要方法
|
||||||
* 加载当前表单中所需要的异步数据
|
* 加载当前表单中所需要的异步数据
|
||||||
*/
|
*/
|
||||||
async onInit() {
|
async onInit(params) {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
/** 可以在这里await获取一些异步数据 */
|
/** 可以在这里await获取一些异步数据 */
|
||||||
/** ...BEGIN */
|
/* ... */
|
||||||
/** ...END */
|
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
},
|
},
|
||||||
|
|
||||||
/** 当前组件的其他方法 */
|
/** 当前组件的其他方法 */
|
||||||
/** ... */
|
/* ... */
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -1,26 +1,29 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<!--
|
||||||
|
普通查询表格
|
||||||
|
v 1.2
|
||||||
|
2021-04-30
|
||||||
|
Lufthafen
|
||||||
|
-->
|
||||||
<container>
|
<container>
|
||||||
<br />
|
<br />
|
||||||
<a-card :bordered="false">
|
<a-card :bordered="false">
|
||||||
<Auth auth="authCode:page">
|
<yo-table
|
||||||
<div class="yo-query-bar">
|
:columns="columns"
|
||||||
<a-form-model :model="query" layout="inline">
|
:load-data="loadData"
|
||||||
<!-- 此处添加查询表单控件 -->
|
@query="onQuery"
|
||||||
<a-form-model-item>
|
@resetQuery="onResetQuery"
|
||||||
<a-button-group>
|
ref="table"
|
||||||
<a-button @click="onQuery" type="primary">查询</a-button>
|
>
|
||||||
<a-button @click="onResetQuery">重置</a-button>
|
<Auth auth="authCode:page" slot="query">
|
||||||
</a-button-group>
|
<!-- 此处添加查询表单控件 -->
|
||||||
</a-form-model-item>
|
<!-- ... -->
|
||||||
</a-form-model>
|
</Auth>
|
||||||
</div>
|
|
||||||
</Auth>
|
|
||||||
|
|
||||||
<yo-table :columns="columns" :load-data="loadData" ref="table">
|
|
||||||
<Auth auth="authCode:add" slot="operator">
|
<Auth auth="authCode:add" slot="operator">
|
||||||
<a-button @click="onOpen('add-form')" icon="plus">新增XX</a-button>
|
<a-button @click="onOpen('add-form')" icon="plus">新增...</a-button>
|
||||||
</Auth>
|
</Auth>
|
||||||
<!-- 格式化字段内容 -->
|
<!-- 格式化字段内容 -->
|
||||||
|
<!-- ... -->
|
||||||
<!-- 添加操作控件 -->
|
<!-- 添加操作控件 -->
|
||||||
<span slot="action" slot-scope="text, record">
|
<span slot="action" slot-scope="text, record">
|
||||||
<yo-table-actions>
|
<yo-table-actions>
|
||||||
@@ -33,35 +36,52 @@
|
|||||||
</a-popconfirm>
|
</a-popconfirm>
|
||||||
</Auth>
|
</Auth>
|
||||||
<!-- 可在此处添加其他操作控件 -->
|
<!-- 可在此处添加其他操作控件 -->
|
||||||
|
<!-- ... -->
|
||||||
</yo-table-actions>
|
</yo-table-actions>
|
||||||
</span>
|
</span>
|
||||||
</yo-table>
|
</yo-table>
|
||||||
</a-card>
|
</a-card>
|
||||||
<br />
|
|
||||||
<add-form @ok="onReloadData" ref="add-form" />
|
<!-- 新增表单 -->
|
||||||
<edit-form @ok="onReloadData" ref="edit-form" />
|
<yo-modal-form :action="$api[api.add]" :title="'新增' + name" @ok="onReloadData" ref="add-form">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
|
|
||||||
|
<!-- 编辑表单 -->
|
||||||
|
<yo-modal-form :action="$api[api.edit]" :title="'编辑' + name" @ok="onReloadData" ref="edit-form">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
</container>
|
</container>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import AddForm from './addForm';
|
import FormBody from './form';
|
||||||
import EditForm from './editForm';
|
|
||||||
|
|
||||||
/* 在此管理整个页面需要的接口名称 */
|
/* 在此管理整个页面需要的接口名称 */
|
||||||
const api = {
|
const api = {
|
||||||
page: 'testPageApi',
|
page: 'testPageApi...',
|
||||||
delete: 'testDeleteApi',
|
add: 'testAddApi',
|
||||||
|
edit: 'testEditApi',
|
||||||
|
delete: 'testDeleteApi...',
|
||||||
/* ... */
|
/* ... */
|
||||||
};
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
AddForm,
|
FormBody,
|
||||||
EditForm,
|
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
api,
|
||||||
|
|
||||||
|
name: '...',
|
||||||
|
|
||||||
|
/* 查询条件 */
|
||||||
query: {},
|
query: {},
|
||||||
|
|
||||||
|
/* 表格字段 */
|
||||||
columns: [],
|
columns: [],
|
||||||
|
|
||||||
|
/* 字典编码储存格式 */
|
||||||
codes: {
|
codes: {
|
||||||
code1: [],
|
code1: [],
|
||||||
code2: [],
|
code2: [],
|
||||||
@@ -69,10 +89,11 @@ export default {
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
/** 按需加载字典编码 */
|
||||||
this.onLoadCodes();
|
this.onLoadCodes();
|
||||||
|
|
||||||
/** 根据权限添加操作列 */
|
/** 根据权限添加操作列 */
|
||||||
const flag = this.$auth(/** ... */);
|
const flag = this.$auth(/* ... */);
|
||||||
if (flag) {
|
if (flag) {
|
||||||
this.columns.push({
|
this.columns.push({
|
||||||
title: '操作',
|
title: '操作',
|
||||||
@@ -132,10 +153,12 @@ export default {
|
|||||||
.$queue([
|
.$queue([
|
||||||
this.$api.sysDictTypeDropDownAwait({ code: 'code1' }),
|
this.$api.sysDictTypeDropDownAwait({ code: 'code1' }),
|
||||||
this.$api.sysDictTypeDropDownAwait({ code: 'code2' }),
|
this.$api.sysDictTypeDropDownAwait({ code: 'code2' }),
|
||||||
|
/* ... */
|
||||||
])
|
])
|
||||||
.then(([code1, code2]) => {
|
.then(([code1, code2]) => {
|
||||||
this.codes.code1 = code1.data;
|
this.codes.code1 = code1.data;
|
||||||
this.codes.code2 = code2.data;
|
this.codes.code2 = code2.data;
|
||||||
|
/* ... */
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -156,7 +179,11 @@ export default {
|
|||||||
* 从列表页调用窗口的打开方法
|
* 从列表页调用窗口的打开方法
|
||||||
*/
|
*/
|
||||||
onOpen(formName, record) {
|
onOpen(formName, record) {
|
||||||
this.$refs[formName].onOpen(record);
|
this.$refs[formName].onOpen({
|
||||||
|
record,
|
||||||
|
/* 按需添加其他参数 */
|
||||||
|
/* ... */
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -1,4 +1,10 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<!--
|
||||||
|
普通树查询表格
|
||||||
|
v 1.2
|
||||||
|
2021-04-30
|
||||||
|
Lufthafen
|
||||||
|
-->
|
||||||
<yo-tree-layout
|
<yo-tree-layout
|
||||||
:load-data="loadTreeData"
|
:load-data="loadTreeData"
|
||||||
@select="onSelect"
|
@select="onSelect"
|
||||||
@@ -7,72 +13,90 @@
|
|||||||
>
|
>
|
||||||
<container>
|
<container>
|
||||||
<a-card :bordered="false">
|
<a-card :bordered="false">
|
||||||
<Auth auth="authCode:page">
|
<yo-table
|
||||||
<div class="yo-query-bar">
|
:columns="columns"
|
||||||
<a-form-model :model="query" layout="inline">
|
:load-data="loadData"
|
||||||
<!-- 此处添加查询表单控件 -->
|
@query="onQuery"
|
||||||
<a-form-model-item>
|
@resetQuery="onResetQuery"
|
||||||
<a-button-group>
|
ref="table"
|
||||||
<a-button @click="onQuery" type="primary">查询</a-button>
|
>
|
||||||
<a-button @click="onReset">重置</a-button>
|
<Auth auth="authCode:page" slot="query">
|
||||||
</a-button-group>
|
<!-- 此处添加查询表单控件 -->
|
||||||
</a-form-model-item>
|
<!-- ... -->
|
||||||
</a-form-model>
|
</Auth>
|
||||||
</div>
|
<Auth auth="authCode:add" slot="operator">
|
||||||
|
<a-button @click="onOpen('add-form')" icon="plus">新增机构</a-button>
|
||||||
<yo-table :columns="columns" :load-data="loadData" ref="table">
|
</Auth>
|
||||||
<Auth auth="authCode:add" slot="operator">
|
<!-- 格式化字段内容 -->
|
||||||
<a-button @click="onOpen('add-form')" icon="plus">新增机构</a-button>
|
<!-- ... -->
|
||||||
</Auth>
|
<!-- 添加操作控件 -->
|
||||||
<!-- 格式化字段内容 -->
|
<span slot="action" slot-scope="text, record">
|
||||||
<!-- 添加操作控件 -->
|
<yo-table-actions>
|
||||||
<span slot="action" slot-scope="text, record">
|
<Auth auth="authCode:edit">
|
||||||
<yo-table-actions>
|
<a @click="onOpen('edit-form', record)">编辑</a>
|
||||||
<Auth auth="authCode:edit">
|
</Auth>
|
||||||
<a @click="onOpen('edit-form', record)">编辑</a>
|
<Auth auth="authCode:delete">
|
||||||
</Auth>
|
<a-popconfirm @confirm="onDelete(record)" placement="topRight" title="是否确认删除">
|
||||||
<Auth auth="authCode:delete">
|
<a>删除</a>
|
||||||
<a-popconfirm @confirm="onDelete(record)" placement="topRight" title="是否确认删除">
|
</a-popconfirm>
|
||||||
<a>删除</a>
|
</Auth>
|
||||||
</a-popconfirm>
|
<!-- 可在此处添加其他操作控件 -->
|
||||||
</Auth>
|
<!-- ... -->
|
||||||
<!-- 可在此处添加其他操作控件 -->
|
</yo-table-actions>
|
||||||
</yo-table-actions>
|
</span>
|
||||||
</span>
|
</yo-table>
|
||||||
</yo-table>
|
|
||||||
</Auth>
|
|
||||||
</a-card>
|
</a-card>
|
||||||
</container>
|
</container>
|
||||||
<add-form @ok="onReloadData" ref="add-form" />
|
|
||||||
<edit-form @ok="onReloadData" ref="edit-form" />
|
<!-- 新增表单 -->
|
||||||
|
<yo-modal-form :action="$api[api.add]" :title="'新增' + name" @ok="onReloadData" ref="add-form">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
|
|
||||||
|
<!-- 编辑表单 -->
|
||||||
|
<yo-modal-form :action="$api[api.edit]" :title="'编辑' + name" @ok="onReloadData" ref="edit-form">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
</yo-tree-layout>
|
</yo-tree-layout>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
/* 需要引用YoTreeLayout组件 */
|
/* 需要引用YoTreeLayout组件 */
|
||||||
import YoTreeLayout from '@/components/yoTreeLayout';
|
import YoTreeLayout from '@/components/yoTreeLayout';
|
||||||
|
import FormBody from './form';
|
||||||
import AddForm from './addForm';
|
|
||||||
import EditForm from './editForm';
|
|
||||||
|
|
||||||
/* 在此管理整个页面需要的接口名称 */
|
/* 在此管理整个页面需要的接口名称 */
|
||||||
const api = {
|
const api = {
|
||||||
tree: 'testTreeApi',
|
tree: 'testTreeApi...',
|
||||||
page: 'testPageApi',
|
page: 'testPageApi...',
|
||||||
delete: 'testDeleteApi',
|
add: 'testAddApi',
|
||||||
|
edit: 'testEditApi',
|
||||||
|
delete: 'testDeleteApi...',
|
||||||
/* ... */
|
/* ... */
|
||||||
};
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
YoTreeLayout,
|
YoTreeLayout,
|
||||||
AddForm,
|
FormBody,
|
||||||
EditForm,
|
|
||||||
},
|
},
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
api,
|
||||||
|
|
||||||
|
name: '...',
|
||||||
|
|
||||||
|
/* 查询条件 */
|
||||||
query: {},
|
query: {},
|
||||||
|
|
||||||
|
/* 表格字段 */
|
||||||
columns: [],
|
columns: [],
|
||||||
|
|
||||||
|
/* 字典编码储存格式 */
|
||||||
|
codes: {
|
||||||
|
code1: [],
|
||||||
|
code2: [],
|
||||||
|
},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -80,7 +104,7 @@ export default {
|
|||||||
this.onLoadCodes();
|
this.onLoadCodes();
|
||||||
|
|
||||||
/** 根据权限添加操作列 */
|
/** 根据权限添加操作列 */
|
||||||
const flag = this.$auth(/** ... */);
|
const flag = this.$auth(/* ... */);
|
||||||
if (flag) {
|
if (flag) {
|
||||||
this.columns.push({
|
this.columns.push({
|
||||||
title: '操作',
|
title: '操作',
|
||||||
@@ -107,7 +131,7 @@ export default {
|
|||||||
* 选择树节点事件
|
* 选择树节点事件
|
||||||
*/
|
*/
|
||||||
onSelect([id]) {
|
onSelect([id]) {
|
||||||
/* 在选择事件中可以对右侧表格添加父节点id的查询条件 */
|
/** 在选择事件中可以对右侧表格添加父节点id的查询条件 */
|
||||||
this.query = {
|
this.query = {
|
||||||
pid: id,
|
pid: id,
|
||||||
};
|
};
|
||||||
@@ -168,10 +192,12 @@ export default {
|
|||||||
.$queue([
|
.$queue([
|
||||||
this.$api.sysDictTypeDropDownAwait({ code: 'code1' }),
|
this.$api.sysDictTypeDropDownAwait({ code: 'code1' }),
|
||||||
this.$api.sysDictTypeDropDownAwait({ code: 'code2' }),
|
this.$api.sysDictTypeDropDownAwait({ code: 'code2' }),
|
||||||
|
/* ... */
|
||||||
])
|
])
|
||||||
.then(([code1, code2]) => {
|
.then(([code1, code2]) => {
|
||||||
this.codes.code1 = code1.data;
|
this.codes.code1 = code1.data;
|
||||||
this.codes.code2 = code2.data;
|
this.codes.code2 = code2.data;
|
||||||
|
/* ... */
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -192,7 +218,12 @@ export default {
|
|||||||
* 从列表页调用窗口的打开方法
|
* 从列表页调用窗口的打开方法
|
||||||
*/
|
*/
|
||||||
onOpen(formName, record) {
|
onOpen(formName, record) {
|
||||||
this.$refs[formName].onOpen(record, this.query['pid']);
|
this.$refs[formName].onOpen({
|
||||||
|
record,
|
||||||
|
pid: this.query.pid,
|
||||||
|
/* 按需添加其他参数 */
|
||||||
|
/* ... */
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -1,44 +1,119 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<!--
|
||||||
|
普通编辑窗体
|
||||||
|
v 1.2
|
||||||
|
2021-04-30
|
||||||
|
Lufthafen
|
||||||
|
-->
|
||||||
<a-form-model :model="form" :rules="rules" class="yo-form" ref="form">
|
<a-form-model :model="form" :rules="rules" class="yo-form" ref="form">
|
||||||
<div class="yo-form-group">
|
<a-spin :spinning="loading">
|
||||||
<a-form-model-item label="应用名称" prop="name">
|
<a-icon slot="indicator" spin type="loading" />
|
||||||
<a-input placeholder="请输入应用名称" v-model="form.name" />
|
<div class="yo-form-group">
|
||||||
</a-form-model-item>
|
<!-- 表单控件 -->
|
||||||
<a-form-model-item label="唯一编码" prop="code">
|
<!-- ... -->
|
||||||
<a-input placeholder="请输入唯一编码" v-model="form.code" />
|
<a-form-model-item label="应用名称" prop="name">
|
||||||
</a-form-model-item>
|
<a-input placeholder="请输入应用名称" v-model="form.name" />
|
||||||
<a-form-model-item label="排序" prop="sort">
|
</a-form-model-item>
|
||||||
<a-input-number
|
<a-form-model-item label="唯一编码" prop="code">
|
||||||
:max="1000"
|
<a-input placeholder="请输入唯一编码" v-model="form.code" />
|
||||||
:min="0"
|
</a-form-model-item>
|
||||||
class="w-100-p"
|
<a-form-model-item label="图标" prop="icon">
|
||||||
placeholder="请输入排序"
|
<a-input :disabled="true" placeholder="请选择图标" v-model="form.icon">
|
||||||
v-model="form.sort"
|
<a-icon :type="form.icon" slot="addonBefore" v-if="form.icon" />
|
||||||
/>
|
<a-icon @click="onOpenSelectIcon" slot="addonAfter" type="setting" />
|
||||||
</a-form-model-item>
|
</a-input>
|
||||||
</div>
|
</a-form-model-item>
|
||||||
|
<a-form-model-item label="图标颜色" prop="color">
|
||||||
|
<chrome-picker v-model="form.color" />
|
||||||
|
</a-form-model-item>
|
||||||
|
<a-form-model-item label="排序" prop="sort">
|
||||||
|
<a-input-number
|
||||||
|
:max="1000"
|
||||||
|
:min="0"
|
||||||
|
class="w-100-p"
|
||||||
|
placeholder="请输入排序"
|
||||||
|
v-model="form.sort"
|
||||||
|
/>
|
||||||
|
</a-form-model-item>
|
||||||
|
</div>
|
||||||
|
</a-spin>
|
||||||
|
|
||||||
|
<yo-icon-selector ref="icon-selector" v-model="form.icon" />
|
||||||
</a-form-model>
|
</a-form-model>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
import YoIconSelector from '@/components/yoIconSelector';
|
||||||
|
import { Chrome } from 'vue-color';
|
||||||
|
|
||||||
|
/* 表单内容默认值 */
|
||||||
|
const defaultForm = {
|
||||||
|
/* ... */
|
||||||
|
color: '#ffffff',
|
||||||
|
active: false,
|
||||||
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
components: {
|
||||||
|
YoIconSelector,
|
||||||
|
ChromePicker: Chrome,
|
||||||
|
},
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
/** 表单数据 */
|
||||||
form: {
|
form: {
|
||||||
active: false,
|
...defaultForm,
|
||||||
},
|
},
|
||||||
|
/** 验证格式 */
|
||||||
rules: {
|
rules: {
|
||||||
|
/* ... */
|
||||||
name: [{ required: true, message: '请输入应用名称' }],
|
name: [{ required: true, message: '请输入应用名称' }],
|
||||||
code: [{ required: true, message: '请输入唯一编码' }],
|
code: [{ required: true, message: '请输入唯一编码' }],
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/** 加载异步数据状态 */
|
||||||
|
loading: false,
|
||||||
|
|
||||||
|
/** 其他成员属性 */
|
||||||
|
/* ... */
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
/**
|
/**
|
||||||
* 必要的方法
|
* 必要的方法
|
||||||
* 在打开编辑页时允许填充数据
|
* 在打开编辑页时允许填充数据
|
||||||
*/
|
*/
|
||||||
onFillData(record) {
|
onFillData(params) {
|
||||||
this.form = this.$_.cloneDeep(record);
|
/** 将默认数据覆盖到form */
|
||||||
|
this.form = this.$_.cloneDeep({
|
||||||
|
...defaultForm,
|
||||||
|
...params.record,
|
||||||
|
/** 在此处添加其他默认数据转换 */
|
||||||
|
/* ... */
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 必要方法
|
||||||
|
* 验证表单并获取表单数据
|
||||||
|
*/
|
||||||
|
onGetData() {
|
||||||
|
return new Promise((reslove, reject) => {
|
||||||
|
this.$refs.form.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
const record = this.$_.cloneDeep(this.form);
|
||||||
|
|
||||||
|
/** 验证通过后可以对数据进行转换得到想要提交的格式 */
|
||||||
|
/* ... */
|
||||||
|
record.color = record.color.constructor === Object ? record.color.hex : record.color;
|
||||||
|
|
||||||
|
reslove(record);
|
||||||
|
} else {
|
||||||
|
reject();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -56,8 +131,28 @@ export default {
|
|||||||
onResetFields() {
|
onResetFields() {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.$refs.form.resetFields();
|
this.$refs.form.resetFields();
|
||||||
|
|
||||||
|
/** 在这里可以初始化当前组件中其他属性 */
|
||||||
|
/* ... */
|
||||||
}, 300);
|
}, 300);
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 必要方法
|
||||||
|
* 加载当前表单中所需要的异步数据
|
||||||
|
*/
|
||||||
|
async onInit(params) {
|
||||||
|
this.loading = true;
|
||||||
|
/** 可以在这里await获取一些异步数据 */
|
||||||
|
/* ... */
|
||||||
|
this.loading = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 当前组件的其他方法 */
|
||||||
|
/* ... */
|
||||||
|
onOpenSelectIcon() {
|
||||||
|
this.$refs['icon-selector'].onOpen(this.form.icon);
|
||||||
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -1,30 +1,35 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<!--
|
||||||
|
普通查询表格
|
||||||
|
v 1.2
|
||||||
|
2021-04-30
|
||||||
|
Lufthafen
|
||||||
|
-->
|
||||||
<container>
|
<container>
|
||||||
<br />
|
<br />
|
||||||
<a-card :bordered="false">
|
<a-card :bordered="false">
|
||||||
<Auth auth="sysApp:page">
|
<yo-table
|
||||||
<div class="yo-query-bar">
|
:columns="columns"
|
||||||
<a-form-model :model="query" layout="inline">
|
:load-data="loadData"
|
||||||
<a-form-model-item label="应用名称">
|
@query="onQuery"
|
||||||
<a-input placeholder="请输入应用名称" v-model="query.name" />
|
@resetQuery="onResetQuery"
|
||||||
</a-form-model-item>
|
ref="table"
|
||||||
<a-form-model-item label="唯一编码">
|
>
|
||||||
<a-input placeholder="请输入唯一编码" v-model="query.code" />
|
<Auth auth="sysApp:page" slot="query">
|
||||||
</a-form-model-item>
|
<!-- 此处添加查询表单控件 -->
|
||||||
<a-form-model-item>
|
<!-- ... -->
|
||||||
<a-button-group>
|
<a-form-model-item label="应用名称">
|
||||||
<a-button @click="onQuery" type="primary">查询</a-button>
|
<a-input placeholder="请输入应用名称" v-model="query.name" />
|
||||||
<a-button @click="() => { query = {}, onQuery() }">重置</a-button>
|
</a-form-model-item>
|
||||||
</a-button-group>
|
<a-form-model-item label="唯一编码">
|
||||||
</a-form-model-item>
|
<a-input placeholder="请输入唯一编码" v-model="query.code" />
|
||||||
</a-form-model>
|
</a-form-model-item>
|
||||||
</div>
|
</Auth>
|
||||||
</Auth>
|
|
||||||
|
|
||||||
<yo-table :columns="columns" :load-data="loadData" ref="table">
|
|
||||||
<Auth auth="sysApp:add" slot="operator">
|
<Auth auth="sysApp:add" slot="operator">
|
||||||
<a-button @click="onOpen('add-form')" icon="plus">新增应用</a-button>
|
<a-button @click="onOpen('add-form')" icon="plus">新增应用</a-button>
|
||||||
</Auth>
|
</Auth>
|
||||||
|
<!-- 格式化字段内容 -->
|
||||||
|
<!-- ... -->
|
||||||
<span slot="active" slot-scope="text, record">
|
<span slot="active" slot-scope="text, record">
|
||||||
{{ text ? '是' : '否' }}
|
{{ text ? '是' : '否' }}
|
||||||
<Auth auth="sysApp:setAsDefault" v-if="!record.active">
|
<Auth auth="sysApp:setAsDefault" v-if="!record.active">
|
||||||
@@ -40,7 +45,9 @@
|
|||||||
</yo-table-actions>
|
</yo-table-actions>
|
||||||
</Auth>
|
</Auth>
|
||||||
</span>
|
</span>
|
||||||
<span slot="status" slot-scope="text">{{ bindCodeValue(text, 'common_status') }}</span>
|
<span slot="status" slot-scope="text">{{ bindCodeValue(text, 'commonStatus') }}</span>
|
||||||
|
|
||||||
|
<!-- 添加操作控件 -->
|
||||||
<span slot="action" slot-scope="text, record">
|
<span slot="action" slot-scope="text, record">
|
||||||
<yo-table-actions>
|
<yo-table-actions>
|
||||||
<Auth auth="sysApp:edit">
|
<Auth auth="sysApp:edit">
|
||||||
@@ -51,27 +58,50 @@
|
|||||||
<a>删除</a>
|
<a>删除</a>
|
||||||
</a-popconfirm>
|
</a-popconfirm>
|
||||||
</Auth>
|
</Auth>
|
||||||
|
<!-- 可在此处添加其他操作控件 -->
|
||||||
|
<!-- ... -->
|
||||||
</yo-table-actions>
|
</yo-table-actions>
|
||||||
</span>
|
</span>
|
||||||
</yo-table>
|
</yo-table>
|
||||||
</a-card>
|
</a-card>
|
||||||
<br />
|
|
||||||
<add-form @ok="onReloadData" ref="add-form" />
|
<!-- 新增表单 -->
|
||||||
<edit-form @ok="onReloadData" ref="edit-form" />
|
<yo-modal-form :action="$api[api.add]" :title="'新增' + name" @ok="onReloadData" ref="add-form">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
|
|
||||||
|
<!-- 编辑表单 -->
|
||||||
|
<yo-modal-form :action="$api[api.edit]" :title="'编辑' + name" @ok="onReloadData" ref="edit-form">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
</container>
|
</container>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import AddForm from './addForm';
|
import FormBody from './form';
|
||||||
import EditForm from './editForm';
|
|
||||||
|
/* 在此管理整个页面需要的接口名称 */
|
||||||
|
const api = {
|
||||||
|
page: 'getAppPage',
|
||||||
|
add: 'sysAppAdd',
|
||||||
|
edit: 'sysAppEdit',
|
||||||
|
delete: 'sysAppDelete',
|
||||||
|
/* ... */
|
||||||
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
AddForm,
|
FormBody,
|
||||||
EditForm,
|
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
api,
|
||||||
|
|
||||||
|
name: '应用',
|
||||||
|
|
||||||
|
/* 查询条件 */
|
||||||
query: {},
|
query: {},
|
||||||
|
|
||||||
|
/* 表格字段 */
|
||||||
columns: [
|
columns: [
|
||||||
{
|
{
|
||||||
title: '应用名称',
|
title: '应用名称',
|
||||||
@@ -105,25 +135,22 @@ export default {
|
|||||||
sorter: true,
|
sorter: true,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
codes: [
|
|
||||||
{
|
/* 字典编码储存格式 */
|
||||||
code: 'yes_or_no',
|
codes: {
|
||||||
values: [],
|
yesOrNo: [],
|
||||||
},
|
commonStatus: [],
|
||||||
{
|
},
|
||||||
code: 'common_status',
|
|
||||||
values: [],
|
|
||||||
},
|
|
||||||
],
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
/** 按需加载字典编码 */
|
||||||
this.onLoadCodes();
|
this.onLoadCodes();
|
||||||
|
|
||||||
|
/** 根据权限添加操作列 */
|
||||||
const flag = this.$auth({
|
const flag = this.$auth({
|
||||||
sysApp: [['edit'], ['delete']],
|
sysApp: [['edit'], ['delete']],
|
||||||
});
|
});
|
||||||
|
|
||||||
if (flag) {
|
if (flag) {
|
||||||
this.columns.push({
|
this.columns.push({
|
||||||
title: '操作',
|
title: '操作',
|
||||||
@@ -139,14 +166,12 @@ export default {
|
|||||||
* 传给yo-table以示意数据接口及其参数和返回的数据结构
|
* 传给yo-table以示意数据接口及其参数和返回的数据结构
|
||||||
*/
|
*/
|
||||||
loadData(params) {
|
loadData(params) {
|
||||||
return this.$api
|
return this.$api[api.page]({
|
||||||
.getAppPage({
|
...params,
|
||||||
...params,
|
...this.query,
|
||||||
...this.query,
|
}).then((res) => {
|
||||||
})
|
return res.data;
|
||||||
.then((res) => {
|
});
|
||||||
return res.data;
|
|
||||||
});
|
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -157,6 +182,16 @@ export default {
|
|||||||
this.$refs.table.onReloadData(true);
|
this.$refs.table.onReloadData(true);
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 有查询功能时的必要方法
|
||||||
|
* 重置查询条件
|
||||||
|
*/
|
||||||
|
onResetQuery() {
|
||||||
|
/** 在这里重置查询条件时,可对特殊的字段做保留处理 */
|
||||||
|
this.query = {};
|
||||||
|
this.onQuery();
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 必要方法
|
* 必要方法
|
||||||
* 重新列表数据
|
* 重新列表数据
|
||||||
@@ -166,21 +201,30 @@ export default {
|
|||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 加载字典数据时的必要方法
|
* 必要方法
|
||||||
|
* 加载字典数据
|
||||||
|
* 如果不需要获取相应的字典数据,此方法内容可空
|
||||||
*/
|
*/
|
||||||
onLoadCodes() {
|
onLoadCodes() {
|
||||||
this.$api
|
this.$api
|
||||||
.$queue([
|
.$queue([
|
||||||
this.$api.sysDictTypeDropDownAwait({ code: 'yes_or_no' }),
|
this.$api.sysDictTypeDropDownAwait({ code: 'yes_or_no' }),
|
||||||
this.$api.sysDictTypeDropDownAwait({ code: 'common_status' }),
|
this.$api.sysDictTypeDropDownAwait({ code: 'common_status' }),
|
||||||
|
/* ... */
|
||||||
])
|
])
|
||||||
.then(([yesOrNo, commonStatus]) => {
|
.then(([code1, code2]) => {
|
||||||
this.codes.find((p) => p.code === 'yes_or_no').values = yesOrNo.data;
|
this.codes.yesOrNo = code1.data;
|
||||||
this.codes.find((p) => p.code === 'common_status').values = commonStatus.data;
|
this.codes.commonStatus = code2.data;
|
||||||
|
/* ... */
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 必要方法
|
||||||
|
* 绑定数据字典值
|
||||||
|
*/
|
||||||
bindCodeValue(code, name) {
|
bindCodeValue(code, name) {
|
||||||
const c = this.codes.find((p) => p.code == name).values.find((p) => p.code == code);
|
const c = this.codes[name].find((p) => p.code == code);
|
||||||
if (c) {
|
if (c) {
|
||||||
return c.value;
|
return c.value;
|
||||||
}
|
}
|
||||||
@@ -188,19 +232,41 @@ export default {
|
|||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 有编辑新增功能的必要方法
|
* 必要方法
|
||||||
* 从列表页调用窗口的打开方法
|
* 从列表页调用窗口的打开方法
|
||||||
*/
|
*/
|
||||||
onOpen(formName, record) {
|
onOpen(formName, record) {
|
||||||
this.$refs[formName].onOpen(record);
|
this.$refs[formName].onOpen({
|
||||||
|
record,
|
||||||
|
/* 按需添加其他参数 */
|
||||||
|
/* ... */
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 必要方法
|
||||||
|
* 可以用做一系列操作的公共回调,此方法中会重新加载当前列表
|
||||||
|
*/
|
||||||
onResult(success, successMessage) {
|
onResult(success, successMessage) {
|
||||||
if (success) {
|
if (success) {
|
||||||
this.$message.success(successMessage);
|
this.$message.success(successMessage);
|
||||||
this.onReloadData();
|
this.onReloadData();
|
||||||
}
|
}
|
||||||
this.$refs.table.onLoaded();
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 必要方法
|
||||||
|
* 删除时调用
|
||||||
|
*/
|
||||||
|
onDelete(record) {
|
||||||
|
this.$refs.table.onLoading();
|
||||||
|
this.$api[api.delete](record)
|
||||||
|
.then(({ success }) => {
|
||||||
|
this.onResult(success, '删除成功');
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
this.$refs.table.onLoaded();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
onSetDefault(record) {
|
onSetDefault(record) {
|
||||||
@@ -209,13 +275,6 @@ export default {
|
|||||||
this.onResult(success, '设置成功');
|
this.onResult(success, '设置成功');
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
onDelete(record) {
|
|
||||||
this.$refs.table.onLoading();
|
|
||||||
this.$api.sysAppDelete(record).then(({ success }) => {
|
|
||||||
this.onResult(success, '删除成功');
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -1,78 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
:visible="visible"
|
|
||||||
@cancel="onCancel"
|
|
||||||
@ok="onOk"
|
|
||||||
class="yo-modal-form"
|
|
||||||
title="新增字典类型"
|
|
||||||
>
|
|
||||||
<FormBody ref="form-body" />
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import FormBody from './form';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
FormBody,
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
visible: false,
|
|
||||||
confirmLoading: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
formBody() {
|
|
||||||
return this.$refs['form-body'];
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 从外部调用打开本窗口
|
|
||||||
*/
|
|
||||||
async onOpen() {
|
|
||||||
this.visible = true;
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.formBody.onInit();
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 点击保存时的操作
|
|
||||||
*/
|
|
||||||
onOk() {
|
|
||||||
this.formBody.onGetData().then((data) => {
|
|
||||||
this.confirmLoading = true;
|
|
||||||
this.$api
|
|
||||||
/** !!此处必须修改调用的接口方法 */
|
|
||||||
.sysDictTypeAdd(data)
|
|
||||||
.then(({ success }) => {
|
|
||||||
if (success) {
|
|
||||||
this.$message.success('新增成功');
|
|
||||||
this.onCancel();
|
|
||||||
this.$emit('ok');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
this.confirmLoading = false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 关闭窗口时的操作
|
|
||||||
*/
|
|
||||||
onCancel() {
|
|
||||||
this.formBody.onResetFields();
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
@@ -1,79 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
:visible="visible"
|
|
||||||
@cancel="onCancel"
|
|
||||||
@ok="onOk"
|
|
||||||
class="yo-modal-form"
|
|
||||||
title="新增字典数据"
|
|
||||||
>
|
|
||||||
<FormBody ref="form-body" />
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import FormBody from './form';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
FormBody,
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
visible: false,
|
|
||||||
confirmLoading: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
formBody() {
|
|
||||||
return this.$refs['form-body'];
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 从外部调用打开本窗口
|
|
||||||
*/
|
|
||||||
async onOpen(record, typeId) {
|
|
||||||
this.visible = true;
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.formBody.onInit();
|
|
||||||
this.formBody.onFillData(record, typeId);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 点击保存时的操作
|
|
||||||
*/
|
|
||||||
onOk() {
|
|
||||||
this.formBody.onGetData().then((data) => {
|
|
||||||
this.confirmLoading = true;
|
|
||||||
this.$api
|
|
||||||
/** !!此处必须修改调用的接口方法 */
|
|
||||||
.sysDictDataAdd(data)
|
|
||||||
.then(({ success }) => {
|
|
||||||
if (success) {
|
|
||||||
this.$message.success('新增成功');
|
|
||||||
this.onCancel();
|
|
||||||
this.$emit('ok');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
this.confirmLoading = false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 关闭窗口时的操作
|
|
||||||
*/
|
|
||||||
onCancel() {
|
|
||||||
this.formBody.onResetFields();
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
@@ -1,79 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
:visible="visible"
|
|
||||||
@cancel="onCancel"
|
|
||||||
@ok="onOk"
|
|
||||||
class="yo-modal-form"
|
|
||||||
title="编辑字典数据"
|
|
||||||
>
|
|
||||||
<FormBody ref="form-body" />
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import FormBody from './form';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
FormBody,
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
visible: false,
|
|
||||||
confirmLoading: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
formBody() {
|
|
||||||
return this.$refs['form-body'];
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 从外部调用打开本窗口,并填充外部传入的数据
|
|
||||||
*/
|
|
||||||
onOpen(record) {
|
|
||||||
this.visible = true;
|
|
||||||
this.$nextTick(async () => {
|
|
||||||
await this.formBody.onInit();
|
|
||||||
this.formBody.onFillData(record);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 点击保存时的操作
|
|
||||||
*/
|
|
||||||
onOk() {
|
|
||||||
this.formBody.onGetData().then((data) => {
|
|
||||||
this.confirmLoading = true;
|
|
||||||
this.$api
|
|
||||||
/** !!此处必须修改调用的接口方法 */
|
|
||||||
.sysDictDataEdit(data)
|
|
||||||
.then(({ success }) => {
|
|
||||||
if (success) {
|
|
||||||
this.$message.success('编辑成功');
|
|
||||||
this.onCancel();
|
|
||||||
this.$emit('ok');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
this.confirmLoading = false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 关闭窗口时的操作
|
|
||||||
*/
|
|
||||||
onCancel() {
|
|
||||||
this.formBody.onResetFields();
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
@@ -21,14 +21,16 @@
|
|||||||
</a-form-model>
|
</a-form-model>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
const defaultForm = {
|
||||||
|
typeId: '',
|
||||||
|
sort: 100,
|
||||||
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
/** 表单数据 */
|
/** 表单数据 */
|
||||||
form: {
|
form: {},
|
||||||
typeId: '',
|
|
||||||
sort: 100,
|
|
||||||
},
|
|
||||||
/** 验证格式 */
|
/** 验证格式 */
|
||||||
rules: {
|
rules: {
|
||||||
value: [{ required: true, message: '请输入字典值' }],
|
value: [{ required: true, message: '请输入字典值' }],
|
||||||
@@ -48,17 +50,15 @@ export default {
|
|||||||
* 必要的方法
|
* 必要的方法
|
||||||
* 在打开编辑页时允许填充数据
|
* 在打开编辑页时允许填充数据
|
||||||
*/
|
*/
|
||||||
onFillData(record, typeId) {
|
onFillData(params) {
|
||||||
if (typeId) {
|
/** 将默认数据覆盖到form */
|
||||||
this.form.typeId = typeId;
|
this.form = this.$_.cloneDeep({
|
||||||
} else {
|
...defaultForm,
|
||||||
/** 将默认数据覆盖到form */
|
...params.record,
|
||||||
this.form = this.$_.cloneDeep({
|
/** 在此处添加默认数据转换 */
|
||||||
...record,
|
/** ... */
|
||||||
/** 在此处添加默认数据转换 */
|
typeId: params.typeId,
|
||||||
/** ... */
|
});
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -1,26 +1,21 @@
|
|||||||
<template>
|
<template>
|
||||||
<a-card>
|
<a-card>
|
||||||
<Auth auth="sysDictData:page">
|
<yo-table
|
||||||
<div class="yo-query-bar">
|
:columns="columns"
|
||||||
<a-form-model :model="query" layout="inline">
|
:load-data="loadData"
|
||||||
<!-- 此处添加查询表单控件 -->
|
@query="onQuery"
|
||||||
<a-form-model-item label="文本">
|
@resetQuery="onResetQuery"
|
||||||
<a-input placeholder="请输入文本" v-model="query.value" />
|
ref="table"
|
||||||
</a-form-model-item>
|
>
|
||||||
<a-form-model-item label="字典值">
|
<Auth auth="sysDictData:page" slot="query">
|
||||||
<a-input placeholder="请输入字典值" v-model="query.code" />
|
<!-- 此处添加查询表单控件 -->
|
||||||
</a-form-model-item>
|
<a-form-model-item label="文本">
|
||||||
<a-form-model-item>
|
<a-input placeholder="请输入文本" v-model="query.value" />
|
||||||
<a-button-group>
|
</a-form-model-item>
|
||||||
<a-button @click="onQuery" type="primary">查询</a-button>
|
<a-form-model-item label="字典值">
|
||||||
<a-button @click="onResetQuery">重置</a-button>
|
<a-input placeholder="请输入字典值" v-model="query.code" />
|
||||||
</a-button-group>
|
</a-form-model-item>
|
||||||
</a-form-model-item>
|
</Auth>
|
||||||
</a-form-model>
|
|
||||||
</div>
|
|
||||||
</Auth>
|
|
||||||
|
|
||||||
<yo-table :columns="columns" :load-data="loadData" ref="table">
|
|
||||||
<Auth auth="sysDictData:add" slot="operator">
|
<Auth auth="sysDictData:add" slot="operator">
|
||||||
<a-button @click="onOpen('add-form')" icon="plus">新增字典数据</a-button>
|
<a-button @click="onOpen('add-form')" icon="plus">新增字典数据</a-button>
|
||||||
</Auth>
|
</Auth>
|
||||||
@@ -42,18 +37,21 @@
|
|||||||
</span>
|
</span>
|
||||||
</yo-table>
|
</yo-table>
|
||||||
|
|
||||||
<add-form @ok="onReloadData" ref="add-form" />
|
<yo-modal-form :action="$api.sysDictDataAdd" @ok="onReloadData" ref="add-form" title="新增字典数据">
|
||||||
<edit-form @ok="onReloadData" ref="edit-form" />
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
|
|
||||||
|
<yo-modal-form :action="$api.sysDictDataEdit" @ok="onReloadData" ref="edit-form" title="编辑字典数据">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
</a-card>
|
</a-card>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import AddForm from './addForm';
|
import FormBody from './form';
|
||||||
import EditForm from './editForm';
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
AddForm,
|
FormBody,
|
||||||
EditForm,
|
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
type: {
|
type: {
|
||||||
@@ -187,7 +185,10 @@ export default {
|
|||||||
* 从列表页调用窗口的打开方法
|
* 从列表页调用窗口的打开方法
|
||||||
*/
|
*/
|
||||||
onOpen(formName, record) {
|
onOpen(formName, record) {
|
||||||
this.$refs[formName].onOpen(record, this.type.id);
|
this.$refs[formName].onOpen({
|
||||||
|
typeId: this.type.id,
|
||||||
|
record,
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -1,79 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
:visible="visible"
|
|
||||||
@cancel="onCancel"
|
|
||||||
@ok="onOk"
|
|
||||||
class="yo-modal-form"
|
|
||||||
title="编辑字典类型"
|
|
||||||
>
|
|
||||||
<FormBody ref="form-body" />
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import FormBody from './form';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
FormBody,
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
visible: false,
|
|
||||||
confirmLoading: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
formBody() {
|
|
||||||
return this.$refs['form-body'];
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 从外部调用打开本窗口,并填充外部传入的数据
|
|
||||||
*/
|
|
||||||
onOpen(record) {
|
|
||||||
this.visible = true;
|
|
||||||
this.$nextTick(async () => {
|
|
||||||
await this.formBody.onInit();
|
|
||||||
this.formBody.onFillData(record);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 点击保存时的操作
|
|
||||||
*/
|
|
||||||
onOk() {
|
|
||||||
this.formBody.onGetData().then((data) => {
|
|
||||||
this.confirmLoading = true;
|
|
||||||
this.$api
|
|
||||||
/** !!此处必须修改调用的接口方法 */
|
|
||||||
.sysDictTypeEdit(data)
|
|
||||||
.then(({ success }) => {
|
|
||||||
if (success) {
|
|
||||||
this.$message.success('编辑成功');
|
|
||||||
this.onCancel();
|
|
||||||
this.$emit('ok');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
this.confirmLoading = false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 必要的方法
|
|
||||||
* 关闭窗口时的操作
|
|
||||||
*/
|
|
||||||
onCancel() {
|
|
||||||
this.formBody.onResetFields();
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
@@ -47,10 +47,10 @@ export default {
|
|||||||
* 必要的方法
|
* 必要的方法
|
||||||
* 在打开编辑页时允许填充数据
|
* 在打开编辑页时允许填充数据
|
||||||
*/
|
*/
|
||||||
onFillData(record) {
|
onFillData(params) {
|
||||||
/** 将默认数据覆盖到form */
|
/** 将默认数据覆盖到form */
|
||||||
this.form = this.$_.cloneDeep({
|
this.form = this.$_.cloneDeep({
|
||||||
...record,
|
...params.record,
|
||||||
/** 在此处添加默认数据转换 */
|
/** 在此处添加默认数据转换 */
|
||||||
/** ... */
|
/** ... */
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -2,27 +2,21 @@
|
|||||||
<container>
|
<container>
|
||||||
<br />
|
<br />
|
||||||
<a-card :bordered="false">
|
<a-card :bordered="false">
|
||||||
<Auth auth="sysDictType:page">
|
<yo-table
|
||||||
<div class="yo-query-bar">
|
:columns="columns"
|
||||||
<a-form-model :model="query" layout="inline">
|
:load-data="loadData"
|
||||||
<!-- 此处添加查询表单控件 -->
|
@query="onQuery"
|
||||||
<a-form-model-item label="类型名称">
|
@resetQuery="onResetQuery"
|
||||||
<a-input placeholder="请输入类型名称" v-model="query.name" />
|
ref="table"
|
||||||
</a-form-model-item>
|
>
|
||||||
<a-form-model-item label="唯一编码">
|
<Auth auth="sysDictType:page" slot="query">
|
||||||
<a-input placeholder="请输入唯一编码" v-model="query.code" />
|
<a-form-model-item label="类型名称">
|
||||||
</a-form-model-item>
|
<a-input placeholder="请输入类型名称" v-model="query.name" />
|
||||||
<a-form-model-item>
|
</a-form-model-item>
|
||||||
<a-button-group>
|
<a-form-model-item label="唯一编码">
|
||||||
<a-button @click="onQuery" type="primary">查询</a-button>
|
<a-input placeholder="请输入唯一编码" v-model="query.code" />
|
||||||
<a-button @click="onResetQuery">重置</a-button>
|
</a-form-model-item>
|
||||||
</a-button-group>
|
</Auth>
|
||||||
</a-form-model-item>
|
|
||||||
</a-form-model>
|
|
||||||
</div>
|
|
||||||
</Auth>
|
|
||||||
|
|
||||||
<yo-table :columns="columns" :load-data="loadData" ref="table">
|
|
||||||
<Auth auth="sysDictType:add" slot="operator">
|
<Auth auth="sysDictType:add" slot="operator">
|
||||||
<a-button @click="onOpen('add-form')" icon="plus">新增字典类型</a-button>
|
<a-button @click="onOpen('add-form')" icon="plus">新增字典类型</a-button>
|
||||||
</Auth>
|
</Auth>
|
||||||
@@ -48,21 +42,25 @@
|
|||||||
</yo-table>
|
</yo-table>
|
||||||
</a-card>
|
</a-card>
|
||||||
<br />
|
<br />
|
||||||
<add-form @ok="onReloadData" ref="add-form" />
|
|
||||||
<edit-form @ok="onReloadData" ref="edit-form" />
|
<yo-modal-form :action="$api.sysDictTypeAdd" @ok="onReloadData" ref="add-form" title="新增字典类型">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
|
|
||||||
|
<yo-modal-form :action="$api.sysDictTypeEdit" @ok="onReloadData" ref="edit-form" title="编辑字典类型">
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
</container>
|
</container>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import DictData from './dictdata';
|
import DictData from './dictdata';
|
||||||
|
|
||||||
import AddForm from './addForm';
|
import FormBody from './form';
|
||||||
import EditForm from './editForm';
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
DictData,
|
DictData,
|
||||||
AddForm,
|
FormBody,
|
||||||
EditForm,
|
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@@ -197,7 +195,9 @@ export default {
|
|||||||
* 从列表页调用窗口的打开方法
|
* 从列表页调用窗口的打开方法
|
||||||
*/
|
*/
|
||||||
onOpen(formName, record) {
|
onOpen(formName, record) {
|
||||||
this.$refs[formName].onOpen(record);
|
this.$refs[formName].onOpen({
|
||||||
|
record,
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -1,17 +1,23 @@
|
|||||||
|
import { template } from "lodash"
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
props: {
|
props: {
|
||||||
code: {
|
code: {
|
||||||
type: String
|
type: String
|
||||||
|
},
|
||||||
|
copyTemplate: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
onCopy() {
|
baseCopy(content) {
|
||||||
try {
|
try {
|
||||||
const $textarea = document.createElement('textarea')
|
const $textarea = document.createElement('textarea')
|
||||||
$textarea.style = 'opacity: 0;position: fixed;top: -10000;left: -10000'
|
$textarea.style = 'opacity: 0;position: fixed;top: -10000;left: -10000'
|
||||||
document.body.append($textarea)
|
document.body.append($textarea)
|
||||||
$textarea.value = this.code
|
$textarea.value = content
|
||||||
$textarea.select()
|
$textarea.select()
|
||||||
document.execCommand('copy')
|
document.execCommand('copy')
|
||||||
$textarea.remove()
|
$textarea.remove()
|
||||||
@@ -21,7 +27,24 @@ export default {
|
|||||||
{
|
{
|
||||||
this.$message.error('复制失败')
|
this.$message.error('复制失败')
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
|
onCopy() {
|
||||||
|
this.baseCopy(this.code)
|
||||||
|
},
|
||||||
|
onCopyTemplate() {
|
||||||
|
const code = '"' +
|
||||||
|
this.code
|
||||||
|
// 转义双引号 => \"
|
||||||
|
.replace(/"/g, '\\"')
|
||||||
|
// 转义$ => $$
|
||||||
|
.replace(/\$/g, '$$$$')
|
||||||
|
// 替换行首 => "
|
||||||
|
.replace(/\n/g, '"')
|
||||||
|
// 替换行末 = ",
|
||||||
|
.replace(/\r/g, '",\r') +
|
||||||
|
'"'
|
||||||
|
this.baseCopy(code)
|
||||||
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
@@ -34,7 +57,26 @@ export default {
|
|||||||
<section>
|
<section>
|
||||||
<highlightjs {...{ props }} style={{ maxHeight: '400px', overflow: 'auto' }} />
|
<highlightjs {...{ props }} style={{ maxHeight: '400px', overflow: 'auto' }} />
|
||||||
<div class="text-right">
|
<div class="text-right">
|
||||||
<a-button size="small" type="dashed" onClick={this.onCopy} class="mb-xs">Copy</a-button>
|
{this.$scopedSlots.actions && this.$scopedSlots.actions().map(p => {
|
||||||
|
return (
|
||||||
|
<span>
|
||||||
|
{p}
|
||||||
|
<a-divider type="vertical" />
|
||||||
|
</span>
|
||||||
|
)
|
||||||
|
})}
|
||||||
|
{
|
||||||
|
this.copyTemplate &&
|
||||||
|
<span>
|
||||||
|
<a-tooltip title="复制用户片段模版">
|
||||||
|
<a-button size="small" type="dashed" onClick={this.onCopyTemplate} class="mb-xs">Copy template</a-button>
|
||||||
|
</a-tooltip>
|
||||||
|
<a-divider type="vertical" />
|
||||||
|
</span>
|
||||||
|
}
|
||||||
|
<a-tooltip title="复制内容">
|
||||||
|
<a-button size="small" type="dashed" onClick={this.onCopy} class="mb-xs">Copy</a-button>
|
||||||
|
</a-tooltip>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -3,12 +3,7 @@
|
|||||||
<container>
|
<container>
|
||||||
<a-row :gutter="16" type="flex">
|
<a-row :gutter="16" type="flex">
|
||||||
<a-col flex="auto">
|
<a-col flex="auto">
|
||||||
<container
|
<container :id="`doc-${index}`" :key="index" v-for="(doc, index) in docs">
|
||||||
:id="`doc-${index}`"
|
|
||||||
:key="index"
|
|
||||||
mode="container"
|
|
||||||
v-for="(doc, index) in docs"
|
|
||||||
>
|
|
||||||
<section>
|
<section>
|
||||||
<h1>{{ doc.title }}</h1>
|
<h1>{{ doc.title }}</h1>
|
||||||
<component :codes="codes" :is="doc.component" v-if="doc.path" />
|
<component :codes="codes" :is="doc.component" v-if="doc.path" />
|
||||||
|
|||||||
@@ -1,20 +1,10 @@
|
|||||||
<template>
|
<template>
|
||||||
<section>
|
<section>
|
||||||
<h4>
|
<p>
|
||||||
新增
|
当前版本
|
||||||
<a-tag>1.0</a-tag>
|
<a-tag>1.2</a-tag>
|
||||||
</h4>
|
</p>
|
||||||
<Highlight :code="codes['/seed/addForm.vue']" language="html" />
|
<Highlight :code="codes['/seed/form.vue']" copy-template language="html" />
|
||||||
<h4>
|
|
||||||
编辑
|
|
||||||
<a-tag>1.0</a-tag>
|
|
||||||
</h4>
|
|
||||||
<Highlight :code="codes['/seed/editForm.vue']" language="html" />
|
|
||||||
<h4>
|
|
||||||
表单主体
|
|
||||||
<a-tag>1.0</a-tag>
|
|
||||||
</h4>
|
|
||||||
<Highlight :code="codes['/seed/form.vue']" language="html" />
|
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@@ -30,4 +20,4 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -2,9 +2,9 @@
|
|||||||
<section>
|
<section>
|
||||||
<p>
|
<p>
|
||||||
当前版本
|
当前版本
|
||||||
<a-tag>1.1</a-tag>
|
<a-tag>1.2</a-tag>
|
||||||
</p>
|
</p>
|
||||||
<Highlight :code="codes['/seed/query.vue']" language="html" />
|
<Highlight :code="codes['/seed/query.vue']" copy-template language="html" />
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -2,9 +2,9 @@
|
|||||||
<section>
|
<section>
|
||||||
<p>
|
<p>
|
||||||
当前版本
|
当前版本
|
||||||
<a-tag>1.0</a-tag>
|
<a-tag>1.1</a-tag>
|
||||||
</p>
|
</p>
|
||||||
<Highlight :code="codes['/seed/treeLayout.vue']" language="html" />
|
<Highlight :code="codes['/seed/treeLayout.vue']" copy-template language="html" />
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -148,9 +148,7 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
/** 表单数据 */
|
/** 表单数据 */
|
||||||
form: {
|
form: {},
|
||||||
...defaultValue,
|
|
||||||
},
|
|
||||||
/** 验证格式 */
|
/** 验证格式 */
|
||||||
rules: {
|
rules: {
|
||||||
type: [{ required: true, message: '请选择菜单类型' }],
|
type: [{ required: true, message: '请选择菜单类型' }],
|
||||||
@@ -185,13 +183,21 @@ export default {
|
|||||||
* 必要的方法
|
* 必要的方法
|
||||||
* 在打开编辑页时允许填充数据
|
* 在打开编辑页时允许填充数据
|
||||||
*/
|
*/
|
||||||
onFillData(record) {
|
onFillData(params) {
|
||||||
/** 将默认数据覆盖到form */
|
/** 将默认数据覆盖到form */
|
||||||
this.form = this.$_.cloneDeep({
|
let form = {
|
||||||
...record,
|
...defaultValue,
|
||||||
|
...params.record,
|
||||||
/** 在此处添加默认数据转换 */
|
/** 在此处添加默认数据转换 */
|
||||||
/** ... */
|
/** ... */
|
||||||
});
|
};
|
||||||
|
|
||||||
|
if (params.isParent) {
|
||||||
|
form.pid = params.parent.id;
|
||||||
|
form.application = params.parent.application;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.form = this.$_.cloneDeep(form);
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -244,20 +250,17 @@ export default {
|
|||||||
* 必要方法
|
* 必要方法
|
||||||
* 加载当前表单中所需要的异步数据
|
* 加载当前表单中所需要的异步数据
|
||||||
*/
|
*/
|
||||||
async onInit(record, isParent = false) {
|
async onInit(params) {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
|
|
||||||
/** 可以在这里await获取一些异步数据 */
|
/** 可以在这里await获取一些异步数据 */
|
||||||
/** ...BEGIN */
|
/** ...BEGIN */
|
||||||
this.codes = await this.onLoadCodes();
|
this.codes = await this.onLoadCodes();
|
||||||
this.appList = await this.onLoadSysApplist();
|
this.appList = await this.onLoadSysApplist();
|
||||||
if (record) {
|
if (params.isParent) {
|
||||||
await this.onLoadMenuTree(record.application);
|
await this.onLoadMenuTree(params.parent.application);
|
||||||
|
} else if (params.record) {
|
||||||
if (isParent) {
|
await this.onLoadMenuTree(params.record.application);
|
||||||
this.$set(this.form, 'pid', record.id);
|
|
||||||
this.$set(this.form, 'application', record.application);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
/** ...END */
|
/** ...END */
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
|
|||||||
@@ -19,7 +19,7 @@
|
|||||||
<span slot="action" slot-scope="text, record">
|
<span slot="action" slot-scope="text, record">
|
||||||
<yo-table-actions>
|
<yo-table-actions>
|
||||||
<Auth auth="sysMenu:add" v-if="record.type < 2">
|
<Auth auth="sysMenu:add" v-if="record.type < 2">
|
||||||
<a @click="onOpen('add-form', record)">新增子菜单</a>
|
<a @click="onOpen('add-form', record, true)">新增子菜单</a>
|
||||||
</Auth>
|
</Auth>
|
||||||
<Auth auth="sysMenu:edit">
|
<Auth auth="sysMenu:edit">
|
||||||
<a @click="onOpen('edit-form', record)">编辑</a>
|
<a @click="onOpen('edit-form', record)">编辑</a>
|
||||||
@@ -33,19 +33,36 @@
|
|||||||
</span>
|
</span>
|
||||||
</yo-table>
|
</yo-table>
|
||||||
</a-card>
|
</a-card>
|
||||||
<br />
|
|
||||||
<add-form @ok="onReloadData" ref="add-form" />
|
<yo-modal-form
|
||||||
<edit-form @ok="onReloadData" ref="edit-form" />
|
:action="$api.sysMenuAdd"
|
||||||
|
:width="800"
|
||||||
|
@ok="onReloadData"
|
||||||
|
ref="add-form"
|
||||||
|
title="新增菜单"
|
||||||
|
type="drawer"
|
||||||
|
>
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
|
|
||||||
|
<yo-modal-form
|
||||||
|
:action="$api.sysMenuEdit"
|
||||||
|
:width="800"
|
||||||
|
@ok="onReloadData"
|
||||||
|
ref="edit-form"
|
||||||
|
title="编辑菜单"
|
||||||
|
type="drawer"
|
||||||
|
>
|
||||||
|
<form-body />
|
||||||
|
</yo-modal-form>
|
||||||
</container>
|
</container>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import AddForm from './addForm';
|
import FormBody from './form';
|
||||||
import EditForm from './editForm';
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
AddForm,
|
FormBody,
|
||||||
EditForm,
|
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@@ -178,8 +195,17 @@ export default {
|
|||||||
* 有编辑新增功能的必要方法
|
* 有编辑新增功能的必要方法
|
||||||
* 从列表页调用窗口的打开方法
|
* 从列表页调用窗口的打开方法
|
||||||
*/
|
*/
|
||||||
onOpen(formName, record) {
|
onOpen(formName, record, isParent = false) {
|
||||||
this.$refs[formName].onOpen(record);
|
const params = isParent
|
||||||
|
? {
|
||||||
|
parent: record,
|
||||||
|
isParent,
|
||||||
|
}
|
||||||
|
: {
|
||||||
|
record,
|
||||||
|
isParent,
|
||||||
|
};
|
||||||
|
this.$refs[formName].onOpen(params);
|
||||||
},
|
},
|
||||||
|
|
||||||
onResult(success, successMessage) {
|
onResult(success, successMessage) {
|
||||||
|
|||||||
@@ -138,17 +138,6 @@ export default {
|
|||||||
|
|
||||||
onLoadAreaTreeData() {
|
onLoadAreaTreeData() {
|
||||||
return this.$api.getAreaTree().then(({ data }) => {
|
return this.$api.getAreaTree().then(({ data }) => {
|
||||||
// 为了防止出现空的层级选择,删除所有空children节点
|
|
||||||
const clearChiildren = (data) => {
|
|
||||||
data.forEach((item) => {
|
|
||||||
if (item.children && item.children.length) {
|
|
||||||
clearChiildren(item.children);
|
|
||||||
} else {
|
|
||||||
delete item.children;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
clearChiildren(data);
|
|
||||||
return data;
|
return data;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -11,16 +11,27 @@
|
|||||||
<a-spin :spinning="loading">
|
<a-spin :spinning="loading">
|
||||||
<a-icon slot="indicator" spin type="loading" />
|
<a-icon slot="indicator" spin type="loading" />
|
||||||
<div class="yo-form-group">
|
<div class="yo-form-group">
|
||||||
<a-form-model-item class="yo-form--fluid">
|
<a-form-model-item label="选择机构">
|
||||||
<a-tree-select
|
<a-tree-select
|
||||||
:show-checked-strategy="SHOW_PARENT"
|
:show-checked-strategy="SHOW_PARENT"
|
||||||
:tree-data="orgList"
|
:tree-data="orgTreeData"
|
||||||
placeholder="请选择机构"
|
placeholder="请选择机构"
|
||||||
search-placeholder="请检索"
|
search-placeholder="请检索"
|
||||||
tree-checkable
|
tree-checkable
|
||||||
v-model="orgs"
|
v-model="orgs"
|
||||||
/>
|
/>
|
||||||
</a-form-model-item>
|
</a-form-model-item>
|
||||||
|
<a-form-model-item label="区域">
|
||||||
|
<a-tree-select
|
||||||
|
:replace-fields="{ title: 'name', value: 'code', children: 'children' }"
|
||||||
|
:show-checked-strategy="SHOW_PARENT"
|
||||||
|
:tree-data="arerTreeData"
|
||||||
|
placeholder="请区域"
|
||||||
|
search-placeholder="请检索"
|
||||||
|
tree-checkable
|
||||||
|
v-model="areas"
|
||||||
|
/>
|
||||||
|
</a-form-model-item>
|
||||||
</div>
|
</div>
|
||||||
</a-spin>
|
</a-spin>
|
||||||
</a-form-model>
|
</a-form-model>
|
||||||
@@ -40,7 +51,11 @@ export default {
|
|||||||
|
|
||||||
id: '',
|
id: '',
|
||||||
orgs: [],
|
orgs: [],
|
||||||
orgList: [],
|
orgTreeData: [],
|
||||||
|
|
||||||
|
areas: [],
|
||||||
|
arerTreeData: [],
|
||||||
|
|
||||||
SHOW_PARENT,
|
SHOW_PARENT,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
@@ -69,6 +84,7 @@ export default {
|
|||||||
.sysUserGrantData({
|
.sysUserGrantData({
|
||||||
id: this.id,
|
id: this.id,
|
||||||
grantOrgIdList: this.orgs,
|
grantOrgIdList: this.orgs,
|
||||||
|
grantAreaCodeList: this.areas,
|
||||||
})
|
})
|
||||||
.then(({ success }) => {
|
.then(({ success }) => {
|
||||||
if (success) {
|
if (success) {
|
||||||
@@ -90,22 +106,31 @@ export default {
|
|||||||
this.visible = false;
|
this.visible = false;
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.orgs = [];
|
this.orgs = [];
|
||||||
|
this.areas = [];
|
||||||
}, 300);
|
}, 300);
|
||||||
},
|
},
|
||||||
|
|
||||||
async onInit() {
|
async onInit() {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
this.orgList = await this.onLoadOrgList();
|
this.orgTreeData = await this.onLoadOrgTreeData();
|
||||||
this.orgs = await this.onLoadOrg();
|
this.orgs = await this.onLoadOrg();
|
||||||
|
|
||||||
|
this.arerTreeData = await this.onLoadAreaTreeData();
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
},
|
},
|
||||||
|
|
||||||
onLoadOrgList() {
|
onLoadOrgTreeData() {
|
||||||
return this.$api.getOrgTree().then(({ data }) => {
|
return this.$api.getOrgTree().then(({ data }) => {
|
||||||
return data;
|
return data;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
onLoadAreaTreeData() {
|
||||||
|
return this.$api.getAreaTree().then(({ data }) => {
|
||||||
|
return data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
onLoadOrg() {
|
onLoadOrg() {
|
||||||
return this.$api.sysUserOwnData({ id: this.id }).then(({ data }) => {
|
return this.$api.sysUserOwnData({ id: this.id }).then(({ data }) => {
|
||||||
return data;
|
return data;
|
||||||
@@ -66,7 +66,7 @@
|
|||||||
</Auth>
|
</Auth>
|
||||||
<Auth auth="sysUser:grantData">
|
<Auth auth="sysUser:grantData">
|
||||||
<a-menu-item>
|
<a-menu-item>
|
||||||
<a @click="onOpen('org-form', record)">授权额外数据</a>
|
<a @click="onOpen('data-form', record)">授权额外数据</a>
|
||||||
</a-menu-item>
|
</a-menu-item>
|
||||||
</Auth>
|
</Auth>
|
||||||
</a-menu>
|
</a-menu>
|
||||||
@@ -112,7 +112,7 @@
|
|||||||
<add-form @ok="onReloadData" ref="add-form" />
|
<add-form @ok="onReloadData" ref="add-form" />
|
||||||
<edit-form @ok="onReloadData" ref="edit-form" />
|
<edit-form @ok="onReloadData" ref="edit-form" />
|
||||||
<role-form @ok="onReloadData" ref="role-form" />
|
<role-form @ok="onReloadData" ref="role-form" />
|
||||||
<org-form @ok="onReloadData" ref="org-form" />
|
<data-form @ok="onReloadData" ref="data-form" />
|
||||||
</yo-tree-layout>
|
</yo-tree-layout>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@@ -122,7 +122,7 @@ import YoList from '@/components/yoList';
|
|||||||
import AddForm from './addForm';
|
import AddForm from './addForm';
|
||||||
import EditForm from './editForm';
|
import EditForm from './editForm';
|
||||||
import RoleForm from './roleForm';
|
import RoleForm from './roleForm';
|
||||||
import OrgForm from './orgForm';
|
import DataForm from './dataForm';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
@@ -131,7 +131,7 @@ export default {
|
|||||||
AddForm,
|
AddForm,
|
||||||
EditForm,
|
EditForm,
|
||||||
RoleForm,
|
RoleForm,
|
||||||
OrgForm,
|
DataForm,
|
||||||
},
|
},
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
|
|||||||
@@ -10,7 +10,7 @@
|
|||||||
>
|
>
|
||||||
<a-icon :type="$root.global.settings.siderCollapsed ? 'menu-unfold' : 'menu-fold'" />
|
<a-icon :type="$root.global.settings.siderCollapsed ? 'menu-unfold' : 'menu-fold'" />
|
||||||
</a>
|
</a>
|
||||||
<search :menus="nav.menus" />
|
<search :menus="nav.content" />
|
||||||
</div>
|
</div>
|
||||||
<div class="header-actions">
|
<div class="header-actions">
|
||||||
<User />
|
<User />
|
||||||
@@ -29,9 +29,11 @@
|
|||||||
</section>
|
</section>
|
||||||
<container v-else-if="$root.global.settings.layout === 'top-nav'">
|
<container v-else-if="$root.global.settings.layout === 'top-nav'">
|
||||||
<div class="header-actions">
|
<div class="header-actions">
|
||||||
|
<a @click="showNav = !showNav" class="header-action mr-md">
|
||||||
|
<a-icon type="menu" />
|
||||||
|
</a>
|
||||||
<Logo />
|
<Logo />
|
||||||
<Sider :nav="nav" @open="(nav) => $emit('open', nav)" />
|
<search :menus="nav.content" />
|
||||||
<search :menus="nav.menus" />
|
|
||||||
</div>
|
</div>
|
||||||
<div class="header-actions">
|
<div class="header-actions">
|
||||||
<User />
|
<User />
|
||||||
@@ -47,12 +49,26 @@
|
|||||||
<a-icon type="setting" />
|
<a-icon type="setting" />
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
<a-drawer
|
||||||
|
:body-style="{ padding: 0 }"
|
||||||
|
:closable="false"
|
||||||
|
:get-container="'.ant-layout-content > .ant-tabs'"
|
||||||
|
:visible="showNav"
|
||||||
|
:wrap-style="{ position: 'absolute' }"
|
||||||
|
@close="showNav = false"
|
||||||
|
placement="left"
|
||||||
|
width="38.2%"
|
||||||
|
>
|
||||||
|
<div @blur="showNav = false" @mouseleave="showNav = false">
|
||||||
|
<Nav :nav="nav" @open="showNav = false" />
|
||||||
|
</div>
|
||||||
|
</a-drawer>
|
||||||
</container>
|
</container>
|
||||||
</a-layout-header>
|
</a-layout-header>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import Logo from '../logo';
|
import Logo from '../logo';
|
||||||
import Sider from '../sider';
|
import Nav from '../nav';
|
||||||
|
|
||||||
import User from './user';
|
import User from './user';
|
||||||
import Search from './search';
|
import Search from './search';
|
||||||
@@ -60,7 +76,7 @@ import Search from './search';
|
|||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
Logo,
|
Logo,
|
||||||
Sider,
|
Nav,
|
||||||
|
|
||||||
User,
|
User,
|
||||||
Search,
|
Search,
|
||||||
@@ -69,12 +85,16 @@ export default {
|
|||||||
nav: {
|
nav: {
|
||||||
default() {
|
default() {
|
||||||
return {
|
return {
|
||||||
apps: [],
|
content: [],
|
||||||
menus: [],
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
type: Object,
|
type: Object,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
showNav: false,
|
||||||
|
};
|
||||||
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -46,7 +46,7 @@ export default {
|
|||||||
onSearch(value) {
|
onSearch(value) {
|
||||||
this.searchText = value
|
this.searchText = value
|
||||||
|
|
||||||
const menus = this.$_.cloneDeep(this.menus)
|
const menus = this.$_.concat.apply(this, this.$_.cloneDeep(this.menus.map(p => p.menu)))
|
||||||
|
|
||||||
const search = (m) => {
|
const search = (m) => {
|
||||||
if (!value) return []
|
if (!value) return []
|
||||||
@@ -83,12 +83,14 @@ export default {
|
|||||||
return result
|
return result
|
||||||
}
|
}
|
||||||
|
|
||||||
this.searchResult = unzip(search(menus)).map(p => {
|
const result = unzip(search(menus)).filter(p => p.parents.length).map(p => {
|
||||||
return {
|
return {
|
||||||
parents: p.parents.join('-'),
|
parents: p.parents.join('-'),
|
||||||
children: p.children
|
children: p.children
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
this.searchResult = result
|
||||||
},
|
},
|
||||||
|
|
||||||
onSearchSelect(value, node) {
|
onSearchSelect(value, node) {
|
||||||
|
|||||||
78
Web/src/views/main/_layout/nav/index.js
Normal file
78
Web/src/views/main/_layout/nav/index.js
Normal file
@@ -0,0 +1,78 @@
|
|||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
nav: {
|
||||||
|
type: Object,
|
||||||
|
default() {
|
||||||
|
return {
|
||||||
|
content: []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
onOpenContentWindow(menu) {
|
||||||
|
this.$emit('open')
|
||||||
|
setTimeout(() => {
|
||||||
|
this.openContentWindow({
|
||||||
|
key: menu.id,
|
||||||
|
title: menu.meta.title,
|
||||||
|
icon: menu.meta.icon,
|
||||||
|
path: menu.component,
|
||||||
|
})
|
||||||
|
}, 300)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<container mode="container-fluid">
|
||||||
|
{this.nav.content.map((item, i) => {
|
||||||
|
return (
|
||||||
|
<section class="yo-nav">
|
||||||
|
<h5 class="yo-nav--app">{item.app.name}</h5>
|
||||||
|
<div class="yo-nav--row">
|
||||||
|
{
|
||||||
|
item.menu.map(sub => {
|
||||||
|
return (
|
||||||
|
<div class="yo-nav--col">
|
||||||
|
<div class="yo-nav--sub-item">
|
||||||
|
{
|
||||||
|
sub.children ?
|
||||||
|
<div class="yo-nav--item-group">
|
||||||
|
{
|
||||||
|
sub.meta.icon && <a-icon type={sub.meta.icon} class="mr-xs" />
|
||||||
|
}
|
||||||
|
{sub.meta.title}
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
<div class="yo-nav--item" onClick={() => this.onOpenContentWindow(sub)}>
|
||||||
|
{
|
||||||
|
sub.meta.icon && <a-icon type={sub.meta.icon} class="mr-xs" />
|
||||||
|
}
|
||||||
|
{sub.meta.title}
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
{
|
||||||
|
sub.children && sub.children.map(menu => {
|
||||||
|
return <div class="yo-nav--item" onClick={() => this.onOpenContentWindow(menu)}>
|
||||||
|
{
|
||||||
|
menu.meta.icon && <a-icon type={menu.meta.icon} class="mr-xs" />
|
||||||
|
}
|
||||||
|
{menu.meta.title}
|
||||||
|
</div>
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
)
|
||||||
|
})}
|
||||||
|
</container>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -1,46 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-popover :placement="placement" trigger="click">
|
|
||||||
<template slot="content">
|
|
||||||
<a-button-group>
|
|
||||||
<a-button :key="app.code" @click="onChangeApp(app)" v-for="app in apps">{{ app.name }}</a-button>
|
|
||||||
</a-button-group>
|
|
||||||
</template>
|
|
||||||
<div class="yo-apps-selector">
|
|
||||||
<span>{{ appActived.name }}</span>
|
|
||||||
</div>
|
|
||||||
</a-popover>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
apps: {
|
|
||||||
type: Array,
|
|
||||||
require: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
placement() {
|
|
||||||
const layout = this.$root.global.settings.layout;
|
|
||||||
switch (layout) {
|
|
||||||
case 'left-menu':
|
|
||||||
return 'right';
|
|
||||||
case 'right-menu':
|
|
||||||
return 'left';
|
|
||||||
default:
|
|
||||||
return 'bottom';
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
appActived() {
|
|
||||||
return this.apps.find((p) => p.active) || {};
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
onChangeApp(app) {
|
|
||||||
this.$emit('change-app', app);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
@@ -1,138 +0,0 @@
|
|||||||
<template>
|
|
||||||
<section>
|
|
||||||
<a-layout-sider
|
|
||||||
:collapsed="siderCollapsed === undefined ? $root.global.settings.siderCollapsed : siderCollapsed"
|
|
||||||
@collapse="onCollapse"
|
|
||||||
v-if="$root.global.settings.layout === 'left-menu' || $root.global.settings.layout === 'right-menu'"
|
|
||||||
width="200"
|
|
||||||
>
|
|
||||||
<Logo />
|
|
||||||
<div class="yo-sider-nav">
|
|
||||||
<App :apps="nav.apps" @change-app="(app) => $emit('change-app', app)" />
|
|
||||||
<!-- <swiper :options="siderSwiperOptions" ref="sider-swiper">
|
|
||||||
<swiper-slide>
|
|
||||||
<a-spin :spinning="nav.loading">
|
|
||||||
<a-icon slot="indicator" spin type="loading" />
|
|
||||||
<Menu
|
|
||||||
:menu-style="{ height: '100%', borderRight: 0 }"
|
|
||||||
:nav="nav"
|
|
||||||
@openChange="onMenuOpenChange"
|
|
||||||
mode="inline"
|
|
||||||
/>
|
|
||||||
</a-spin>
|
|
||||||
</swiper-slide>
|
|
||||||
<div class="swiper-scrollbar" id="layout--swiper-scrollbar" slot="scrollbar"></div>
|
|
||||||
</swiper>-->
|
|
||||||
<div class="swiper-container" id="layout--swiper-container">
|
|
||||||
<div class="swiper-wrapper">
|
|
||||||
<div class="swiper-slide">
|
|
||||||
<a-spin :spinning="nav.loading">
|
|
||||||
<a-icon slot="indicator" spin type="loading" />
|
|
||||||
<Menu
|
|
||||||
:menu-style="{ height: '100%', borderRight: 0 }"
|
|
||||||
:nav="nav"
|
|
||||||
@openChange="onMenuOpenChange"
|
|
||||||
mode="inline"
|
|
||||||
/>
|
|
||||||
</a-spin>
|
|
||||||
</div>
|
|
||||||
<div class="swiper-scrollbar" id="layout--swiper-scrollbar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a-layout-sider>
|
|
||||||
<template v-else-if="$root.global.settings.layout === 'top-nav'">
|
|
||||||
<Menu
|
|
||||||
:menu-style="{ borderBottom: 0 }"
|
|
||||||
:nav="nav"
|
|
||||||
@openChange="onMenuOpenChange"
|
|
||||||
mode="horizontal"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</section>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import Logo from '../logo';
|
|
||||||
import App from './app';
|
|
||||||
import Menu from './menu';
|
|
||||||
|
|
||||||
import Swiper from 'swiper';
|
|
||||||
|
|
||||||
let timer,
|
|
||||||
swiper,
|
|
||||||
siderSwiperOptions = {
|
|
||||||
direction: 'vertical',
|
|
||||||
slidesPerView: 'auto',
|
|
||||||
freeMode: true,
|
|
||||||
scrollbar: {
|
|
||||||
el: '#layout--swiper-scrollbar',
|
|
||||||
},
|
|
||||||
mousewheel: true,
|
|
||||||
};
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
Logo,
|
|
||||||
App,
|
|
||||||
Menu,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
nav: {
|
|
||||||
default() {
|
|
||||||
return {
|
|
||||||
apps: [],
|
|
||||||
menus: [],
|
|
||||||
loading: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
type: Object,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
siderCollapsed: undefined,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
swiper = new Swiper('#layout--swiper-container', siderSwiperOptions);
|
|
||||||
|
|
||||||
window.addEventListener('resize', () => {
|
|
||||||
if (this.$root.global.settings.layout === 'left-menu' || this.$root.global.settings.layout === 'right-menu') {
|
|
||||||
if (!this.$root.global.settings.siderCollapsed) {
|
|
||||||
if (window.innerWidth < 1000) {
|
|
||||||
this.siderCollapsed = true;
|
|
||||||
} else {
|
|
||||||
this.siderCollapsed = undefined;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
this.onUpdateSwiper();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
onUpdateSwiper() {
|
|
||||||
clearTimeout(timer);
|
|
||||||
timer = setTimeout(() => {
|
|
||||||
// if (this.$refs['sider-swiper']) {
|
|
||||||
// this.$refs['sider-swiper'].$swiper.update();
|
|
||||||
// }
|
|
||||||
swiper.update();
|
|
||||||
}, 300);
|
|
||||||
},
|
|
||||||
|
|
||||||
onMenuOpenChange() {
|
|
||||||
this.onUpdateSwiper();
|
|
||||||
},
|
|
||||||
|
|
||||||
onCollapse() {
|
|
||||||
this.onUpdateSwiper();
|
|
||||||
},
|
|
||||||
|
|
||||||
windowTriggerResize() {
|
|
||||||
let e = new Event('resize');
|
|
||||||
window.dispatchEvent(e);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
@@ -8,7 +8,6 @@
|
|||||||
>
|
>
|
||||||
<Logo />
|
<Logo />
|
||||||
<div class="yo-sider-nav">
|
<div class="yo-sider-nav">
|
||||||
<App :apps="nav.apps" @change-app="(app) => $emit('change-app', app)" />
|
|
||||||
<div class="swiper-container" id="layout--swiper-container">
|
<div class="swiper-container" id="layout--swiper-container">
|
||||||
<div class="swiper-wrapper">
|
<div class="swiper-wrapper">
|
||||||
<div class="swiper-slide">
|
<div class="swiper-slide">
|
||||||
@@ -27,19 +26,10 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</a-layout-sider>
|
</a-layout-sider>
|
||||||
<template v-else-if="$root.global.settings.layout === 'top-nav'">
|
|
||||||
<Menu
|
|
||||||
:menu-style="{ borderBottom: 0 }"
|
|
||||||
:nav="nav"
|
|
||||||
@openChange="onMenuOpenChange"
|
|
||||||
mode="horizontal"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import Logo from '../logo';
|
import Logo from '../logo';
|
||||||
import App from './app';
|
|
||||||
import Menu from './menu';
|
import Menu from './menu';
|
||||||
|
|
||||||
import Swiper from 'swiper';
|
import Swiper from 'swiper';
|
||||||
@@ -59,7 +49,6 @@ let timer,
|
|||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
Logo,
|
Logo,
|
||||||
App,
|
|
||||||
Menu,
|
Menu,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
|
|||||||
@@ -1,10 +1,11 @@
|
|||||||
|
import { HmacMD5 } from "crypto-js"
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
props: {
|
props: {
|
||||||
nav: {
|
nav: {
|
||||||
default() {
|
default() {
|
||||||
return {
|
return {
|
||||||
modules: [],
|
content: []
|
||||||
menus: [],
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
type: Object,
|
type: Object,
|
||||||
@@ -75,6 +76,17 @@ export default {
|
|||||||
openChange: this.onMenuOpenChange,
|
openChange: this.onMenuOpenChange,
|
||||||
}
|
}
|
||||||
|
|
||||||
return <a-menu {...{ props, on }}>{this.renderMenu(this.nav.menus)}</a-menu>
|
return (<section>
|
||||||
|
{
|
||||||
|
this.nav.content.map(item => {
|
||||||
|
return (
|
||||||
|
<section>
|
||||||
|
<div class="yo-sider-nav--app">{item.app.name}</div>
|
||||||
|
<a-menu {...{ props, on }}>{this.renderMenu(item.menu)}</a-menu>
|
||||||
|
</section>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</section>)
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
@@ -6,11 +6,7 @@
|
|||||||
[`yo-layout--${$root.global.settings.layout}`]: true,
|
[`yo-layout--${$root.global.settings.layout}`]: true,
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<Sider
|
<Sider :nav="nav" v-if="$root.global.settings.layout === 'left-menu'" />
|
||||||
:nav="nav"
|
|
||||||
@change-app="onChangeApp"
|
|
||||||
v-if="$root.global.settings.layout === 'left-menu'"
|
|
||||||
/>
|
|
||||||
<a-layout>
|
<a-layout>
|
||||||
<Header :nav="nav" @reload="onReloadContentWindow" @setting="setting.visible = true" />
|
<Header :nav="nav" @reload="onReloadContentWindow" @setting="setting.visible = true" />
|
||||||
<a-layout>
|
<a-layout>
|
||||||
@@ -40,7 +36,6 @@ import Content from './_layout/content';
|
|||||||
import Setting from './setting';
|
import Setting from './setting';
|
||||||
|
|
||||||
import { setGlobal } from '@/common/login';
|
import { setGlobal } from '@/common/login';
|
||||||
import { ACTIVE_APP_KEY } from '@/common/storage';
|
|
||||||
|
|
||||||
import { EMPTY_ID } from '@/util/global';
|
import { EMPTY_ID } from '@/util/global';
|
||||||
|
|
||||||
@@ -65,8 +60,7 @@ export default {
|
|||||||
},
|
},
|
||||||
nav: {
|
nav: {
|
||||||
loading: false,
|
loading: false,
|
||||||
apps: [],
|
content: [],
|
||||||
menus: [],
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
@@ -77,15 +71,14 @@ export default {
|
|||||||
|
|
||||||
this.nav.loading = true;
|
this.nav.loading = true;
|
||||||
|
|
||||||
this.$api.getLoginUser().then(({ data }) => {
|
this.$api.getLoginUser().then(async ({ data }) => {
|
||||||
// 去除应用和菜单信息,存储基本信息
|
// 去除应用和菜单信息,存储基本信息
|
||||||
const info = this.$_.cloneDeep(data);
|
const info = this.$_.cloneDeep(data);
|
||||||
delete info.apps;
|
delete info.apps;
|
||||||
delete info.menus;
|
delete info.menus;
|
||||||
setGlobal(info);
|
setGlobal(info);
|
||||||
|
|
||||||
data.apps.map((p) => (p.active = p.active));
|
this.nav.content = await this.onSetNav(data);
|
||||||
this.onSetNav(data);
|
|
||||||
this.nav.loading = false;
|
this.nav.loading = false;
|
||||||
|
|
||||||
this.$root.global.defaultWindow.map((options) => {
|
this.$root.global.defaultWindow.map((options) => {
|
||||||
@@ -206,37 +199,22 @@ export default {
|
|||||||
this.$refs.content.onLoadContentWindow(key);
|
this.$refs.content.onLoadContentWindow(key);
|
||||||
},
|
},
|
||||||
|
|
||||||
onChangeApp(app) {
|
|
||||||
this.nav.loading = true;
|
|
||||||
this.$api.sysMenuChange({ application: app.code }).then(({ data }) => {
|
|
||||||
this.nav.apps.map((p) => (p.active = p.code === app.code));
|
|
||||||
window.localStorage.removeItem(ACTIVE_APP_KEY);
|
|
||||||
this.onSetNav({
|
|
||||||
apps: this.nav.apps,
|
|
||||||
menus: data,
|
|
||||||
});
|
|
||||||
|
|
||||||
this.nav.loading = false;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
onSetNav(nav) {
|
onSetNav(nav) {
|
||||||
// 从本地存储获取当前选中的应用及菜单
|
const getNav = [];
|
||||||
this.nav.apps = nav.apps;
|
nav.apps.forEach((app) => {
|
||||||
const code = window.localStorage.getItem(ACTIVE_APP_KEY);
|
getNav.push({
|
||||||
if (code) {
|
app,
|
||||||
this.nav.apps.map((p) => (p.active = p.code === code.code));
|
});
|
||||||
this.onChangeApp({
|
});
|
||||||
code,
|
|
||||||
|
return this.$api
|
||||||
|
.$queue(getNav.map((p) => this.$api.sysMenuChangeAwait({ application: p.app.code })))
|
||||||
|
.then((menus) => {
|
||||||
|
menus.forEach((menu, i) => {
|
||||||
|
getNav[i].menu = this.serializeMenu(menu.data);
|
||||||
|
});
|
||||||
|
return getNav;
|
||||||
});
|
});
|
||||||
} else {
|
|
||||||
// 将默认选中菜单存储
|
|
||||||
const app = nav.apps.find((p) => p.active);
|
|
||||||
if (app) {
|
|
||||||
window.localStorage.setItem(ACTIVE_APP_KEY, app.code);
|
|
||||||
this.serializeMenu(nav.menus);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
|
||||||
serializeMenu(menus) {
|
serializeMenu(menus) {
|
||||||
@@ -252,7 +230,7 @@ export default {
|
|||||||
return m;
|
return m;
|
||||||
};
|
};
|
||||||
|
|
||||||
this.nav.menus = children[EMPTY_ID] ? serialize(children[EMPTY_ID]) : new Array();
|
return children[EMPTY_ID] ? serialize(children[EMPTY_ID]) : new Array();
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -2478,6 +2478,11 @@ cipher-base@^1.0.0, cipher-base@^1.0.1, cipher-base@^1.0.3:
|
|||||||
inherits "^2.0.1"
|
inherits "^2.0.1"
|
||||||
safe-buffer "^5.0.1"
|
safe-buffer "^5.0.1"
|
||||||
|
|
||||||
|
clamp@^1.0.1:
|
||||||
|
version "1.0.1"
|
||||||
|
resolved "https://registry.npm.taobao.org/clamp/download/clamp-1.0.1.tgz#66a0e64011816e37196828fdc8c8c147312c8634"
|
||||||
|
integrity sha1-ZqDmQBGBbjcZaCj9yMjBRzEshjQ=
|
||||||
|
|
||||||
class-utils@^0.3.5:
|
class-utils@^0.3.5:
|
||||||
version "0.3.6"
|
version "0.3.6"
|
||||||
resolved "https://registry.npm.taobao.org/class-utils/download/class-utils-0.3.6.tgz#f93369ae8b9a7ce02fd41faad0ca83033190c463"
|
resolved "https://registry.npm.taobao.org/class-utils/download/class-utils-0.3.6.tgz#f93369ae8b9a7ce02fd41faad0ca83033190c463"
|
||||||
@@ -5437,6 +5442,11 @@ lodash.memoize@^4.1.2:
|
|||||||
resolved "https://registry.npm.taobao.org/lodash.memoize/download/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
|
resolved "https://registry.npm.taobao.org/lodash.memoize/download/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
|
||||||
integrity sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=
|
integrity sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=
|
||||||
|
|
||||||
|
lodash.throttle@^4.0.0:
|
||||||
|
version "4.1.1"
|
||||||
|
resolved "https://registry.nlark.com/lodash.throttle/download/lodash.throttle-4.1.1.tgz#c23e91b710242ac70c37f1e1cda9274cc39bf2f4"
|
||||||
|
integrity sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ=
|
||||||
|
|
||||||
lodash.toarray@^4.4.0:
|
lodash.toarray@^4.4.0:
|
||||||
version "4.4.0"
|
version "4.4.0"
|
||||||
resolved "https://registry.npm.taobao.org/lodash.toarray/download/lodash.toarray-4.4.0.tgz#24c4bfcd6b2fba38bfd0594db1179d8e9b656561"
|
resolved "https://registry.npm.taobao.org/lodash.toarray/download/lodash.toarray-4.4.0.tgz#24c4bfcd6b2fba38bfd0594db1179d8e9b656561"
|
||||||
@@ -5523,6 +5533,11 @@ map-visit@^1.0.0:
|
|||||||
dependencies:
|
dependencies:
|
||||||
object-visit "^1.0.0"
|
object-visit "^1.0.0"
|
||||||
|
|
||||||
|
material-colors@^1.0.0:
|
||||||
|
version "1.2.6"
|
||||||
|
resolved "https://registry.npm.taobao.org/material-colors/download/material-colors-1.2.6.tgz#6d1958871126992ceecc72f4bcc4d8f010865f46"
|
||||||
|
integrity sha1-bRlYhxEmmSzuzHL0vMTY8BCGX0Y=
|
||||||
|
|
||||||
md5.js@^1.3.4:
|
md5.js@^1.3.4:
|
||||||
version "1.3.5"
|
version "1.3.5"
|
||||||
resolved "https://registry.npm.taobao.org/md5.js/download/md5.js-1.3.5.tgz#b5d07b8e3216e3e27cd728d72f70d1e6a342005f"
|
resolved "https://registry.npm.taobao.org/md5.js/download/md5.js-1.3.5.tgz#b5d07b8e3216e3e27cd728d72f70d1e6a342005f"
|
||||||
@@ -8105,7 +8120,7 @@ timsort@^0.3.0:
|
|||||||
resolved "https://registry.npm.taobao.org/timsort/download/timsort-0.3.0.tgz#405411a8e7e6339fe64db9a234de11dc31e02bd4"
|
resolved "https://registry.npm.taobao.org/timsort/download/timsort-0.3.0.tgz#405411a8e7e6339fe64db9a234de11dc31e02bd4"
|
||||||
integrity sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=
|
integrity sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=
|
||||||
|
|
||||||
tinycolor2@^1.4.1:
|
tinycolor2@^1.1.2, tinycolor2@^1.4.1:
|
||||||
version "1.4.2"
|
version "1.4.2"
|
||||||
resolved "https://registry.npm.taobao.org/tinycolor2/download/tinycolor2-1.4.2.tgz?cache=0&sync_timestamp=1601056395015&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ftinycolor2%2Fdownload%2Ftinycolor2-1.4.2.tgz#3f6a4d1071ad07676d7fa472e1fac40a719d8803"
|
resolved "https://registry.npm.taobao.org/tinycolor2/download/tinycolor2-1.4.2.tgz?cache=0&sync_timestamp=1601056395015&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ftinycolor2%2Fdownload%2Ftinycolor2-1.4.2.tgz#3f6a4d1071ad07676d7fa472e1fac40a719d8803"
|
||||||
integrity sha1-P2pNEHGtB2dtf6Ry4frECnGdiAM=
|
integrity sha1-P2pNEHGtB2dtf6Ry4frECnGdiAM=
|
||||||
@@ -8493,6 +8508,16 @@ vue-awesome-swiper@^4.1.1:
|
|||||||
resolved "https://registry.npm.taobao.org/vue-awesome-swiper/download/vue-awesome-swiper-4.1.1.tgz#8f7ab221ad003021d756b86aa618f429924900fe"
|
resolved "https://registry.npm.taobao.org/vue-awesome-swiper/download/vue-awesome-swiper-4.1.1.tgz#8f7ab221ad003021d756b86aa618f429924900fe"
|
||||||
integrity sha1-j3qyIa0AMCHXVrhqphj0KZJJAP4=
|
integrity sha1-j3qyIa0AMCHXVrhqphj0KZJJAP4=
|
||||||
|
|
||||||
|
vue-color@^2.8.1:
|
||||||
|
version "2.8.1"
|
||||||
|
resolved "https://registry.npm.taobao.org/vue-color/download/vue-color-2.8.1.tgz#a090f3dcf8ed6f07afdb865cac84b19a73302e70"
|
||||||
|
integrity sha1-oJDz3Pjtbwev24ZcrISxmnMwLnA=
|
||||||
|
dependencies:
|
||||||
|
clamp "^1.0.1"
|
||||||
|
lodash.throttle "^4.0.0"
|
||||||
|
material-colors "^1.0.0"
|
||||||
|
tinycolor2 "^1.1.2"
|
||||||
|
|
||||||
vue-eslint-parser@^7.0.0:
|
vue-eslint-parser@^7.0.0:
|
||||||
version "7.6.0"
|
version "7.6.0"
|
||||||
resolved "https://registry.npm.taobao.org/vue-eslint-parser/download/vue-eslint-parser-7.6.0.tgz#01ea1a2932f581ff244336565d712801f8f72561"
|
resolved "https://registry.npm.taobao.org/vue-eslint-parser/download/vue-eslint-parser-7.6.0.tgz#01ea1a2932f581ff244336565d712801f8f72561"
|
||||||
|
|||||||
Reference in New Issue
Block a user