This commit is contained in:
ky_gyt
2021-04-21 06:19:34 +00:00
parent 0d78cec16b
commit 30897c47df
8 changed files with 773 additions and 0 deletions

View File

@@ -0,0 +1,78 @@
<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() {
this.visible = true;
this.$nextTick(async () => {
await this.formBody.onInit();
});
},
/**
* 必要的方法
* 点击保存时的操作
*/
onOk() {
this.$refs['form-body'].onValidate((valid) => {
if (valid) {
this.confirmLoading = true;
this.$api
.sysConfigAdd(this.$refs['form-body'].form)
.then(({ success }) => {
this.confirmLoading = false;
if (success) {
this.$message.success('添加成功');
this.onCancel();
this.$emit('ok');
}
})
.finally(() => {
this.confirmLoading = false;
});
}
});
},
/**
* 必要的方法
* 关闭窗口时的操作
*/
onCancel() {
this.$refs['form-body'].onResetFields();
this.visible = false;
},
},
};
</script>

View File

@@ -0,0 +1,74 @@
<template>
<a-modal
:confirmLoading="confirmLoading"
:visible="visible"
@cancel="onCancel"
@ok="onOk"
title="编辑用户"
>
<FormBody ref="form-body" />
</a-modal>
</template>
<script>
import FormBody from './form';
export default {
components: {
FormBody,
},
data() {
return {
visible: false,
confirmLoading: false,
};
},
methods: {
/**
* 必要的方法
* 从外部调用打开本窗口,并填充外部传入的数据
*/
onOpen(record) {
this.visible = true;
this.$nextTick(async () => {
this.$refs['form-body'].onFillData(record);
});
},
/**
* 必要的方法
* 点击保存时的操作
*/
onOk() {
this.$refs['form-body'].onValidate((valid) => {
if (valid) {
this.confirmLoading = true;
this.$api
.sysConfigEdit(this.$refs['form-body'].form)
.then(({ success }) => {
if (success) {
this.$message.success('编辑成功');
this.onCancel();
this.$emit('ok');
}
})
.finally(() => {
this.confirmLoading = false;
});
}
});
},
/**
* 必要的方法
* 关闭窗口时的操作
*/
onCancel() {
this.$refs['form-body'].onResetFields();
this.visible = false;
},
},
};
</script>

View File

@@ -0,0 +1,114 @@
<template>
<a-form-model :model="form" :rules="rules" class="yo-form" ref="form">
<div class="yo-form-group">
<a-form-model-item label="角色名" prop="name">
<a-input placeholder="请输入角色名" v-model="form.name" />
</a-form-model-item>
<a-form-model-item label="唯一编码" prop="code" :disabled="editDisabled">
<a-input placeholder="请输入唯一编码" v-model="form.code" />
</a-form-model-item>
<a-form-model-item label="系统参数" prop="sysFlag">
<a-radio-group v-model="form.sysFlag" :disabled="editDisabled">
<a-radio-button value="Y">
<a-icon :style="{ color: '#1890ff' }" />
</a-radio-button>
<a-radio-button value="N">
<a-icon :style="{ color: '#eb2f96' }" />
</a-radio-button>
</a-radio-group>
</a-form-model-item>
<a-form-model-item label="所属分类" prop="groupCode">
<a-select placeholder="请选择所属分类" v-model="form.groupCode" :disabled="editDisabled">
<a-select-option
:key="i"
:value="item.code"
v-for="(item, i) in groupCode"
>{{ item.value }}</a-select-option>
</a-select>
</a-select>
</a-form-model-item>
<a-form-model-item label="参数值" prop="name">
<a-input placeholder="请输入参数值 " v-model="form.value" />
</a-form-model-item>
<a-form-model-item label="备注" prop="remark">
<a-input placeholder="请输入备注" v-model="form.remark" />
</a-form-model-item>
</div>
</a-form-model>
</template>
<script>
import moment from 'moment';
export default {
data() {
return {
editDisabled:false,
groupCode:[],
form: {
active: "N",
},
rules: {
name: [{ required: true, message: "请输入应用名称" }],
code: [{ required: true, message: "请输入唯一编码" }],
sysFlag: [{ required: true, message: "请选择参数类型" }],
groupCode: [{ required: true, message: "请选择所属分类" }],
value: [{ required: true, message: "请输入参数值" }],
},
};
},
methods: {
moment,
/**
* 必要的方法
* 在打开编辑页时允许填充数据
*/
onFillData(record) {
this.form = this.$_.cloneDeep(record);
if(record.sysFlag == 'Y')
{
this.editDisabled = true
}else
{
this.editDisabled = false
}
},
async onInit() {
this.loading = true;
this.groupCode = await this.onLoadgroupCodeData();
this.loading = false;
},
/**
* 必要的方法
* 在外部窗口进行保存时调用表单验证
*/
onValidate(callback) {
this.$refs.form.validate(callback);
},
/**
*
* 获取所属分类字典表的内容
*/
onLoadgroupCodeData() {
return this.$api.sysDictTypeDropDown({ code: 'consts_type' }).then(({ data }) => {
return data;
});
},
/**
* 必要的方法
* 在外部窗口关闭或重置时对表单验证进行初始化
*/
onResetFields() {
setTimeout(() => {
this.form = {};
this.$refs.form.resetFields();
}, 300);
},
},
};
</script>

