LK/income_payments_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

表格tooltip 字段修改统一

Browse Source
This commit is contained in:
fengachen
2021-08-24 14:09:28 +08:00
parent b237c799c0
commit 246a3010d8
13 changed files with 348 additions and 550 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+1 -1
View File
@@ -1,4 +1,4 @@
# aikesheng-qc-administration
# income_payments_client
## Project setup
```
package-lock.json
Generated
+1 -1
View File
@@ -1,5 +1,5 @@
{
"name": "aikesheng-qc-administration",
"name": "income_payments_client",
"version": "0.1.0",
"lockfileVersion": 1,
"requires": true,
package.json
+1 -1
View File
@@ -1,5 +1,5 @@
{
"name": "aikesheng-qc-administration",
"name": "income_payments_client",
"version": "0.1.0",
"private": true,
"scripts": {
src/components/jero/JFormContainer.vue
+50 -42
View File
@@ -11,51 +11,59 @@
</template>
<script>
/**
* 使用方法
* 在form下直接写这个组件就行了，
*<a-form layout="inline" :form="form" >
* <j-form-container :disabled="true">
* <!-- 表单内容省略..... -->
* </j-form-container>
*</a-form>
*/
export default {
name: 'JFormContainer',
props:{
disabled:{
type:Boolean,
default:false,
required:false
}
},
mounted(){
console.log("我是表单禁用专用组件,但是我并不支持表单中iframe的内容禁用")
/**
* 使用方法
* 在form下直接写这个组件就行了，
*<a-form layout="inline" :form="form" >
* <j-form-container :disabled="true">
* <!-- 表单内容省略..... -->
* </j-form-container>
*</a-form>
*/
export default {
name: 'JFormContainer',
props: {
disabled: {
type: Boolean,
default: false,
required: false
}
},
mounted() {
console.log("我是表单禁用专用组件,但是我并不支持表单中iframe的内容禁用")
}
}
</script>
<style>
.jero-form-container-disabled{
cursor: not-allowed;
}
.jero-form-container-disabled fieldset[disabled] {
-ms-pointer-events: none;
pointer-events: none;
}
.jero-form-container-disabled .ant-select{
-ms-pointer-events: none;
pointer-events: none;
}
.jero-form-container-disabled {
cursor: not-allowed;
}
.jero-form-container-disabled .ant-upload-select{display:none}
.jero-form-container-disabled .ant-upload-list{cursor:grabbing}
.jero-form-container-disabled fieldset[disabled] .ant-upload-list{
-ms-pointer-events: auto !important;
pointer-events: auto !important;
}
.jero-form-container-disabled fieldset[disabled] {
-ms-pointer-events: none;
pointer-events: none;
}
.jero-form-container-disabled .ant-upload-list-item-actions .anticon-delete,
.jero-form-container-disabled .ant-upload-list-item .anticon-close{
display: none;
}
</style>
.jero-form-container-disabled .ant-select {
-ms-pointer-events: none;
pointer-events: none;
}
.jero-form-container-disabled .ant-upload-select {
display: none
}
.jero-form-container-disabled .ant-upload-list {
cursor: grabbing
}
.jero-form-container-disabled fieldset[disabled] .ant-upload-list {
-ms-pointer-events: auto !important;
pointer-events: auto !important;
}
.jero-form-container-disabled .ant-upload-list-item-actions .anticon-delete,
.jero-form-container-disabled .ant-upload-list-item .anticon-close {
display: none;
}
</style>
src/views/system/ConfusionList.vue
+14 -6
View File
@@ -32,7 +32,7 @@
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
<a-button @click="handleAdd" type="primary" icon="plus">添加</a-button>
<a-button type="primary" icon="download" @click="handleExportXls('混淆表')">导出</a-button>
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
<a-button type="primary" icon="import">导入</a-button>
@@ -85,7 +85,10 @@
下载
</a-button>
</template>
<template slot="text" slot-scope="text">
<j-ellipsis v-if="text" :value="text" :length="20"></j-ellipsis>
<span v-else></span>
</template>
<span slot="action" slot-scope="text, record" class="action-span-cell">
<a @click="handleEdit(record)">编辑</a>
<a @click="handleDelete(record.id)">删除</a>
@@ -104,12 +107,14 @@
import { mixinDevice } from '@/utils/mixin'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import SysConfusionModal from './modules/SysConfusionModal'
import JEllipsis from "@comp/jero/JEllipsis";
export default {
name: 'SysConfusionList',
mixins:[JeroListMixin, mixinDevice],
components: {
SysConfusionModal
SysConfusionModal,
JEllipsis
},
data () {
return {
@@ -129,17 +134,20 @@
{
title:'表名',
align:"center",
dataIndex: 'tableName'
dataIndex: 'tableName',
scopedSlots: { customRender: 'text' }
},
{
title:'字段名',
align:"center",
dataIndex: 'fieldName'
dataIndex: 'fieldName',
scopedSlots: { customRender: 'text' }
},
{
title:'混淆码',
align:"center",
dataIndex: 'confusionCode'
dataIndex: 'confusionCode',
scopedSlots: { customRender: 'text' }
},
{
title: '操作',
src/views/system/DepartList.vue
+2
View File
@@ -467,6 +467,8 @@ export default {
this.currSelected = {}
this.form.resetFields()
this.selectedKeys = []
//取消选择 清除选中部门id
this.$refs.DeptUserInfo.cancelSelect()
// 暂时注释(部门权限组件)没用 2021-08-24
// this.$refs.departAuth.departId = ''
},
src/views/system/QuartzJobList.vue
+1 -1
View File
@@ -34,7 +34,7 @@
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
<a-button @click="handleAdd" type="primary" icon="plus">添加</a-button>
<a-button type="primary" icon="download" @click="handleExportXls('定时任务信息')">导出</a-button>
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"
@change="handleImportExcel">
src/views/system/RoleUserList.vue
+26 -241
View File
@@ -21,7 +21,7 @@
</div>
<!-- 操作按钮区域 -->
<div class="table-operator" style="margin: 5px 0 10px 2px">
<a-button @click="handleAdd" type="primary" icon="plus" v-has="'sys:role:add'">新建角色</a-button>
<a-button @click="handleAdd" type="primary" icon="plus" v-has="'sys:role:add'">添加角色</a-button>
<a-button @click="batchDel" type="danger" icon="delete">批量删除</a-button>
</div>
<div style="margin-top: 15px">
@@ -36,12 +36,18 @@
:pagination="ipagination"
:loading="loading"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
:expandedRowKeys="expandedRowKeys"
@expandedRowsChange="handleExpandedRowsChange"
@change="handleTableChange">
<span slot="action" class="action-span-cell" slot-scope="text, record">
<a @click="handlePerssion(record.id)">授权</a>
<a @click="handleEdit(record)" v-has="'sys:role:edit'">编辑</a>
<a @click="handleDelete1(record.id)" v-has="'sys:role:del'">删除</a>
<a @click="handleDelete(record.id)" v-has="'sys:role:del'">删除</a>
</span>
<template slot-scope="text" slot="text">
<j-ellipsis v-if="text" :length="20" :value="text"></j-ellipsis>
<span v-else></span>
</template>
</a-table>
</div>
@@ -51,10 +57,11 @@
</template>
<script>
import { JeroListMixin } from "@/mixins/JeroListMixin";
import { deleteAction, postAction, getAction } from "@/api/manage";
import {postAction, getAction } from "@/api/manage";
import RoleModal from "./modules/RoleModal";
import { filterObj } from "@/utils/util";
import UserRoleModal from "./modules/UserRoleModal";
import JEllipsis from "@comp/jero/JEllipsis";
import moment from "moment";
export default {
@@ -63,6 +70,7 @@ export default {
components: {
UserRoleModal,
RoleModal,
JEllipsis,
moment
},
data() {
@@ -70,70 +78,30 @@ export default {
model1: {},
model2: {},
currentRoleId: "",
queryParam1: {},
queryParam2: {},
dataSource1: [],
dataSource2: [],
selectedRowKeys: [],
ipagination1: {
current: 1,
pageSize: 10,
pageSizeOptions: ["10", "20", "30"],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条";
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
ipagination2: {
current: 1,
pageSize: 10,
pageSizeOptions: ["10", "20", "30"],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条";
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
isorter1: {
column: "createTime",
order: "desc"
},
isorter2: {
column: "createTime",
order: "desc"
},
filters1: {},
filters2: {},
loading1: false,
loading2: false,
selectedRowKeys1: [],
selectedRowKeys2: [],
selectionRows1: [],
selectionRows2: [],
test: {},
rightcolval: 0,
expandedRowKeys:[],
columns:
[
{
title: "角色编码",
align: "center",
dataIndex: "roleCode"
dataIndex: "roleCode",
scopedSlots: {customRender: 'text'}
},
{
title: "角色名称",
align: "center",
dataIndex: "roleName"
dataIndex: "roleName",
scopedSlots: {customRender: 'text'}
},
{
title: "创建时间",
dataIndex: "createTime",
align: "center",
sorter: true,
scopedSlots: {customRender: 'text'},
customRender: (text) => {
return moment(text).format("YYYY-MM-DD");
return moment(text).format("YYYY-MM-DD HH:mm:ss");
}
},
{
@@ -143,37 +111,6 @@ export default {
scopedSlots: { customRender: "action" }
}
],
columns2: [{
title: "用户账号",
align: "center",
dataIndex: "username",
width: 120
},
{
title: "用户名称",
align: "center",
width: 100,
dataIndex: "realname"
},
{
title: "状态",
align: "center",
width: 80,
dataIndex: "status_dictText"
},
{
title: "操作",
dataIndex: "action",
scopedSlots: { customRender: "action" },
align: "center",
width: 120
}],
// 高级查询参数
superQueryParams2: "",
// 高级查询拼接条件
superQueryMatchType2: "and",
url: {
list: "/sys/role/page",
delete: "/sys/role/delete",
@@ -190,157 +127,13 @@ export default {
computed: {
importExcelUrl: function() {
return `${window._CONFIG["domianURL"]}/${this.url.importExcelUrl}`;
},
leftColMd() {
return this.selectedRowKeys1.length === 0 ? 24 : 12;
},
rightColMd() {
return this.selectedRowKeys1.length === 0 ? 0 : 12;
}
},
methods: {
onSelectChange2(selectedRowKeys, selectionRows) {
this.selectedRowKeys2 = selectedRowKeys;
this.selectionRows2 = selectionRows;
},
onClearSelected2() {
this.selectedRowKeys2 = [];
this.selectionRows2 = [];
},
onClearSelected1() {
onClearSelected() {
this.selectedRowKeys1 = [];
this.selectionRows1 = [];
},
onSelectChange1(selectedRowKeys, selectionRows) {
this.rightcolval = 1;
this.selectedRowKeys1 = selectedRowKeys;
this.selectionRows1 = selectionRows;
this.model1 = Object.assign({}, selectionRows[0]);
console.log(this.model1);
this.currentRoleId = selectedRowKeys[0];
this.loadData2();
},
onClearSelected() {
},
getQueryParams2() {
//获取查询条件
let sqp = {};
if (this.superQueryParams2) {
sqp["superQueryParams"] = encodeURI(this.superQueryParams2);
sqp["superQueryMatchType"] = this.superQueryMatchType2;
}
var param = Object.assign(sqp, this.queryParam2, this.isorter2, this.filters2);
param.field = this.getQueryField2();
param.pageNo = this.ipagination2.current;
param.pageSize = this.ipagination2.pageSize;
return filterObj(param);
},
getQueryField2() {
//TODO 字段权限控制
var str = "id,";
this.columns2.forEach(function(value) {
str += "," + value.dataIndex;
});
return str;
},
handleEdit2: function(record) {
this.$refs.modalForm2.title = "编辑";
this.$refs.modalForm2.roleDisabled = true;
this.$refs.modalForm2.edit(record);
},
handleAdd2: function() {
if (this.currentRoleId == "") {
this.$message.error("请选择一个角色!");
} else {
this.$refs.modalForm2.roleDisabled = true;
this.$refs.modalForm2.selectedRole = [this.currentRoleId];
this.$refs.modalForm2.add();
this.$refs.modalForm2.title = "新增";
}
},
modalFormOk2() {
// 新增/修改 成功时，重载列表
this.loadData2();
},
loadData2(arg) {
if (!this.url.list2) {
this.$message.error("请设置url.list2属性!");
return;
}
//加载数据 若传入参数1则加载第一页的内容
if (arg === 1) {
this.ipagination2.current = 1;
}
if (this.currentRoleId === "") return;
let params = this.getQueryParams2();//查询条件
params.roleId = this.currentRoleId;
this.loading2 = true;
getAction(this.url.list2, params).then((res) => {
if (res.success) {
this.dataSource2 = res.result.records;
this.ipagination2.total = res.result.total;
}
this.loading2 = false;
});
},
handleDelete1: function(id) {
this.handleDelete(id);
this.dataSource2 = [];
this.currentRoleId = "";
},
handleDelete2: function(id) {
if (!this.url.delete2) {
this.$message.error("请设置url.delete2属性!");
return;
}
var that = this;
deleteAction(that.url.delete2, { roleId: this.currentRoleId, userId: id }).then((res) => {
if (res.success) {
that.$message.success(res.message);
that.loadData2();
} else {
that.$message.warning(res.message);
}
});
},
batchDel2: function() {
if (!this.url.deleteBatch2) {
this.$message.error("请设置url.deleteBatch2属性!");
return;
}
if (this.selectedRowKeys2.length <= 0) {
this.$message.warning("请选择一条记录！");
return;
} else {
var ids = "";
for (var a = 0; a < this.selectedRowKeys2.length; a++) {
ids += this.selectedRowKeys2[a] + ",";
}
var that = this;
console.log(this.currentDeptId);
this.$confirm({
title: "确认删除",
content: "是否删除选中数据?",
onOk: function() {
deleteAction(that.url.deleteBatch2, { roleId: that.currentRoleId, userIds: ids }).then((res) => {
if (res.success) {
that.$message.success(res.message);
that.loadData2();
that.onClearSelected();
} else {
that.$message.warning(res.message);
}
});
}
});
}
},
selectOK(data) {
let params = {};
params.roleId = this.currentRoleId;
@@ -381,23 +174,15 @@ export default {
this.queryParam2 = {};
this.loadData2(1);
},
handleTableChange2(pagination, filters, sorter) {
//分页、排序、筛选变化时触发
//TODO 筛选
if (Object.keys(sorter).length > 0) {
this.isorter2.column = sorter.field;
this.isorter2.order = "ascend" == sorter.order ? "asc" : "desc";
}
this.ipagination2 = pagination;
this.loadData2();
},
hideUserList() {
//this.rightcolval = 0
this.selectedRowKeys1 = [];
},
/*
* 授权
* */
handlePerssion(roleId) {
this.$refs.modalUserRole.show(roleId);
}
},
handleExpandedRowsChange(expandedRows) {
this.expandedRowKeys = expandedRows
},
}
};
</script>
src/views/system/UserList.vue
+19 -10
View File
@@ -46,7 +46,10 @@
<a @click="handleEdit(record)" v-has="'user:edit'">编辑</a>
<a @click="handleDelete(record.id)" v-has="'sys:user:del'">删除</a>
</span>
<template slot="text" slot-scope="text">
<j-ellipsis v-if="text" :length="20" :value="text"></j-ellipsis>
<span v-else></span>
</template>
</a-table>
</div>
@@ -59,17 +62,18 @@
<script>
import UserModal from "./modules/UserModal";
import { putAction, getFileAccessHttpUrl } from "@/api/manage";
import { frozenBatch } from "@/api/api";
import { getFileAccessHttpUrl } from "@/api/manage";
import { JeroListMixin } from "@/mixins/JeroListMixin";
import JInput from "@/components/jero/JInput";
import JEllipsis from "@comp/jero/JEllipsis";
export default {
name: "UserList",
mixins: [JeroListMixin],
components: {
UserModal,
JInput
JInput,
JEllipsis
},
data() {
return {
@@ -89,32 +93,36 @@ export default {
title: "用户账号",
align: "center",
dataIndex: "username",
width: 120
width: 120,
scopedSlots: { customRender: "text" },
},
{
title: "用户姓名",
align: "center",
width: 100,
dataIndex: "realname"
dataIndex: "realname",
scopedSlots: { customRender: "text" },
},
{
title: "性别",
align: "center",
width: 80,
dataIndex: "sex_dictText",
sorter: true
scopedSlots: { customRender: "text" },
},
{
title: "手机号码",
align: "center",
width: 100,
dataIndex: "phone"
dataIndex: "phone",
scopedSlots: { customRender: "text" },
},
{
title: "部门",
align: "center",
width: 180,
dataIndex: "orgCodeTxt"
dataIndex: "orgCodeTxt",
scopedSlots: { customRender: "text" },
},
// {
// title: '生日',
@@ -132,7 +140,8 @@ export default {
title: "状态",
align: "center",
width: 80,
dataIndex: "status_dictText"
dataIndex: "status_dictText",
scopedSlots: { customRender: "text" },
},
{
title: "操作",
src/views/system/modules/DeptUserInfo.vue
+8 -22
View File
@@ -29,29 +29,11 @@
<!--<a-button @click="handleEdit" type="primary" icon="edit" style="margin-top: 16px">用户编辑</a-button>-->
<a-button @click="handleAddUserDepart" type="primary" icon="plus">添加已有用户</a-button>
<a-button @click="handleAdd" type="primary" icon="plus" style="margin-top: 16px">添加用户</a-button>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel">
<a-icon type="delete"/>
取消关联
</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
<a-button @click="batchDel" type="danger" icon="delete" style="margin-top: 16px">批量取消关联</a-button>
</div>
<!-- table区域-begin -->
<div>
<!-- <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">-->
<!-- <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{-->
<!-- selectedRowKeys.length-->
<!-- }}</a>项-->
<!-- <a style="margin-left: 24px" @click="onClearSelected">清空</a>-->
<!-- </div>-->
<a-table
ref="table"
size="middle"
@@ -77,7 +59,7 @@
<template slot="text_title" slot-scope="text">
<j-ellipsis :length="20" :value="text"></j-ellipsis>
</template>
</template>currentDeptId
</a-table>
</div>
<!-- table区域-end -->
@@ -192,11 +174,11 @@ export default {
batchDel: function () {
if (!this.url.deleteBatch) {
this.$message.error("请设置url.deleteBatch属性!")
this.$message.warn("请设置url.deleteBatch属性!")
return
}
if (!this.currentDeptId) {
this.$message.error("未选中任何部门，无法取消部门与用户的关联!")
this.$message.warn("未选中任何部门，无法取消部门与用户的关联!")
return
}
@@ -278,6 +260,10 @@ export default {
this.currentDept = record;
this.loadData(1);
},
cancelSelect(){
this.currentDeptId = ''
this.loadData(1)
},
clearList() {
this.currentDeptId = '';
this.dataSource = [];
src/views/system/modules/SelectUserModal.vue
+20 -28
View File
@@ -39,11 +39,15 @@
:columns="columns1"
:dataSource="dataSource1"
:pagination="ipagination"
class="j-table-force-nowrap"
:loading="loading"
:scroll="{ y: 240 }"
:rowSelection="{selectedRowKeys: selectedRowKeys,onSelectAll:onSelectAll,onSelect:onSelect,onChange: onSelectChange}"
@change="handleTableChange">
<template slot="text" slot-scope="text">
<j-ellipsise v-if="text" :length="15" :value="text"></j-ellipsise>
<span v-else></span>
</template>
</a-table>
</div>
<!-- table区域-end -->
@@ -56,9 +60,12 @@
<script>
import {filterObj} from '@/utils/util'
import {getAction} from '@/api/manage'
import JEllipsise from "@comp/jero/JEllipsis";
import "@/assets/less/TableExpand.less";
export default {
name: "SelectUserModal",
components:{JEllipsise},
data() {
return {
title: "添加已有用户",
@@ -85,52 +92,37 @@
{
title: '用户账号',
align: "center",
width: 100,
dataIndex: 'username'
width: 120,
dataIndex: 'username',
scopedSlots:{customRender:'text'}
},
{
title: '用户名称',
align: "center",
width: 100,
dataIndex: 'realname'
width: 120,
dataIndex: 'realname',
scopedSlots:{customRender:'text'}
},
{
title: '性别',
align: "center",
width: 100,
dataIndex: 'sex_dictText'
dataIndex: 'sex_dictText',
scopedSlots:{customRender:'text'}
},
{
title: '电话',
align: "center",
width: 100,
dataIndex: 'phone'
dataIndex: 'phone',
scopedSlots:{customRender:'text'}
},
{
title: '部门',
align: "center",
width: 150,
dataIndex: 'orgCode'
}
],
columns2: [
{
title: '用户账号',
align: "center",
dataIndex: 'username',
},
{
title: '用户名称',
align: "center",
dataIndex: 'realname',
},
{
title: '操作',
dataIndex: 'action',
align: "center",
width: 100,
scopedSlots: {customRender: 'action'},
dataIndex: 'orgCode',
scopedSlots:{customRender:'text'}
}
],
//数据集
src/views/system/modules/SysConfusionForm.vue
+156 -149
View File
@@ -5,19 +5,22 @@
<a-row>
<a-col :span="24">
<a-form-item label="表名" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input :maxLength="50" @change="e => {e.target.value = (e.target.value + '').trim()}" v-decorator="['tableName', validatorRules.tableName]" placeholder="请输入表名" ></a-input>
<a-input :maxLength="50" @change="e => {e.target.value = (e.target.value + '').trim()}"
v-decorator="['tableName', validatorRules.tableName]" placeholder="请输入表名"></a-input>
</a-form-item>
</a-col>
<a-col :span="24">
<!-- maxLength 之前是120-->
<!-- maxLength 之前是120-->
<a-form-item label="字段名" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input :maxLength="50" @change="e => {e.target.value = (e.target.value + '').trim()}" v-decorator="['fieldName',validatorRules.fieldName]" placeholder="请输入字段名" ></a-input>
<a-input :maxLength="50" @change="e => {e.target.value = (e.target.value + '').trim()}"
v-decorator="['fieldName',validatorRules.fieldName]" placeholder="请输入字段名"></a-input>
</a-form-item>
</a-col>
<a-col :span="24">
<!-- maxLength 之前是120-->
<a-form-item label="混淆码" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input :maxLength="50" @change="e => {e.target.value = (e.target.value + '').trim()}" v-decorator="['confusionCode',validatorRules.confusionCode]" placeholder="请输入混淆码" ></a-input>
<a-input :maxLength="50" @change="e => {e.target.value = (e.target.value + '').trim()}"
v-decorator="['confusionCode',validatorRules.confusionCode]" placeholder="请输入混淆码"></a-input>
</a-form-item>
</a-col>
<a-col v-if="showFlowSubmitButton" :span="24" style="text-align: center">
@@ -31,167 +34,171 @@
<script>
import { httpAction, getAction } from '@/api/manage'
import pick from 'lodash.pick'
import { validateDuplicateValue } from '@/utils/util'
import {httpAction, getAction} from '@/api/manage'
import pick from 'lodash.pick'
import {validateDuplicateValue} from '@/utils/util'
import JFormContainer from "@comp/jero/JFormContainer";
export default {
name: 'SysConfusionForm',
components: {
},
props: {
//流程表单data
formData: {
type: Object,
default: ()=>{},
required: false
export default {
name: 'SysConfusionForm',
components: {JFormContainer},
props: {
//流程表单data
formData: {
type: Object,
default: () => {
},
//表单模式：true流程表单 false普通表单
formBpm: {
type: Boolean,
default: false,
required: false
},
//表单禁用
disabled: {
type: Boolean,
default: false,
required: false
}
required: false
},
data () {
return {
form: this.$form.createForm(this),
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 5 },
//表单模式：true流程表单 false普通表单
formBpm: {
type: Boolean,
default: false,
required: false
},
//表单禁用
disabled: {
type: Boolean,
default: false,
required: false
}
},
data() {
return {
form: this.$form.createForm(this),
model: {},
labelCol: {
xs: {span: 24},
sm: {span: 5},
},
wrapperCol: {
xs: {span: 24},
sm: {span: 16},
},
confirmLoading: false,
validatorRules: {
tableName: {
rules: [{
required: true, message: '请输入表名!'
}],
validateTrigger: 'blur'
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 },
fieldName: {
rules: [{
required: true,
message: '请输入字段名！'
}],
validateTrigger: 'blur'
},
confirmLoading: false,
validatorRules: {
tableName: {
rules: [{
required: true, message: '请输入表名!'
}],
validateTrigger: 'blur'
},
fieldName: {
rules: [{
required: true,
message: '请输入字段名！'
}],
validateTrigger: 'blur'
},
confusionCode: {
rules: [{
required: true, message: '请输入混淆码!',
}],
validateTrigger: 'blur'
},
realname: {rules: [{required: true, message: '请输入用户名称!'}], validateTrigger: 'blur'},
phone: {rules: [{required: true, message: '请输入手机号!'},{validator: this.validatePhone}], validateTrigger: 'blur'},
email: {
rules: [{
required: true,
message: '请输入邮箱!'
},{ validator: this.validateEmail}],
validateTrigger: 'blur'
},
roles: {},
// sex:{initialValue:((!this.model.sex)?"": (this.model.sex+""))}
confusionCode: {
rules: [{
required: true, message: '请输入混淆码!',
}],
validateTrigger: 'blur'
},
url: {
add: "/sys/confusion/add",
edit: "/sys/confusion/edit",
queryById: "/sys/confusion/queryById"
realname: {rules: [{required: true, message: '请输入用户名称!'}], validateTrigger: 'blur'},
phone: {
rules: [{required: true, message: '请输入手机号!'}, {validator: this.validatePhone}],
validateTrigger: 'blur'
},
email: {
rules: [{
required: true,
message: '请输入邮箱!'
}, {validator: this.validateEmail}],
validateTrigger: 'blur'
},
roles: {},
// sex:{initialValue:((!this.model.sex)?"": (this.model.sex+""))}
},
url: {
add: "/sys/confusion/add",
edit: "/sys/confusion/edit",
queryById: "/sys/confusion/queryById"
},
}
},
computed: {
formDisabled() {
if (this.formBpm === true) {
if (this.formData.disabled === false) {
return false
}
return true
}
return this.disabled
},
computed: {
formDisabled(){
if(this.formBpm===true){
if(this.formData.disabled===false){
return false
}
showFlowSubmitButton() {
if (this.formBpm === true) {
if (this.formData.disabled === false) {
return true
}
return this.disabled
},
showFlowSubmitButton(){
if(this.formBpm===true){
if(this.formData.disabled===false){
return true
}
return false
}
},
created() {
//如果是流程中表单，则需要加载流程表单data
this.showFlowData();
},
methods: {
add() {
this.edit({});
},
edit(record) {
this.form.resetFields();
this.model = Object.assign({}, record);
this.visible = true;
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, 'confusionCode', 'tableName', 'fieldName'))
})
},
//渲染流程表单数据
showFlowData() {
if (this.formBpm === true) {
let params = {id: this.formData.dataId};
getAction(this.url.queryById, params).then((res) => {
if (res.success) {
this.edit(res.result);
}
}
return false
});
}
},
created () {
//如果是流程中表单，则需要加载流程表单data
this.showFlowData();
},
methods: {
add () {
this.edit({});
},
edit (record) {
this.form.resetFields();
this.model = Object.assign({}, record);
this.visible = true;
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model,'confusionCode','tableName','fieldName'))
})
},
//渲染流程表单数据
showFlowData(){
if(this.formBpm === true){
let params = {id:this.formData.dataId};
getAction(this.url.queryById,params).then((res)=>{
if(res.success){
this.edit (res.result);
}
});
}
},
submitForm () {
const that = this;
// 触发表单验证
this.form.validateFields((err, values) => {
if (!err) {
that.confirmLoading = true;
let httpurl = '';
let method = '';
if(!this.model.id){
httpurl+=this.url.add;
method = 'post';
}else{
httpurl+=this.url.edit;
method = 'put';
}
let formData = Object.assign(this.model, values);
console.log("表单提交数据",formData)
httpAction(httpurl,formData,method).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.$emit('ok');
}else{
that.$message.warning(res.message);
}
}).finally(() => {
that.confirmLoading = false;
})
submitForm() {
const that = this;
// 触发表单验证
this.form.validateFields((err, values) => {
if (!err) {
that.confirmLoading = true;
let httpurl = '';
let method = '';
if (!this.model.id) {
httpurl += this.url.add;
method = 'post';
} else {
httpurl += this.url.edit;
method = 'put';
}
let formData = Object.assign(this.model, values);
console.log("表单提交数据", formData)
httpAction(httpurl, formData, method).then((res) => {
if (res.success) {
that.$message.success(res.message);
that.$emit('ok');
} else {
that.$message.warning(res.message);
}
}).finally(() => {
that.confirmLoading = false;
})
}
})
},
popupCallback(row){
this.form.setFieldsValue(pick(row,'confusionType','confusionName'))
},
}
})
},
popupCallback(row) {
this.form.setFieldsValue(pick(row, 'confusionType', 'confusionName'))
},
}
}
</script>
src/views/system/modules/SysConfusionModal.vue
+49 -48
View File
@@ -1,60 +1,61 @@
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
switchFullscreen
@ok="handleOk"
:okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
@cancel="handleCancel"
cancelText="关闭">
:title="title"
:width="width"
:visible="visible"
switchFullscreen
@ok="handleOk"
:okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
@cancel="handleCancel"
cancelText="关闭">
<sys-confusion-form ref="realForm" @ok="submitCallback" :disabled="disableSubmit"></sys-confusion-form>
</j-modal>
</template>
<script>
import SysConfusionForm from './SysConfusionForm'
export default {
name: 'SysConfusionModal',
components: {
SysConfusionForm
import SysConfusionForm from './SysConfusionForm'
export default {
name: 'SysConfusionModal',
components: {
SysConfusionForm
},
data() {
return {
title: '',
width: 800,
visible: false,
disableSubmit: false
}
},
methods: {
add() {
this.visible = true
this.$nextTick(() => {
this.$refs.realForm.add();
})
},
data () {
return {
title:'',
width:800,
visible: false,
disableSubmit: false
}
edit(record) {
this.visible = true
this.$nextTick(() => {
this.$refs.realForm.edit(record);
})
},
methods: {
add () {
this.visible=true
this.$nextTick(()=>{
this.$refs.realForm.add();
})
},
edit (record) {
this.visible=true
this.$nextTick(()=>{
this.$refs.realForm.edit(record);
})
},
close () {
this.$emit('close');
this.visible = false;
},
handleOk () {
this.$refs.realForm.submitForm();
},
submitCallback(){
this.$emit('ok');
this.visible = false;
},
handleCancel () {
this.close()
}
close() {
this.$emit('close');
this.visible = false;
},
handleOk() {
this.$refs.realForm.submitForm();
},
submitCallback() {
this.$emit('ok');
this.visible = false;
},
handleCancel() {
this.close()
}
}
</script>
}
</script>