View File

@@ -0,0 +1,146 @@
<template>
<container>
<br />
<a-card :bordered="false">
<Auth auth="sysConfig:page">
<div class="yo-query-bar">
<a-form-model :model="query" layout="inline">
<a-form-model-item label="参数名称">
<a-input placeholder="请输入参数名称" v-model="query.name" />
</a-form-model-item>
<a-form-model-item label="唯一编码">
<a-input placeholder="请输入唯一编码" v-model="query.code" />
</a-form-model-item>
<a-form-model-item>
<a-button-group>
<a-button @click="onQuery" type="primary">查询</a-button>
<a-button @click="() => {(query = {}), onQuery();}">重置</a-button>
</a-button-group>
</a-form-model-item>
</a-form-model>
</div>
</Auth>
<yo-table :columns="columns" :load-data="loadData" ref="table">
<Auth auth="sysConfig:add" slot="operator">
<a-button @click="onOpen('add-form')" icon="plus">新增职位</a-button>
</Auth>
<span slot="action" slot-scope="text, record">
<yo-table-actions>
<Auth auth="sysConfig:edit">
<a @click="onOpen('edit-form', record)">编辑</a>
</Auth>
<Auth auth="sysConfig:delete">
<a-popconfirm @confirm="onDelete(record)" placement="topRight" title="是否确认删除">
<a>删除</a>
</a-popconfirm>
</Auth>
</yo-table-actions>
</span>
</yo-table>
</a-card>
<br />
<edit-form @ok="onReloadData" ref="edit-form" />
<add-form @ok="onReloadData" ref="add-form" />
</container>
</template>
<script>
import AddForm from './addForm';
import editForm from './editForm';
export default {
components: {
AddForm,
editForm,
},
data() {
return {
query: {},
columns: [
{
title: '参数名称',
dataIndex: 'name',
},
{
title: '唯一编码',
dataIndex: 'code',
},
{
title: '参数值',
dataIndex: 'value',
},
{
title: '所属分类',
dataIndex: 'groupCode',
},
{
title: '备注',
dataIndex: 'remark',
},
{
title: '操作',
width: '200px',
dataIndex: 'action',
scopedSlots: {
customRender: 'action',
},
},
],
};
},
created() {},
methods: {
/**
* 必要的方法
* 传给yo-table以示意数据接口及其参数和返回的数据结构
*/
loadData(params) {
return this.$api
.sysConfigPage({
...params,
...this.query,
})
.then((res) => {
return res.data;
});
},
/**
* 有查询功能时的必要方法
* 加载数据时初始化分页信息
*/
onQuery() {
this.$refs.table.onReloadData(true);
},
/**
* 必要方法
* 重新列表数据
*/
onReloadData() {
this.$refs.table.onReloadData();
},
/**
* 有编辑新增功能的必要方法
* 从列表页调用窗口的打开方法
*/
onOpen(formName, record) {
this.$refs[formName].onOpen(record);
},
onResult(success, successMessage) {
if (success) {
this.$message.success(successMessage);
this.onReloadData();
}
this.$refs.table.onLoaded();
},
onDelete(record) {
this.$refs.table.onLoading();
this.$api.sysConfigDelete(record).then(({ success, message }) => {
this.onResult(success, '删除成功');
});
},
},
};
</script>

View File

@@ -0,0 +1,74 @@
<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,
};
},
methods: {
/**
* 必要的方法
* 从外部调用打开本窗口,并填充外部传入的数据
*/
onOpen() {
this.visible = true;
// this.$nextTick(() => {
// this.$refs['form-body'].onFillData(record);
// });
},
/**
* 必要的方法
* 点击保存时的操作
*/
onOk() {
this.$refs['form-body'].onValidate((valid) => {
if (valid) {
this.confirmLoading = true;
this.$api
.sysPosAdd(this.$refs['form-body'].form)
.then(({ success }) => {
this.confirmLoading = false;
if (success) {
this.$message.success('编辑成功');
this.onCancel();
this.$emit('ok');
}
})
.finally(() => {
this.confirmLoading = false;
});
}
});
},
/**
* 必要的方法
* 关闭窗口时的操作
*/
onCancel() {
this.$refs['form-body'].onResetFields();
this.visible = false;
},
},
};
</script>

View File

@@ -0,0 +1,74 @@
<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,
};
},
methods: {
/**
* 必要的方法
* 从外部调用打开本窗口,并填充外部传入的数据
*/
onOpen(record) {
this.visible = true;
this.$nextTick(() => {
this.$refs['form-body'].onFillData(record);
});
},
/**
* 必要的方法
* 点击保存时的操作
*/
onOk() {
this.$refs['form-body'].onValidate((valid) => {
if (valid) {
this.confirmLoading = true;
this.$api
.sysPosEdit(this.$refs['form-body'].form)
.then(({ success }) => {
this.confirmLoading = false;
if (success) {
this.$message.success('编辑成功');
this.onCancel();
this.$emit('ok');
}
})
.finally(() => {
this.confirmLoading = false;
});
}
});
},
/**
* 必要的方法
* 关闭窗口时的操作
*/
onCancel() {
this.$refs['form-body'].onResetFields();
this.visible = false;
},
},
};
</script>

View File

@@ -0,0 +1,70 @@
<template>
<a-form-model :model="form" :rules="rules" class="yo-form" ref="form">
<div class="yo-form-group">
<a-form-model-item label="职位名称" prop="name">
<a-input placeholder="请输入职位名称" v-model="form.name" />
</a-form-model-item>
<a-form-model-item label="唯一编码" prop="code">
<a-input placeholder="请输入唯一编码" v-model="form.code" />
</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>
<a-form-model-item
label="备注"
prop="remark"
>
<a-textarea v-model="form.remark" :rows="4" placeholder="请输入备注"></a-textarea>
</a-form-model-item>
</div>
</a-form-model>
</template>
<script>
export default {
data() {
return {
form: {
active: 'N',
},
rules: {
name: [{ required: true, message: '请输入应用名称' }],
code: [{ required: true, message: '请输入唯一编码' }],
},
};
},
methods: {
/**
* 必要的方法
* 在打开编辑页时允许填充数据
*/
onFillData(record) {
this.form = this.$_.cloneDeep(record);
},
/**
* 必要的方法
* 在外部窗口进行保存时调用表单验证
*/
onValidate(callback) {
this.$refs.form.validate(callback);
},
/**
* 必要的方法
* 在外部窗口关闭或重置时对表单验证进行初始化
*/
onResetFields() {
setTimeout(() => {
this.form = {};
this.$refs.form.resetFields();
}, 300);
},
},
};
</script>

View File

@@ -0,0 +1,143 @@
<template>
<container>
<br />
<a-card :bordered="false">
<Auth auth="sysPos:page">
<div class="yo-query-bar">
<a-form-model :model="query" layout="inline">
<a-form-model-item label="职位名称">
<a-input placeholder="请输入职位名称" v-model="query.name" />
</a-form-model-item>
<a-form-model-item label="唯一编码">
<a-input placeholder="请输入唯一编码" v-model="query.code" />
</a-form-model-item>
<a-form-model-item>
<a-button-group>
<a-button @click="onQuery" type="primary">查询</a-button>
<a-button @click="() => {(query = {}), onQuery();}">重置</a-button>
</a-button-group>
</a-form-model-item>
</a-form-model>
</div>
</Auth>
<yo-table :columns="columns" :load-data="loadData" ref="table">
<Auth auth="sysPos:add" slot="operator">
<a-button @click="onOpen('add-form')" icon="plus">新增职位</a-button>
</Auth>
<span slot="action" slot-scope="text, record">
<yo-table-actions>
<Auth auth="sysPos:edit">
<a @click="onOpen('edit-form', record)">编辑</a>
</Auth>
<Auth auth="sysPos:delete">
<a-popconfirm @confirm="onDelete(record)" placement="topRight" title="是否确认删除">
<a>删除</a>
</a-popconfirm>
</Auth>
</yo-table-actions>
</span>
</yo-table>
</a-card>
<br />
<edit-form @ok="onReloadData" ref="edit-form" />
<add-form @ok="onReloadData" ref="add-form" />
</container>
</template>
<script>
import AddForm from './addForm';
import editForm from './editForm';
export default {
components: {
AddForm,
editForm,
},
data() {
return {
query: {},
columns: [
{
title: '职位名称',
dataIndex: 'name',
},
{
title: '唯一编码',
dataIndex: 'code',
},
{
title: '排序',
dataIndex: 'sort',
},
{
title: '备注',
dataIndex: 'remark',
},
{
title: '操作',
width: '200px',
dataIndex: 'action',
scopedSlots: {
customRender: 'action',
},
},
],
};
},
created() {},
methods: {
/**
* 必要的方法
* 传给yo-table以示意数据接口及其参数和返回的数据结构
*/
loadData(params) {
return this.$api
.sysPosPage({
...params,
...this.query,
})
.then((res) => {
return res.data;
});
},
/**
* 有查询功能时的必要方法
* 加载数据时初始化分页信息
*/
onQuery() {
this.$refs.table.onReloadData(true);
},
/**
* 必要方法
* 重新列表数据
*/
onReloadData() {
this.$refs.table.onReloadData();
},
/**
* 有编辑新增功能的必要方法
* 从列表页调用窗口的打开方法
*/
onOpen(formName, record) {
this.$refs[formName].onOpen(record);
},
onResult(success, successMessage) {
if (success) {
this.$message.success(successMessage);
this.onReloadData();
}
this.$refs.table.onLoaded();
},
onDelete(record) {
this.$refs.table.onLoading();
this.$api.sysPosDelete(record).then(({ success, message }) => {
this.onResult(success, '删除成功');
});
},
},
};
</script>