pengjunjie/JeecgBoot
1
0
Fork 1
mirror of https://github.com/jeecgboot/JeecgBoot.git synced 2026-02-07 02:55:36 +08:00
Code Issues Packages Projects Releases Wiki Activity

jeecg-boot 1.1 稳定版本发布

Browse Source
This commit is contained in:
zhangdaihao
2019-04-14 16:20:04 +08:00
parent c0b489a0e7
commit cd327c4895
375 changed files with 48784 additions and 7523 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ant-design-jeecg-vue/src/views/jeecg/FlowTest.vue → ant-design-jeecg-vue/src/views/jeecg/InterfaceTest.vue
View File

@ -1,13 +1,13 @@
<template>
<a-card :bordered="false">
<a-row>
<a-col :span="2">
<a-col :md="2" :sm="4">
<a-select defaultValue="POST" style="width: 90px" @change="handleChange" size="large">
<a-select-option value="POST">POST</a-select-option>
<!--<a-select-option value="GET">GET</a-select-option>-->
</a-select>
</a-col>
<a-col :span="22">
<a-col :md="22" :sm="20">
<a-input-search
placeholder="input send url"
v-model="url"

43
ant-design-jeecg-vue/src/views/jeecg/JSearchUserByDepList.vue Normal file
View File

@ -0,0 +1,43 @@
<template>
<div>
<a-input-search
v-model="this.selectedUserNames"
placeholder="请先选择用户"
disabled
@search="onSearch"
size="large">
<a-button slot="enterButton">选择用户</a-button>
</a-input-search>
<j-search-user-by-dep-modal ref="JSearchUserByDepModal" @ok="modalFormOk"></j-search-user-by-dep-modal>
</div>
</template>
<script>
import JSearchUserByDepModal from '@/components/jeecgbiz/JSearchUserByDepModal'
export default {
name: 'JSearchUserByDepList',
components: {
JSearchUserByDepModal,
},
data() {
return {
selectedUserNames: '',
}
},
methods: {
onSearch() {
this.$refs.JSearchUserByDepModal.showModal();
this.selectedUserNames = '';
this.$refs.JSearchUserByDepModal.title = '根据部门查询用户';
},
modalFormOk(selectedValue) {
this.selectedUserNames = selectedValue;
}
}
}
</script>
<style scoped>
</style>

253
ant-design-jeecg-vue/src/views/jeecg/JeecgDemoList.vue
View File

@ -6,40 +6,65 @@
<a-form layout="inline">
<a-row :gutter="24">
<a-col :span="6">
<a-col :md="6" :sm="8">
<a-form-item label="名称">
<a-input placeholder="请输入名称查询" v-model="queryParam.name"></a-input>
</a-form-item>
</a-col>
<a-col :span="6">
<a-col :md="6" :sm="8">
<a-form-item label="年龄">
<a-input placeholder="请输入名称查询" v-model="queryParam.age"></a-input>
</a-form-item>
</a-col>
<a-col :span="6">
<a-form-item label="性别">
<DictSelectTag v-model="queryParam.sex" placeholder="请输入用户性别" dictCode="sex"/>
</a-form-item>
</a-col>
<template v-if="toggleSearchStatus">
<a-col :md="6" :sm="8">
<a-form-item label="字典下拉">
<j-dict-select-tag v-model="queryParam.sex" placeholder="请选择用户名称" dictCode="sex"/>
</a-form-item>
</a-col>
<a-col :span="6" >
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
<a-col :md="6" :sm="8">
<a-form-item label="字典表下拉">
<j-dict-select-tag v-model="queryParam.realname" placeholder="请选择用户" dictCode="sys_user,realname,id"/>
</a-form-item>
</a-col>
</template>
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
<a-col :md="6" :sm="24">
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
<a-button type="primary" @click="superQuery" icon="filter" style="margin-left: 8px">高级查询</a-button>
</span>
</a-col>
</a-col>
</span>
<a-col :md="6" :sm="24">
<template v-if="superQueryFlag">
<a-tooltip title="已有高级查询条件生效!">
<button :disabled="false" class="ant-btn ant-btn-primary" @click="superQuery">
<a-icon type="appstore" theme="twoTone" spin="true"></a-icon>
<span>高级查询</span>
</button>
</a-tooltip>
</template>
<a-button v-else type="primary" @click="superQuery" icon="filter">高级查询</a-button>
<a @click="handleToggleSearch" style="margin-left: 8px">
{{ toggleSearchStatus ? '收起' : '展开' }}
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
</a>
</a-col>
</a-row>
</a-form>
</div>
<!-- 操作按钮区域 -->
<div class="table-operator">
<div class="table-operator" style="margin-top: 5px">
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
<a-button type="primary" icon="plus" @click="jump">创建单据</a-button>
<a-button type="primary" icon="plus" @click="onetomany">一对多</a-button>
<a-button type="primary" icon="download" @click="exportXls">导出</a-button>
<a-upload name="file" :showUploadList="false" :multiple="false" :action="importExcelUrl" @change="handleImportExcel">
<a-button type="primary" icon="import">导入</a-button>
</a-upload>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel">
@ -94,38 +119,51 @@
<!-- table区域-end -->
<!-- 表单区域 -->
<jeecgDemo-modal ref="jeecgDemoModal" @ok="modalFormOk"></jeecgDemo-modal>
<jeecgDemo-modal ref="modalForm" @ok="modalFormOk"></jeecgDemo-modal>
<!-- 一对多表单区域 -->
<JeecgDemoTabsModal ref="jeecgDemoTabsModal" @ok="modalFormOk"></JeecgDemoTabsModal>
<!-- 高级查询区域 -->
<superQueryModal ref="superQueryModal" @ok="modalFormOk" @handleSuperQuery="handleSuperQuery"></superQueryModal>
<j-super-query :fieldList="fieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>
</a-card>
</template>
<script>
import JeecgDemoModal from './modules/JeecgDemoModal'
import SuperQueryModal from './modules/SuperQueryModal'
import JSuperQuery from '@/components/jeecg/JSuperQuery.vue';
import JeecgDemoTabsModal from './modules/JeecgDemoTabsModal'
import {filterObj} from '@/utils/util'
import {deleteAction, getAction, postAction} from '@/api/manage'
import {initDictOptions, filterDictText} from '@/components/dict/DictSelectUtil'
import {initDictOptions, filterDictText} from '@/components/dict/JDictSelectUtil'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
//高级查询modal需要参数
const superQueryFieldList=[{
type:"date",
value:"birthday",
text:"生日"
},{
type:"string",
value:"name",
text:"用户名"
},{
type:"int",
value:"age",
text:"年龄"
}]
export default {
name: "JeecgDemoList",
mixins:[JeecgListMixin],
components: {
JeecgDemoModal,
SuperQueryModal,
JSuperQuery,
JeecgDemoTabsModal,
},
data() {
return {
description: '用户管理页面',
// 查询条件
queryParam: {},
//字典数组缓存
sexDictOptions: [],
importExcelUrl:`${window._CONFIG['domianURL']}/test/jeecgDemo/importExcel`,
// 表头
columns: [
{
@ -157,7 +195,7 @@
title: '性别',
align: "center",
dataIndex: 'sex',
customRender: (text, record, index) => {
customRender: (text) => {
//字典值替换通用方法
return filterDictText(this.sexDictOptions, text);
}
@ -189,66 +227,34 @@
scopedSlots: {customRender: 'action'},
}
],
//数据集
dataSource: [],
// 分页参数
ipagination: {
current: 1,
pageSize: 10,
pageSizeOptions: ['10', '20', '30'],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条"
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
isorter: {
column: 'createTime',
order: 'desc',
},
loading: false,
selectedRowKeys: [],
selectedRows: [],
url: {
list: "/test/jeecgDemo/list",
delete: "/test/jeecgDemo/delete",
deleteBatch: "/test/jeecgDemo/deleteBatch",
},
fieldList:superQueryFieldList
}
},
created() {
this.loadData();
//初始化字典配置
this.initDictConfig();
},
methods: {
loadData(arg) {
//加载数据 若传入参数1则加载第一页的内容
if (arg === 1) {
this.ipagination.current = 1;
}
var params = this.getQueryParams();//查询条件
getAction(this.url.list, params).then((res) => {
if (res.success) {
this.dataSource = res.result.records;
this.ipagination.total = res.result.total;
}
})
exportXls(){
let paramsStr = encodeURI(JSON.stringify(this.getQueryParams()));
console.log('paramsStr: ' + paramsStr)
let url = `${window._CONFIG['domianURL']}/test/jeecgDemo/exportXls?paramsStr=${paramsStr}`;
window.location.href = url;
},
handleSuperQuery(arg) {//高级查询方法
let params = {'superQueryParams':encodeURI(JSON.stringify(arg))};
getAction(this.url.list, params).then((res) => {
if (res.success) {
this.dataSource = res.result.records;
this.ipagination.total = res.result.total;
}else{
that.$message.warn(res.message);
}
})
handleImportExcel(info){
if (info.file.status !== 'uploading') {
console.log(info.file, info.fileList);
}
if (info.file.status === 'done') {
this.$message.success(`${info.file.name} 文件上传成功`);
this.loadData();
} else if (info.file.status === 'error') {
this.$message.error(`${info.file.name} 文件上传失败.`);
}
},
initDictConfig() {
console.log("--我才是真的方法!--")
//初始化字典 - 性别
initDictOptions('sex').then((res) => {
if (res.success) {
@ -256,105 +262,10 @@
}
});
},
getQueryParams() {
var param = Object.assign({}, this.queryParam, this.isorter);
param.field = this.getQueryField();
param.pageNo = this.ipagination.current;
param.pageSize = this.ipagination.pageSize;
return filterObj(param);
},
getQueryField() {
//TODO 字段权限控制
var str = "id,";
this.columns.forEach(function (value, index) {
str += "," + value.dataIndex;
});
return str;
},
onSelectChange(selectedRowKeys, selectionRows) {
this.selectedRowKeys = selectedRowKeys;
this.selectionRows = selectionRows;
},
onClearSelected() {
this.selectedRowKeys = [];
this.selectionRows = [];
},
searchQuery() {
this.loadData(1);
},
superQuery() {
this.$refs.superQueryModal.show();
},
searchReset() {
var that = this;
that.queryParam = {}
that.loadData(1);
},
batchDel: function () {
if (this.selectedRowKeys.length <= 0) {
this.$message.warning('请选择一条记录！');
return;
} else {
var ids = "";
for (var a = 0; a < this.selectedRowKeys.length; a++) {
ids += this.selectedRowKeys[a] + ",";
}
var that = this;
this.$confirm({
title: "确认删除",
content: "是否删除选中数据?",
onOk: function () {
deleteAction(that.url.deleteBatch, {ids: ids}).then((res) => {
if (res.success) {
that.$message.success(res.message);
that.loadData();
that.onClearSelected();
} else {
that.$message.warning(res.message);
}
});
}
});
}
},
handleDelete: function (id) {
var that = this;
deleteAction(that.url.delete, {id: id}).then((res) => {
if (res.success) {
that.$message.success(res.message);
that.loadData();
} else {
that.$message.warning(res.message);
}
});
},
handleEdit: function (record) {
this.$refs.jeecgDemoModal.edit(record);
this.$refs.jeecgDemoModal.title = "编辑";
},
onetomany: function (record) {
onetomany: function () {
this.$refs.jeecgDemoTabsModal.add();
this.$refs.jeecgDemoTabsModal.title = "编辑";
},
handleAdd: function () {
this.$refs.jeecgDemoModal.add();
this.$refs.jeecgDemoModal.title = "新增";
},
handleTableChange(pagination, filters, sorter) {
//分页、排序、筛选变化时触发
console.log(sorter);
//TODO 筛选
if (Object.keys(sorter).length > 0) {
this.isorter.column = sorter.field;
this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
}
this.ipagination = pagination;
this.loadData();
},
modalFormOk() {
// 新增/修改 成功时，重载列表
this.loadData();
},
//跳转单据页面
jump() {
this.$router.push({path: '/jeecg/helloworld'})
@ -367,10 +278,6 @@
margin-bottom: 18px;
}
.ant-layout-content {
margin: 12px 16px 0 !important;
}
.ant-table-tbody .ant-table-row td {
padding-top: 15px;
padding-bottom: 15px;

191
ant-design-jeecg-vue/src/views/jeecg/JeecgEditableTableExample.vue Normal file
View File

@ -0,0 +1,191 @@
<template>
<a-card :borderd="false">
<a-button @click="handleTableCheck" type="primary">表单验证</a-button>
<span style="padding-left:8px;"></span>
<a-tooltip placement="top" title="获取值，忽略表单验证" :autoAdjustOverflow="true">
<a-button @click="handleTableGet" type="primary">获取值</a-button>
</a-tooltip>
<span style="padding-left:8px;"></span>
<a-tooltip placement="top" title="模拟加载1000条数据" :autoAdjustOverflow="true">
<a-button @click="handleTableSet" type="primary">设置值</a-button>
</a-tooltip>
<j-editable-table
ref="editableTable"
:loading="loading"
:columns="columns"
:dataSource="dataSource"
:rowNumber="true"
:rowSelection="true"
:actionButton="true"
style="margin-top: 8px;"
@selectRowChange="handleSelectRowChange"/>
</a-card>
</template>
<script>
import JEditableTable from '@/components/jeecg/JEditableTable'
import { FormTypes } from '@/utils/JEditableTableUtil'
import { randomUUID, randomString, randomNumber } from '@/utils/util'
export default {
name: 'JeecgEditableTableExample',
components: {
JEditableTable
},
data() {
return {
loading: false,
columns: [
{
title: '字段名称',
key: 'dbFieldName',
width: '19%',
type: FormTypes.input,
defaultValue: '',
placeholder: '请输入${title}',
validateRules: [
{
required: true, // 必填
message: '请输入${title}' // 显示的文本
},
{
pattern: /^[a-z|A-Z][a-z|A-Z\d_-]{0,}$/, // 正则
message: '${title}必须以字母开头，可包含数字、下划线、横杠'
}
]
},
{
title: '字段备注',
key: 'dbFieldTxt',
width: '19%',
type: FormTypes.input,
defaultValue: '',
placeholder: '请输入${title}',
validateRules: [{ required: true, message: '请输入${title}' }]
},
{
title: '字段类型',
key: 'dbFieldType',
width: '18%',
type: FormTypes.select,
options: [ // 下拉选项
{ title: 'String', value: 'string' },
{ title: 'Integer', value: 'int' },
{ title: 'Double', value: 'double' },
{ title: 'Boolean', value: 'boolean' }
],
defaultValue: '',
placeholder: '请选择${title}',
validateRules: [{ required: true, message: '请选择${title}' }]
},
{
title: '字段长度',
key: 'dbLength',
width: '8%',
type: FormTypes.inputNumber,
defaultValue: 32,
placeholder: '${title}',
validateRules: [{ required: true, message: '请输入${title}' }]
},
{
title: '默认值',
key: 'dbDefaultVal',
width: '22%',
type: FormTypes.input,
defaultValue: '',
placeholder: '请输入${title}',
validateRules: [{ required: true, message: '请输入${title}' }]
},
{
title: '可以为空',
key: 'isNull',
width: '8%',
type: FormTypes.checkbox,
customValue: ['Y', 'N'], // true ,false
defaultChecked: false
}
],
dataSource: [],
selectedRowIds: []
}
},
created() {
},
mounted() {
this.randomData(23, false)
},
methods: {
/** 表单验证 */
handleTableCheck() {
this.$refs.editableTable.getValues((error) => {
if (error === 0) {
this.$message.success('验证通过')
} else {
this.$message.error('验证未通过')
}
})
},
/** 获取值，忽略表单验证 */
handleTableGet() {
this.$refs.editableTable.getValues((error, values) => {
console.log('values:', values)
}, false)
console.log('deleteIds:', this.$refs.editableTable.getDeleteIds())
this.$message.info('获取值成功，请看控制台输出')
},
/** 模拟加载1000条数据 */
handleTableSet() {
this.randomData(1000, true)
},
handleSelectRowChange(selectedRowIds) {
this.selectedRowIds = selectedRowIds
},
/* 随机生成数据 */
randomData(size, loading = false) {
if (loading) {
this.loading = true
setTimeout(() => {
this.loading = false
}, 3000)
}
let values = []
for (let i = 0; i < size; i++) {
values.push({
id: randomUUID(),
dbFieldName: `name_${i + 1}`,
dbFieldTxt: randomString(10),
dbFieldType: ['string', 'int', 'double', 'boolean'][randomNumber(0, 3)],
dbLength: randomNumber(0, 233),
dbDefaultVal: randomString(8),
isNull: ['Y', 'N'][randomNumber(0, 1)]
})
}
this.dataSource = values
}
}
}
</script>
<style scoped>
</style>

180
ant-design-jeecg-vue/src/views/jeecg/JeecgOrderMainList.vue
View File

@ -6,12 +6,12 @@
<a-form layout="inline">
<a-row :gutter="24">
<a-col :span="6">
<a-col :md="6" :sm="24">
<a-form-item label="订单号">
<a-input placeholder="请输入订单号" v-model="queryParam.orderCode"></a-input>
</a-form-item>
</a-col>
<a-col :span="6">
<a-col :md="6" :sm="24">
<a-form-item label="订单类型">
<a-select placeholder="请输入订单类型" v-model="queryParam.ctype">
<a-select-option value="1">国内订单</a-select-option>
@ -20,7 +20,7 @@
</a-form-item>
</a-col>
<a-col :span="8" >
<a-col :md="6" :sm="24" >
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
@ -34,6 +34,10 @@
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
<a-button type="primary" icon="download" @click="exportXls">导出</a-button>
<a-upload name="file" :showUploadList="false" :multiple="false" :action="importExcelUrl" @change="handleImportExcel">
<a-button type="primary" icon="import">导入</a-button>
</a-upload>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
@ -83,25 +87,24 @@
<!-- table区域-end -->
<!-- 表单区域 -->
<jeecgOrderMain-modal ref="jeecgOrderMainModal" @ok="modalFormOk"></jeecgOrderMain-modal>
<jeecgOrderMain-modal ref="modalForm" @ok="modalFormOk"></jeecgOrderMain-modal>
</a-card>
</template>
<script>
import JeecgOrderMainModal from './modules/JeecgOrderMainModal'
import { filterObj } from '@/utils/util'
import { deleteAction,getAction } from '@/api/manage'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
export default {
name: "JeecgOrderMainList",
mixins: [JeecgListMixin],
components: {
JeecgOrderMainModal
},
data () {
return {
description: '订单管理页面',
// 查询条件
queryParam: {},
importExcelUrl:`${window._CONFIG['domianURL']}/test/jeecgOrderMain/importExcel`,
// 表头
columns: [
{
@ -114,12 +117,12 @@
return parseInt(index)+1;
}
},
{
{
title: '订单号',
align:"center",
dataIndex: 'orderCode'
},
{
{
title: '订单类型',
align:"center",
dataIndex: 'ctype',
@ -133,17 +136,17 @@
return re;
}
},
{
{
title: '订单日期',
align:"center",
dataIndex: 'orderDate'
},
{
{
title: '订单金额',
align:"center",
dataIndex: 'orderMoney'
},
{
{
title: '订单备注',
align:"center",
dataIndex: 'content'
@ -155,154 +158,43 @@
scopedSlots: { customRender: 'action' },
}
],
//数据集
dataSource:[],
// 分页参数
ipagination:{
current: 1,
pageSize: 10,
pageSizeOptions: ['10', '20', '30'],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条"
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
isorter:{
column: 'createTime',
order: 'desc',
},
loading:false,
selectedRowKeys: [],
selectedRows: [],
url: {
list: "/test/jeecgOrderMain/list",
delete: "/test/jeecgOrderMain/delete",
deleteBatch: "/test/jeecgOrderMain/deleteBatch",
},
}
}
},
created() {
this.loadData();
},
methods: {
loadData (arg){
//加载数据 若传入参数1则加载第一页的内容
if(arg===1){
this.ipagination.current = 1;
exportXls(){
let paramsStr = encodeURI(JSON.stringify(this.getQueryParams()));
console.log('paramsStr: ' + paramsStr)
let url = `${window._CONFIG['domianURL']}/test/jeecgOrderMain/exportXls?paramsStr=${paramsStr}`;
window.location.href = url;
},
handleImportExcel(info){
if (info.file.status !== 'uploading') {
console.log(info.file, info.fileList);
}
var params = this.getQueryParams();//查询条件
getAction(this.url.list,params).then((res)=>{
if(res.success){
this.dataSource = res.result.records;
this.ipagination.total = res.result.total;
}
})
},
getQueryParams(){
var param = Object.assign({}, this.queryParam,this.isorter);
param.field = this.getQueryField();
param.pageNo = this.ipagination.current;
param.pageSize = this.ipagination.pageSize;
return filterObj(param);
},
getQueryField(){
//TODO 字段权限控制
var str = "id,";
for(var a = 0;a<this.columns.length;a++){
str+=","+this.columns[a].dataIndex;
if (info.file.status === 'done') {
this.$message.success(`${info.file.name} 文件上传成功`);
this.loadData();
} else if (info.file.status === 'error') {
this.$message.error(`${info.file.name} 文件上传失败.`);
}
return str;
},
onSelectChange (selectedRowKeys,selectionRows) {
this.selectedRowKeys = selectedRowKeys;
this.selectionRows = selectionRows;
},
onClearSelected(){
this.selectedRowKeys = [];
this.selectionRows = [];
},
searchQuery(){
this.loadData(1);
},
searchReset(){
var that = this;
that.queryParam={};
that.loadData(1);
},
batchDel: function(){
if(this.selectedRowKeys.length<=0){
this.$message.warning('请选择一条记录！');
return ;
}else{
var ids = "";
for(var a =0;a<this.selectedRowKeys.length;a++){
ids+=this.selectedRowKeys[a]+",";
}
var that = this;
this.$confirm({
title:"确认删除",
content:"是否删除选中数据?",
onOk: function(){
deleteAction(that.url.deleteBatch,{ids: ids}).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.loadData();
that.onClearSelected();
}else{
that.$message.warning(res.message);
}
});
}
});
}
},
handleDelete: function(id){
var that = this;
deleteAction(that.url.delete,{id: id}).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.loadData();
}else{
that.$message.warning(res.message);
}
});
},
handleEdit: function(record){
this.$refs.jeecgOrderMainModal.edit(record);
this.$refs.jeecgOrderMainModal.title="编辑";
},
handleAdd: function(){
this.$refs.jeecgOrderMainModal.add();
this.$refs.jeecgOrderMainModal.title="新增";
},
handleTableChange(pagination, filters, sorter){
//分页、排序、筛选变化时触发
console.log(sorter);
//TODO 筛选
if (Object.keys(sorter).length>0){
this.isorter.column = sorter.field;
this.isorter.order = "ascend"==sorter.order?"asc":"desc"
}
this.ipagination = pagination;
this.loadData();
},
modalFormOk () {
// 新增/修改 成功时，重载列表
this.loadData();
}
}
}
</script>
<style scoped>
/** Button按钮间距 */
.ant-btn {
margin-left: 3px
}
.ant-card-body .table-operator{
margin-bottom: 18px;
}
.ant-layout-content{
margin:12px 16px 0 !important;
}
.ant-table-tbody .ant-table-row td{
padding-top:15px;
padding-bottom:15px;

217
ant-design-jeecg-vue/src/views/jeecg/JeecgOrderMainListForJEditableTable.vue Normal file
View File

@ -0,0 +1,217 @@
<template>
<a-card :bordered="false">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<a-form layout="inline">
<a-row :gutter="24">
<a-col :md="6" :sm="24">
<a-form-item label="订单号">
<a-input placeholder="请输入订单号" v-model="queryParam.orderCode"></a-input>
</a-form-item>
</a-col>
<a-col :md="6" :sm="24">
<a-form-item label="订单类型">
<a-select placeholder="请输入订单类型" v-model="queryParam.ctype">
<a-select-option value="1">国内订单</a-select-option>
<a-select-option value="2">国际订单</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :md="6" :sm="24">
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
</span>
</a-col>
</a-row>
</a-form>
</div>
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</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>
</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>
<span>已选择</span>
<a style="font-weight: 600">
{{ selectedRowKeys.length }}
</a>
<span>项</span>
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
</div>
<a-table
ref="table"
size="middle"
bordered
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange">
<span slot="action" slot-scope="text, record">
<a @click="handleEdit(record)">编辑</a>
<a-divider type="vertical"/>
<a-dropdown>
<a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
<a-menu slot="overlay">
<a-menu-item>
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
<a>删除</a>
</a-popconfirm>
</a-menu-item>
</a-menu>
</a-dropdown>
</span>
</a-table>
</div>
<!-- table区域-end -->
<!-- 表单区域 -->
<jeecg-order-modal-for-j-editable-table ref="modalForm" @ok="modalFormOk"/>
</a-card>
</template>
<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import JeecgOrderModalForJEditableTable from './modules/JeecgOrderModalForJEditableTable'
export default {
name: 'JeecgOrderMainListForJEditableTable',
mixins: [JeecgListMixin],
components: {
JeecgOrderModalForJEditableTable
},
data() {
return {
description: '订单管理页面',
// 请求参数
url: {
list: '/test/jeecgOrderMain/list',
delete: '/test/jeecgOrderMain/delete',
deleteBatch: '/test/jeecgOrderMain/deleteBatch'
},
// 表头
columns: [
{
title: '#',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: function(t, r, index) {
return parseInt(index) + 1
}
},
{
title: '订单号',
align: 'center',
dataIndex: 'orderCode'
},
{
title: '订单类型',
align: 'center',
dataIndex: 'ctype',
customRender: (text) => {
let re = ''
if (text === '1') {
re = '国内订单'
} else if (text === '2') {
re = '国际订单'
}
return re
}
},
{
title: '订单日期',
align: 'center',
dataIndex: 'orderDate'
},
{
title: '订单金额',
align: 'center',
dataIndex: 'orderMoney'
},
{
title: '订单备注',
align: 'center',
dataIndex: 'content'
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
scopedSlots: { customRender: 'action' }
}
]
}
},
methods: {
initDictConfig() {
}
}
}
</script>
<style scoped>
.ant-card-body .table-operator {
margin-bottom: 18px;
}
.ant-table-tbody .ant-table-row td {
padding-top: 15px;
padding-bottom: 15px;
}
.anty-row-operator button {
margin: 0 5px
}
.ant-btn-danger {
background-color: #ffffff
}
.ant-modal-cust-warp {
height: 100%
}
.ant-modal-cust-warp .ant-modal-body {
height: calc(100% - 110px) !important;
overflow-y: auto
}
.ant-modal-cust-warp .ant-modal-content {
height: 90% !important;
overflow-y: hidden
}
</style>

112
ant-design-jeecg-vue/src/views/jeecg/PrintDemoList.vue → ant-design-jeecg-vue/src/views/jeecg/PrintDemo.vue
View File

@ -1,32 +1,38 @@
<template>
<a-card :bordered="false" :class="{'abcdefg':true}">
<div class="no-print" style="text-align: right">
<a-button v-print="'#acceptProof'" ghost type="primary">打印</a-button>
<a-button v-print="'#printContent'" ghost type="primary">打印</a-button>
</div>
<section ref="print" id="acceptProof" class="abcdefg">
<section ref="print" id="printContent" class="abcdefg">
<div style="text-align: center">
<p style="font-size: 24px;font-weight: 800">打印测试表单</p>
</div>
<!--签字-->
<div class="sign" style="text-align: left">
<a-form-item label="打印员：" :labelCol="labelCol" :wrapperCol="wrapperCol" hasFeedback>
<a-input placeholder="请输入您的名字"/>
</a-form-item>
<a-form-item label="打印日期：" :labelCol="labelCol" :wrapperCol="wrapperCol" hasFeedback>
<a-date-picker></a-date-picker>
</a-form-item>
<a-form-item label="打印内容：" :labelCol="labelCol" :wrapperCol="wrapperCol" hasFeedback>
<a-textarea placeholder="请输入打印内容..."/>
</a-form-item>
<a-form-item label="打印目的：" :labelCol="labelCol" :wrapperCol="wrapperCol" hasFeedback>
<a-textarea placeholder="请输入打印目的..."/>
</a-form-item>
<a-form-item label="打印说明：" :labelCol="labelCol" :wrapperCol="wrapperCol" hasFeedback>
<a-textarea placeholder="请输入打印说明..."/>
</a-form-item>
<a-form-item label="打印图片：" :labelCol="labelCol" :wrapperCol="wrapperCol" hasFeedback>
<a-col :md="24" :sm="24">
<div class="sign" style="text-align: left;height: inherit">
<a-col :span="24">
<span>
打印人员:
</span>
<a-input style="width: 30%" v-model="printer"/>
<span style="margin-left: 12.5%">打印日期:</span>
<a-input style="width: 30%" v-model="printTime"/>
</a-col>
<a-col :span="24">
</a-col>
<a-col :span="24" style="margin-top: 20px">
<span>打印内容:</span>
<a-input style="width: 80%" v-model="printContent"/>
</a-col>
<a-col :span="24" style="margin-top: 20px">
<span>打印目的:</span>
<a-input style="width: 80%" v-model="printReason"/>
</a-col>
<a-col style="margin-top: 20px" :span="24">
<span>打印图片:</span>
<br/>
<a-upload
action="//jsonplaceholder.typicode.com/posts/"
action="/jsonplaceholder.typicode.com/posts/"
listType="picture-card"
:fileList="fileList"
@preview="handlePreview"
@ -39,8 +45,9 @@
<a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
<img alt="example" style="width: 100%" :src="previewImage" />
</a-modal>
</a-form-item>
</a-col>
</div>
</a-col>
</section>
</a-card>
<!--</page-layout>-->
@ -48,7 +55,6 @@
<script>
import ACol from "ant-design-vue/es/grid/Col";
import ARow from "ant-design-vue/es/grid/Row";
import {getAction} from '@/api/manage';
import ATextarea from 'ant-design-vue/es/input/TextArea'
export default {
@ -66,25 +72,9 @@
},
data(){
return {
columns: [
/* {
title: '已提交的文件资料',
dataIndex: 'fileCategoryName',
align:"center",
},
{
title: '份数',
dataIndex: 'fileNum',
align:"center",
},
{
title: '材料介质',
dataIndex: 'fileType',
align:"center",
},*/
columns: [{
}
],
dataSource:[],
applicantName:"",
labelCol: {
xs: { span: 24 },
sm: { span: 2 },
@ -93,15 +83,10 @@
xs: { span: 24 },
sm: { span: 8 },
},
beginYear:"",
beginMonth:"",
beginDay:"",
endYear:"",
endMonth:"",
endDay:"",
ipagination:{
hideOnSinglePage:false,
},
printer:'张三',
printTime:'2019-02-01 12:00:00',
printContent:'打印内容就是,做一个打印测试',
printReason:'做一个打印测试',
previewVisible: false,
previewImage: '',
fileList: [{
@ -127,34 +112,7 @@
this.getDate();
},
methods: {
loadData(reBizCode){
// 获取材料文件
getAction(this.url.loadRegisterFiles,{reBizCode:reBizCode}).then((res)=>{
if(res.success){
console.log(res.result)
this.dataSource = res.result;
}
});
// 获取申请人信息
getAction(this.url.loadApplicant,{reBizCode:reBizCode}).then((res)=>{
if(res.success){
this.applicant = res.result;
var name ="";
for(var i=0;i<res.result.length;i++){
if(i==res.result.length-1){
name = name+res.result[i].name;
}else{
name = name+res.result[i].name+",";
}
}
if(name=="" || name==null ||name=="null"){
this.applicantName = "";
}else{
this.applicantName = name;
}
}
});
loadData(){
},
getDate(){

43
ant-design-jeecg-vue/src/views/jeecg/SearchUserByDepList.vue Normal file
View File

@ -0,0 +1,43 @@
<template>
<div>
<a-input-search
v-model="this.selectedUserNames"
placeholder="请先选择用户"
disabled
@search="onSearch"
size="large">
<a-button slot="enterButton">选择用户</a-button>
</a-input-search>
<j-search-user-by-dep ref="JSearchUserByDep" @ok="modalFormOk"></j-search-user-by-dep>
</div>
</template>
<script>
import JSearchUserByDep from '@/components/jeecgbiz/JSearchUserByDep'
export default {
name: 'SearchUserByDepList',
components: {
JSearchUserByDep,
},
data() {
return {
selectedUserNames: '',
}
},
methods: {
onSearch() {
this.$refs.JSearchUserByDep.showModal();
this.selectedUserNames = '';
this.$refs.JSearchUserByDep.title = '根据部门查询用户';
},
modalFormOk(selectedValue) {
this.selectedUserNames = selectedValue;
}
}
}
</script>
<style scoped>
</style>

135
ant-design-jeecg-vue/src/views/jeecg/SelectDemo.vue Normal file
View File

@ -0,0 +1,135 @@
<template>
<a-card :bordered="false" style="height:100%">
<div class="table-page-search-wrapper">
<a-form layout="inline">
<!-- 选择多个用户，可排序 -->
<a-row :gutter="24">
<a-col :span="12">
<a-form-item label="人员列表">
<a-select
mode="multiple"
placeholder="Please select"
:value=nameList
@change="handleChange"
>
</a-select>
</a-form-item>
</a-col>
<a-col :span="8">
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
<a-button type="primary" @click="handleSelect" icon="search">选择</a-button>
<a-button type="primary" @click="selectReset" icon="reload" style="margin-left: 8px">清空</a-button>
</span>
</a-col>
</a-row>
<!-- 通过部门筛选，选择人 -->
<a-row :gutter="24">
<a-col :span="12">
<a-form-item label="人员列表">
<a-input-search
v-model="this.selectedDepUsers"
placeholder="请先选择用户"
disabled
@search="onSearchDepUser"
size="large">
<a-button slot="enterButton">选择用户</a-button>
</a-input-search>
</a-form-item>
</a-col>
</a-row>
</a-form>
</div>
<!-- 选择多个用户支持排序 -->
<select-multiple-user-modal ref="selectDemoModal" @selectFinished="selectOK"></select-multiple-user-modal>
<!-- 通过部门筛选，选择人 -->
<search-user-by-dep-modal ref="SearchUserByDepModal" @ok="onSearchDepUserCallBack"></search-user-by-dep-modal>
</a-card>
</template>
<script>
import SelectMultipleUserModal from '@/components/jeecgbiz/SelectMultipleUserModal'
import SearchUserByDepModal from '@/components/jeecgbiz/SearchUserByDepModal'
export default {
name: "SelectDemo",
components: {
SelectMultipleUserModal,
SearchUserByDepModal
},
data() {
return {
selectList: [],
selectedDepUsers: ''
}
},
computed: {
nameList: function () {
var names = [];
for (var a = 0; a < this.selectList.length; a++) {
names.push(this.selectList[a].name);
}
return names;
}
},
methods: {
handleChange() {
},
selectOK: function (data) {
this.selectList = data;
},
handleSelect: function () {
this.$refs.selectDemoModal.add();
},
selectReset() {
this.selectList = [];
},
//通过组织机构筛选选择用户
onSearchDepUser() {
this.$refs.SearchUserByDepModal.showModal()
this.selectedDepUsers = ''
this.$refs.SearchUserByDepModal.selectedKeys = []
this.$refs.SearchUserByDepModal.title = '根据部门查询用户'
},
onSearchDepUserCallBack(selectedDepUsers) {
this.selectedDepUsers = selectedDepUsers
}
}
}
</script>
<style lang="less" scoped>
.ant-card-body .table-operator {
margin-bottom: 18px;
}
.ant-table-tbody .ant-table-row td {
padding-top: 15px;
padding-bottom: 15px;
}
.anty-row-operator button {
margin: 0 5px
}
.ant-btn-danger {
background-color: #ffffff
}
.ant-modal-cust-warp {
height: 100%
}
.ant-modal-cust-warp .ant-modal-body {
height: calc(100% - 110px) !important;
overflow-y: auto
}
.ant-modal-cust-warp .ant-modal-content {
height: 90% !important;
overflow-y: hidden
}
</style>

270
ant-design-jeecg-vue/src/views/jeecg/TableExpandeSub.vue Normal file
View File

@ -0,0 +1,270 @@
<template>
<a-card :bordered="false">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<a-form layout="inline">
<a-row :gutter="24">
<a-col :md="6" :sm="24">
<a-form-item label="订单号">
<a-input placeholder="请输入订单号" v-model="queryParam.orderCode"></a-input>
</a-form-item>
</a-col>
<a-col :md="6" :sm="24">
<a-form-item label="订单类型">
<a-select placeholder="请输入订单类型" v-model="queryParam.ctype">
<a-select-option value="1">国内订单</a-select-option>
<a-select-option value="2">国际订单</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :md="6" :sm="24">
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
</span>
</a-col>
</a-row>
</a-form>
</div>
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</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>
</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"
bordered
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="false"
:expandedRowKeys= "expandedRowKeys"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange"
@expand="handleExpand"
>
<span slot="action" slot-scope="text, record">
<a @click="handleEdit(record)">编辑</a>
<a-divider type="vertical"/>
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
<a>删除</a>
</a-popconfirm>
</span>
<a-table
slot="expandedRowRender"
slot-scope="text"
:columns="innerColumns"
:dataSource="innerData"
size="middle"
bordered
rowKey="id"
:pagination="false"
:loading="loading"
>
</a-table>
</a-table>
</div>
<!-- table区域-end -->
<!-- 表单区域 -->
<jeecgOrderDMain-modal ref="modalForm" @ok="modalFormOk"></jeecgOrderDMain-modal>
</a-card>
</template>
<script>
import { getAction } from '@/api/manage'
import JeecgOrderDMainModal from '@/views/jeecg/tablist/form/JeecgOrderDMainModal'
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
export default {
name: "TableDemo",
mixins: [JeecgListMixin],
components: {
JeecgOrderDMainModal
},
data() {
return {
// 子表表头
innerColumns: [
{
title: '客户名',
align: "center",
width: 100,
dataIndex: 'name',
key: 'name',
},
{
title: '性别',
align: "center",
dataIndex: 'sex',
customRender: function (text) {
if (text == 1) {
return "男";
} else if (text == 2) {
return "女";
} else {
return text;
}
}
},
{
title: '身份证号码',
align: "center",
dataIndex: 'idcard',
},
{
title: '电话',
dataIndex: 'telphone',
align: "center",
},
],
innerData: [],
expandedRowKeys: [],
id: ' ',
description: '列表展开子表Demo',
// 列表表头
columns: [{
title: '#',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: "center",
customRender: function (t, r, index) {
return parseInt(index) + 1;
}
},
{
title: '订单号',
align: "center",
dataIndex: 'orderCode'
},
{
title: '订单类型',
align: "center",
dataIndex: 'ctype',
customRender: (text) => {
let re = "";
if (text === '1') {
re = "国内订单";
} else if (text === '2') {
re = "国际订单";
}
return re;
}
},
{
title: '订单日期',
align: "center",
dataIndex: 'orderDate'
},
{
title: '订单金额',
align: "center",
dataIndex: 'orderMoney'
},
{
title: '订单备注',
align: "center",
dataIndex: 'content'
},
{
title: '操作',
dataIndex: 'action',
align: "center",
scopedSlots: {customRender: 'action'},
}],
// 分页参数
type: "radio",
url: {
list: "/test/order/orderList",
delete: "/test/order/delete",
deleteBatch: "/test/order/deleteBatch",
customerListByMainId: "/test/order/listOrderCustomerByMainId",
},
}
},
computed: {
currentId(){
return this.id;
}
},
methods: {
handleExpand(expanded, record){
this.expandedRowKeys=[];
this.innerData=[];
if(expanded===true){
this.loading = true;
this.expandedRowKeys.push(record.id);
getAction(this.url.customerListByMainId, {mainId: record.id}).then((res) => {
if (res.success) {
this.loading = false;
this.innerData = res.result;
}
});
}
},
}
}
</script>
<style scoped>
.ant-card-body .table-operator {
margin-bottom: 18px;
}
.ant-layout-content {
margin: 12px 16px 0 !important;
}
.ant-table-tbody .ant-table-row td {
padding-top: 15px;
padding-bottom: 15px;
}
.anty-row-operator button {
margin: 0 5px
}
.ant-btn-danger {
background-color: #ffffff
}
.ant-modal-cust-warp {
height: 100%
}
.ant-modal-cust-warp .ant-modal-body {
height: calc(100% - 110px) !important;
overflow-y: auto
}
.ant-modal-cust-warp .ant-modal-content {
height: 90% !important;
overflow-y: hidden
}
</style>

79
ant-design-jeecg-vue/src/views/jeecg/helloworld.vue
View File

@ -1,49 +1,41 @@
<template>
<a-form @submit="handleSubmit" :form="form">
<a-form-item
label="Note"
:labelCol="{ span: 5 }"
:wrapperCol="{ span: 12 }"
>
<a-input
v-decorator="[
'note',
{rules: [{ required: true, message: 'Please input your note!' }]}
]"
/>
</a-form-item>
<a-form-item
label="Gender"
:labelCol="{ span: 5 }"
:wrapperCol="{ span: 12 }"
>
<a-select
v-decorator="[
'gender',
{rules: [{ required: true, message: 'Please select your gender!' }]}
]"
placeholder="Select a option and change input text above"
@change="this.handleSelectChange"
>
<a-select-option value="male">male</a-select-option>
<a-select-option value="female">female</a-select-option>
</a-select>
</a-form-item>
<a-form-item
:wrapperCol="{ span: 12, offset: 5 }">
<a-button type="primary" htmlType="submit">
Submit
</a-button>
</a-form-item>
</a-form>
<a-card :bordered="false">
<a-form @submit="handleSubmit" :form="form">
<a-col :md="24" :sm="24">
<a-form-item label="Note" :labelCol="{ span: 7 }" :wrapperCol="{ span: 15 }">
<a-input v-decorator="['note',{rules: [{ required: true, message: 'Please input your note!' }]}]"/>
</a-form-item>
</a-col>
<a-col :md="24" :sm="24">
<a-form-item label="Gender" :labelCol="{ span: 7 }" :wrapperCol="{ span: 15 }">
<a-select v-decorator="['gender',{rules: [{ required: true, message: 'Please select your gender!' }]}]" placeholder="Select a option and change input text above" @change="this.handleSelectChange">
<a-select-option value="male">male</a-select-option>
<a-select-option value="female">female</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :md="24" :sm="24">
<a-form-item label="Gender" :labelCol="{ span: 7 }" :wrapperCol="{ span: 15 }">
<a-cascader :options="areaOptions" @change="onChange" :showSearch="{filter}" placeholder="Please select" />
</a-form-item>
</a-col>
<a-form-item :wrapperCol="{ span: 12, offset: 5 }">
<a-col :md="24" :sm="24">
<a-button type="primary" htmlType="submit">Submit</a-button>
</a-col>
</a-form-item>
</a-form>
</a-card>
</template>
<script>
import { getAction } from '@/api/manage'
export default {
data () {
return {
formLayout: 'horizontal',
form: this.$form.createForm(this),
areaOptions:[]
}
},
methods: {
@ -61,6 +53,19 @@
note: `Hi, ${value === 'male' ? 'man' : 'lady'}!`,
})
},
onChange(value, selectedOptions) {
console.log(value, selectedOptions);
},
filter(inputValue, path) {
return (path.some(option => (option.label).toLowerCase().indexOf(inputValue.toLowerCase()) > -1));
},
},
created (){
getAction('/api/area').then((res) => {
console.log("------------")
console.log(res)
this.areaOptions = res;
})
}
}
</script>

14
ant-design-jeecg-vue/src/views/jeecg/modules/JeecgOrderMainModal.vue
View File

@ -1,12 +1,12 @@
<template>
<a-modal
:title="title"
:width="1000"
:width="1200"
:visible="visible"
:confirmLoading="confirmLoading"
@ok="handleOk"
@cancel="handleCancel">
<a-spin :spinning="confirmLoading">
<a-form :form="form">
<!-- 主表单区域 -->
@ -35,7 +35,7 @@
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单日期">
<a-date-picker showTime format='YYYY-MM-DD HH:mm:ss' v-decorator="[ 'orderDate',{}]"/>
<a-date-picker showTime format="YYYY-MM-DD HH:mm:ss" v-decorator="[ 'orderDate',{}]"/>
</a-form-item>
</a-col>
</a-row>
@ -237,9 +237,11 @@
let orderMainData = Object.assign(this.orderMainModel, values);
//时间格式化
orderMainData.orderDate = orderMainData.orderDate?orderMainData.orderDate.format('YYYY-MM-DD HH:mm:ss'):null;
let formData = {jeecgOrderMain:orderMainData,
jeecgOrderCustomerList:orderMainData.jeecgOrderCustomerList,
jeecgOrderTicketList:orderMainData.jeecgOrderTicketList}
let formData = {
...orderMainData,
jeecgOrderCustomerList: orderMainData.jeecgOrderCustomerList,
jeecgOrderTicketList: orderMainData.jeecgOrderTicketList
}
console.log(formData)
httpAction(httpurl,formData,method).then((res)=>{

340
ant-design-jeecg-vue/src/views/jeecg/modules/JeecgOrderModalForJEditableTable.vue Normal file
View File

@ -0,0 +1,340 @@
<template>
<a-modal
:title="title"
:width="1200"
:visible="visible"
:maskClosable="false"
:confirmLoading="confirmLoading"
@ok="handleOk"
@cancel="handleCancel">
<a-spin :spinning="confirmLoading">
<a-form :form="form">
<!-- 主表单区域 -->
<a-row class="form-row" :gutter="0">
<a-col :lg="8">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单号">
<a-input
placeholder="请输入订单号"
v-decorator="['orderCode', {rules: [{ required: true, message: '请输入订单号!' }]}]"/>
</a-form-item>
</a-col>
<a-col :lg="8">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单类型">
<a-select placeholder="请选择订单类型" v-decorator="['ctype',{}]">
<a-select-option value="1">国内订单</a-select-option>
<a-select-option value="2">国际订单</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :lg="8">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单日期">
<a-date-picker showTime format="YYYY-MM-DD HH:mm:ss" style="width: 100%" v-decorator="[ 'orderDate',{}]"/>
</a-form-item>
</a-col>
</a-row>
<a-row class="form-row" :gutter="0">
<a-col :lg="8">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单金额">
<a-input-number placeholder="请输入订单金额" style="width: 100%" v-decorator="[ 'orderMoney', {}]"/>
</a-form-item>
</a-col>
<a-col :lg="8">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单备注">
<a-input placeholder="请输入订单备注" v-decorator="['content', {}]"/>
</a-form-item>
</a-col>
</a-row>
</a-form>
<!-- 子表单区域 -->
<a-tabs v-model="activeKey" @change="handleChangeTabs">
<a-tab-pane tab="客户信息" key="1" :forceRender="true">
<j-editable-table
ref="editableTable1"
:loading="table1.loading"
:columns="table1.columns"
:dataSource="table1.dataSource"
:maxHeight="300"
:rowNumber="true"
:rowSelection="true"
:actionButton="true"/>
</a-tab-pane>
<a-tab-pane tab="机票信息" key="2" :forceRender="true">
<j-editable-table
ref="editableTable2"
:loading="table2.loading"
:columns="table2.columns"
:dataSource="table2.dataSource"
:maxHeight="300"
:rowNumber="true"
:rowSelection="true"
:actionButton="true"/>
</a-tab-pane>
</a-tabs>
</a-spin>
</a-modal>
</template>
<script>
import JEditableTable from '@/components/jeecg/JEditableTable'
import { FormTypes, VALIDATE_NO_PASSED, getRefPromise, validateFormAndTables } from '@/utils/JEditableTableUtil'
import { httpAction, getAction } from '@/api/manage'
import JDate from '@/components/jeecg/JDate'
import pick from 'lodash.pick'
import moment from 'moment'
export default {
name: 'JeecgOrderModalForJEditableTable',
components: {
JDate, JEditableTable
},
data() {
return {
title: '操作',
visible: false,
form: this.$form.createForm(this),
confirmLoading: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 24 - 6 }
},
activeKey: '1',
// 客户信息
table1: {
loading: false,
dataSource: [],
columns: [
{
title: '客户名',
key: 'name',
width: '24%',
type: FormTypes.input,
defaultValue: '',
placeholder: '请输入${title}',
validateRules: [{ required: true, message: '${title}不能为空' }]
},
{
title: '性别',
key: 'sex',
width: '18%',
type: FormTypes.select,
options: [ // 下拉选项
{ title: '男', value: '1' },
{ title: '女', value: '2' }
],
defaultValue: '',
placeholder: '请选择${title}'
},
{
title: '身份证号',
key: 'idcard',
width: '24%',
type: FormTypes.input,
defaultValue: '',
placeholder: '请输入${title}',
validateRules: [{
pattern: '^\\d{6}(18|19|20)?\\d{2}(0[1-9]|1[012])(0[1-9]|[12]\\d|3[01])\\d{3}(\\d|[xX])$',
message: '${title}格式不正确'
}]
},
{
title: '手机号',
key: 'telphone',
width: '24%',
type: FormTypes.input,
defaultValue: '',
placeholder: '请输入${title}',
validateRules: [{
pattern: '^1(3|4|5|7|8)\\d{9}$',
message: '${title}格式不正确'
}]
}
]
},
// 机票信息
table2: {
loading: false,
dataSource: [],
columns: [
{
title: '航班号',
key: 'ticketCode',
width: '40%',
type: FormTypes.input,
defaultValue: '',
placeholder: '请输入${title}',
validateRules: [{ required: true, message: '${title}不能为空' }]
},
{
title: '航班时间',
key: 'tickectDate',
width: '30%',
type: FormTypes.date,
placeholder: '请选择${title}',
defaultValue: ''
}
]
},
url: {
add: '/test/jeecgOrderMain/add',
edit: '/test/jeecgOrderMain/edit',
orderCustomerList: '/test/jeecgOrderMain/queryOrderCustomerListByMainId',
orderTicketList: '/test/jeecgOrderMain/queryOrderTicketListByMainId'
}
}
},
created() {
},
methods: {
// 获取所有的editableTable实例
getAllTable() {
return Promise.all([
getRefPromise(this, 'editableTable1'),
getRefPromise(this, 'editableTable2')
])
},
add() {
// 默认新增一条数据
this.getAllTable().then(editableTables => {
editableTables[0].add()
editableTables[1].add()
})
this.edit({})
},
edit(record) {
this.visible = true
this.activeKey = '1'
this.form.resetFields()
this.model = Object.assign({}, record)
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, 'orderCode', 'ctype', 'orderMoney', 'content'))
//时间格式化
this.form.setFieldsValue({ orderDate: this.model.orderDate ? moment(this.model.orderDate) : null })
})
// 加载子表数据
if (this.model.id) {
let params = { id: this.model.id }
this.requestTableData(this.url.orderCustomerList, params, this.table1)
this.requestTableData(this.url.orderTicketList, params, this.table2)
}
},
close() {
this.visible = false
this.getAllTable().then(editableTables => {
editableTables[0].initialize()
editableTables[1].initialize()
})
this.$emit('close')
},
/** 查询某个tab的数据 */
requestTableData(url, params, tab) {
tab.loading = true
getAction(url, params).then(res => {
tab.dataSource = res.result || []
}).finally(() => {
tab.loading = false
})
},
handleOk() {
this.validateFields()
},
handleCancel() {
this.close()
},
/** ATab 选项卡切换事件 */
handleChangeTabs(key) {
getRefPromise(this, `editableTable${key}`).then(editableTable => {
editableTable.resetScrollTop()
})
},
/** 触发表单验证 */
validateFields() {
this.getAllTable().then(tables => {
/** 一次性验证主表和所有的次表 */
return validateFormAndTables(this.form, tables)
}).then(allValues => {
let formData = this.classifyIntoFormData(allValues)
// 发起请求
return this.requestAddOrEdit(formData)
}).catch(e => {
if (e.error === VALIDATE_NO_PASSED) {
// 如果有未通过表单验证的子表，就自动跳转到它所在的tab
this.activeKey = e.index == null ? this.activeKey : (e.index + 1).toString()
} else {
console.error(e)
}
})
},
/** 整理成formData */
classifyIntoFormData(allValues) {
let orderMain = Object.assign(this.model, allValues.formValue)
//时间格式化
orderMain.orderDate = orderMain.orderDate ? orderMain.orderDate.format('YYYY-MM-DD HH:mm:ss') : null
return {
...orderMain, // 展开
jeecgOrderCustomerList: allValues.tablesValue[0].values,
jeecgOrderTicketList: allValues.tablesValue[1].values
}
},
/** 发起新增或修改的请求 */
requestAddOrEdit(formData) {
let url = this.url.add, method = 'post'
if (this.model.id) {
url = this.url.edit
method = 'put'
}
this.confirmLoading = true
httpAction(url, formData, method).then((res) => {
if (res.success) {
this.$message.success(res.message)
this.$emit('ok')
this.close()
} else {
this.$message.warning(res.message)
}
}).finally(() => {
this.confirmLoading = false
})
}
}
}
</script>
<style scoped>
</style>

698
ant-design-jeecg-vue/src/views/jeecg/report/Analysis.vue Normal file
View File

@ -0,0 +1,698 @@
<template>
<div class="page-header-index-wide">
<a-row :gutter="24">
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
<chart-card :loading="loading" title="受理量" :total="cardCount.sll | NumberFormat">
<a-tooltip title="指标说明" slot="action">
<a-icon type="info-circle-o" />
</a-tooltip>
<div>
<mini-area :dataSource="chartData.sll" />
</div>
<template slot="footer">今日受理量：<span>{{ todaySll }}</span></template>
</chart-card>
</a-col>
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
<chart-card :loading="loading" title="办结量" :total="cardCount.bjl | NumberFormat">
<a-tooltip title="指标说明" slot="action">
<a-icon type="info-circle-o" />
</a-tooltip>
<div>
<mini-area :dataSource="chartData.bjl"/>
</div>
<template slot="footer">今日办结量：<span>{{ todayBjl }}</span></template>
</chart-card>
</a-col>
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
<chart-card :loading="loading" title="用户受理量" :total="cardCount.isll | NumberFormat">
<a-tooltip title="指标说明" slot="action">
<a-icon type="info-circle-o" />
</a-tooltip>
<div>
<mini-bar :dataSource="chartData.isll"/>
</div>
<template slot="footer">用户今日受理量：<span>{{ todayISll }}</span></template>
</chart-card>
</a-col>
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
<chart-card :loading="loading" title="用户办结量" :total="cardCount.ibjl | NumberFormat">
<a-tooltip title="指标说明" slot="action">
<a-icon type="info-circle-o" />
</a-tooltip>
<div>
<mini-bar :dataSource="chartData.ibjl"/>
</div>
<template slot="footer">用户今日办结量：<span>{{ todayIBjl }}</span></template>
</chart-card>
</a-col>
</a-row>
<a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
<div class="salesCard">
<a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
<div class="extra-wrapper" slot="tabBarExtraContent">
<div class="extra-item">
<a>今日</a>
<a>本周</a>
<a>本月</a>
<a>本年</a>
</div>
<a-range-picker :style="{width: '256px'}" />
</div>
<a-tab-pane loading="true" tab="受理监管" key="1">
<a-row>
<a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
<bar title="受理量统计" />
</a-col>
<a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
<a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
<div class="item-group">
<a-row>
<a-col :class="'more-btn'" :span="12" v-for="(item,index) in registerTypeList" :key=" 'registerType'+index ">
<a-button @click="goPage(index)" style="margin-bottom:10px" size="small" type="primary" ghost>{{ item.text }}</a-button>
</a-col>
</a-row>
</div>
</a-card>
</a-col>
</a-row>
</a-tab-pane>
<a-tab-pane tab="交互监管" key="2">
<a-row>
<a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
<bar-multid :dataSource="jhjgData" :fields="jhjgFields" title="平台与部门交互量统计"></bar-multid>
</a-col>
<a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
<a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
<div class="item-group">
<a-row>
<a-col :class="'more-btn'" :span="12" v-for="(item,index) in registerTypeList" :key=" 'registerType'+index ">
<a-button @click="goPage(index)" style="margin-bottom:10px" size="small" type="primary" ghost>{{ item.text }}</a-button>
</a-col>
</a-row>
</div>
</a-card>
</a-col>
</a-row>
</a-tab-pane>
<a-tab-pane tab="效率监管" key="3">
<a-row>
<a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
<line-chart-multid :dataSource="xljgData" :fields="xljgFields" title="平台与部门交互效率统计"></line-chart-multid>
</a-col>
<a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
<a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
<div class="item-group">
<a-row>
<a-col :class="'more-btn'" :span="12" v-for="(item,index) in registerTypeList" :key=" 'registerType'+index ">
<a-button @click="goPage(index)" style="margin-bottom:10px" size="small" type="primary" ghost>{{ item.text }}</a-button>
</a-col>
</a-row>
</div>
</a-card>
</a-col>
</a-row>
</a-tab-pane>
<a-tab-pane tab="存储监管" key="4">
<a-row>
<a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
<a-row>
<template v-if="diskInfo && diskInfo.length>0">
<a-col :span="12" v-for="(item,index) in diskInfo" :key=" 'diskInfo'+index ">
<dash-chart-demo :title="item.name" :dataSource="item.restPPT"></dash-chart-demo>
</a-col>
</template>
</a-row>
</a-col>
<a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
<a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
<div class="item-group">
<a-row>
<a-col :class="'more-btn'" :span="10" v-for="(item,index) in registerTypeList" :key=" 'registerType'+index ">
<a-button @click="goPage(index)" style="margin-bottom:10px" size="small" type="primary" ghost>{{ item.text }}</a-button>
</a-col>
</a-row>
</div>
</a-card>
</a-col>
</a-row>
</a-tab-pane>
</a-tabs>
</div>
</a-card>
<a-row :gutter="12">
<a-card :loading="loading" :class="{ 'anty-list-cust':true }" :bordered="false" :style="{ marginTop: '24px' }">
<a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
<div class="extra-wrapper" slot="tabBarExtraContent">
<a-radio-group defaultValue="1">
<a-radio-button value="1">转移登记</a-radio-button>
<a-radio-button value="2">抵押登记</a-radio-button>
</a-radio-group>
</div>
<a-tab-pane loading="true" tab="业务流程限时监管" key="1">
<a-table :dataSource="dataSource1" size="default" rowKey="id" :columns="columns" :pagination="ipagination">
<template slot="flowRate" slot-scope="text, record, index">
<a-progress :percent="getFlowRateNumber(record.flowRate)" style="width:80px" />
</template>
</a-table>
</a-tab-pane>
<a-tab-pane loading="true" tab="业务节点限时监管" key="2">
<a-table :dataSource="dataSource2" size="default" rowKey="id" :columns="columns2" :pagination="ipagination">
<template slot="flowRate" slot-scope="text, record, index">
<span style="color: red;">{{ record.flowRate }}分钟</span>
</template>
</a-table>
</a-tab-pane>
</a-tabs>
</a-card>
</a-row>
</div>
</template>
<script>
import ChartCard from '@/components/ChartCard'
import ACol from "ant-design-vue/es/grid/Col"
import ATooltip from "ant-design-vue/es/tooltip/Tooltip"
import MiniArea from '@/components/chart/MiniArea'
import MiniBar from '@/components/chart/MiniBar'
import LineChartMultid from '@/components/chart/LineChartMultid'
import AreaChartTy from '@/components/chart/AreaChartTy'
import DashChartDemo from '@/components/chart/DashChartDemo'
import BarMultid from '@/components/chart/BarMultid'
import MiniProgress from '@/components/chart/MiniProgress'
import RankList from '@/components/chart/RankList'
import Bar from '@/components/chart/Bar'
import Trend from '@/components/Trend'
import { getAction } from '@/api/manage'
import { filterObj } from '@/utils/util'
import moment from 'dayjs'
const rankList = []
for (let i = 0; i < 7; i++) {
rankList.push({
name: '白鹭岛 ' + (i+1) + ' 号店',
total: 1234.56 - i * 100
})
}
const dataCol1 = [{
title: '业务号',
align:"center",
dataIndex: 'reBizCode'
},{
title: '权利类型',
align:"center",
dataIndex: 'droitType'
},{
title: '登记类型',
align:"center",
dataIndex: 'registeType'
},{
title: '座落',
align:"center",
dataIndex: 'beLocated'
},{
title: '权利人',
align:"center",
dataIndex: 'qlr'
},{
title: '义务人',
align:"center",
dataIndex: 'ywr'
},{
title: '受理人',
align:"center",
dataIndex: 'acceptBy'
},{
title: '受理时间',
align:"center",
dataIndex: 'acceptDate'
},{
title: '当前节点',
align:"center",
dataIndex: 'curNode'
},{
title: '办理进度',
align:"center",
dataIndex: 'flowRate',
scopedSlots: { customRender: 'flowRate' }
}];
const dataCol2 = [{
title: '业务号',
align:"center",
dataIndex: 'reBizCode'
},{
title: '权利类型',
align:"center",
dataIndex: 'droitType'
},{
title: '登记类型',
align:"center",
dataIndex: 'registeType'
},{
title: '座落',
align:"center",
dataIndex: 'beLocated'
},{
title: '权利人',
align:"center",
dataIndex: 'qlr'
},{
title: '义务人',
align:"center",
dataIndex: 'ywr'
},{
title: '受理人',
align:"center",
dataIndex: 'acceptBy'
},{
title: '发起时间',
align:"center",
dataIndex: 'acceptDate'
},{
title: '当前节点',
align:"center",
dataIndex: 'curNode'
},{
title: '超时时间',
align:"center",
dataIndex: 'flowRate',
scopedSlots: { customRender: 'flowRate' }
}];
const jhjgData = [
{ type: '房管', '一月': 900, '二月': 1120, '三月': 1380, '四月': 1480, '五月': 1450, '六月': 1100, '七月':1300, '八月':900,'九月':1000 ,'十月':1200 ,'十一月':600 ,'十二月':900 },
{ type: '税务', '一月':1200, '二月': 1500, '三月': 1980, '四月': 2000, '五月': 1000, '六月': 600, '七月':900, '八月':1100,'九月':1300 ,'十月':2000 ,'十一月':900 ,'十二月':1100 },
{ type: '不动产', '一月':2000, '二月': 1430, '三月': 1300, '四月': 1400, '五月': 900, '六月': 500, '七月':600, '八月':1000,'九月':600 ,'十月':1000 ,'十一月':1500 ,'十二月':1200 }
]
const jhjgFields=[
'一月','二月','三月','四月','五月','六月',
'七月','八月','九月','十月','十一月','十二月'
]
const xljgData = [
{type:'一月',"房管":1.12,"税务":1.55,"不动产":1.2},
{type:'二月',"房管":1.65,"税务":1.32,"不动产":1.42},
{type:'三月',"房管":1.85,"税务":1.1,"不动产":1.5},
{type:'四月',"房管":1.33,"税务":1.63,"不动产":1.4},
{type:'五月',"房管":1.63,"税务":1.8,"不动产":1.7},
{type:'六月',"房管":1.85,"税务":1.98,"不动产":1.8},
{type:'七月',"房管":1.98,"税务":1.5,"不动产":1.76},
{type:'八月',"房管":1.48,"税务":1.2,"不动产":1.3},
{type:'九月',"房管":1.41,"税务":1.9,"不动产":1.6},
{type:'十月',"房管":1.1,"税务":1.1,"不动产":1.4},
{type:'十一月',"房管":1.85,"税务":1.6,"不动产":1.5},
{type:'十二月',"房管":1.5,"税务":1.4,"不动产":1.3}
]
const xljgFields=["房管","税务","不动产"]
export default {
name: "Analysis",
components: {
ATooltip,
ACol,
ChartCard,
MiniArea,
MiniBar,
MiniProgress,
RankList,
Bar,
Trend,
LineChartMultid,
AreaChartTy,
DashChartDemo,
BarMultid
},
data() {
return {
xljgData,
xljgFields,
jhjgData,
jhjgFields,
loading: true,
rankList,
zsll:0,
zbjl:0,
todaySll:0,
todayBjl:0,
todayISll:0,
todayIBjl:0,
registerTypeList:[{
text:"业务受理"
},{
text:"业务管理"
},{
text:"文件管理"
},{
text:"信息查询"
}],
// 分页参数
ipagination:{
current: 1,
pageSize: 5,
pageSizeOptions: ['10', '20', '30'],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条"
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
//数据集
dataSource:[],
dataSource1:[],
dataSource2:[],
url:{
analysis:"/sps/register/analysis",
list:"sps/register/virtualList",
countSll:"sps/register/sllTenDaysCount",
countBjl:"sps/register/bjlTenDaysCount",
countISll:'sps/register/ISllTenDaysCount',
countIBjl:'sps/register/IBjlTenDaysCount',
queryDiskInfo:'api/queryDiskInfo'
},
chartData:{
sll:[],
bjl:[],
isll:[],
ibjl:[]
},
cardCount:{
sll:0,
bjl:0,
isll:0,
ibjl:0
},
columns:dataCol1,
columns2:dataCol2,
diskInfo:[]
}
},
methods:{
goPage(index){
if(index==0){
this.$router.push({
path: '/isps/registerStepForm',
name: 'isps-registerStepForm',
});
}else if(index==1){
this.$router.push({
path: '/isps/registerList',
name: 'isps-registerList',
});
}else if(index==2){
this.$router.push({
path: '/isps/fileManage',
name: 'isps-fileManage',
});
}else if(index==3){
this.$router.push({
path: '/isps/infoSearch',
name: 'isps-infoSearch',
});
}
},
loadList (arg){
if(arg===1){
this.ipagination.current = 1;
}
var params = this.getQueryParams();//查询条件
getAction(this.url.list,params).then((res)=>{
console.log("dsdsd",res.result)
this.dataSource1 = res.result.data1;
this.dataSource2 = res.result.data2;
this.ipagination.total = 5;
});
},
getQueryParams(){
var param = {flowStatus:"-3"};
param.pageNo = this.ipagination.current;
param.pageSize = this.ipagination.pageSize;
return filterObj(param);
},
formatRespectiveHoldCert(value){
return (value=="1"||eval(value))?"是":"否"
},
formatCertFormat(value){
if(value=="1"){
return "单一版"
}else if(value=="2"){
return "集成版"
}else{
return value;
}
},
getFlowRateNumber(value){
return Number(value)
},
getFlowPercent(record){
if(record.flowStatus=="3"){
return 100
}else if(record.flowStatus=="0"){
return 0
}else{
return record.flowRate
}
},
getFlowStatus(status){
if(status=="4"){
return "exception";
}else if(status=="0"){
return "normal";
}else if(status=="3"){
return "success";
}else{
return "active";
}
},
queryCount(){
getAction(this.url.analysis).then((res)=>{
if(res.success){
this.cardCount = res.result
}
console.log(res);
});
},
loadDiskInfo(){
getAction(this.url.queryDiskInfo).then((res)=>{
if(res.success){
console.log(res.result)
let one=0,two="";
for(let a in res.result){
let tempNum = Number(res.result[a].max)
if(tempNum>one){
one = tempNum
two = res.result[a].name
}
}
let ontItem = res.result.filter((item)=>{return item.name == two})[0]
ontItem.restPPT = ontItem.restPPT/10
this.diskInfo.push(ontItem);
if(res.result.length>1){
let one2=0,two2="";
for(let a in res.result){
if(res.result[a].name == two){
continue;
}
let tempNum = Number(res.result[a].max)
if(tempNum>one2){
one2 = tempNum
two2 = res.result[a].name
}
}
let one2Item = res.result.filter((item)=>{return item.name == two2})[0]
one2Item.restPPT = one2Item.restPPT/10
this.diskInfo.push(one2Item);
}
}else{
console.log(res.message)
}
})
},
loadChartData(){
getAction(this.url.countSll).then((res)=>{
if(res.success){
let map = res.result;
for(var key in map){
let dataStr = key;
let value = map[key];
let today = moment(new Date()).format('YYYY-MM-DD');
if(dataStr == today){
this.todaySll = map[today];
}
this.chartData.sll.push({
x: dataStr,
y: value
});
}
}
}),
getAction(this.url.countBjl).then((res)=>{
if(res.success){
let map = res.result;
for(var key in map){
let dataStr = key;
let value = map[key];
let today = moment(new Date()).format('YYYY-MM-DD');
if(dataStr == today){
this.todayBjl = map[today];
}
this.chartData.bjl.push({
x: dataStr,
y: value
});
}
}
}),
getAction(this.url.countISll).then((res)=>{
if(res.success){
let map = res.result;
for(var key in map){
let dataStr = key;
let value = map[key];
let today = moment(new Date()).format('YYYY-MM-DD');
if(dataStr == today){
this.todayISll = map[today];
}
this.chartData.isll.push({
x: key,
y: value
});
}
}
}),
getAction(this.url.countIBjl).then((res)=>{
if(res.success){
let map = res.result;
for(var key in map){
let dataStr = key;
let value = map[key];
let today = moment(new Date()).format('YYYY-MM-DD');
if(dataStr == today){
this.todayIBjl = map[today];
}
this.chartData.ibjl.push({
x: key,
y: value
});
}
}
})
}
},
created() {
this.loadDiskInfo()
this.queryCount();
this.loadChartData();
this.loadList(1);
setTimeout(() => {
this.loading = !this.loading
}, 1000)
}
}
</script>
<style lang="scss" scoped>
.extra-wrapper {
line-height: 55px;
padding-right: 24px;
.extra-item {
display: inline-block;
margin-right: 24px;
a {
margin-left: 24px;
}
}
}
.item-group {
padding: 20px 0 8px 24px;
font-size: 0;
a {
color: rgba(0, 0, 0, 0.65);
display: inline-block;
font-size: 14px;
margin-bottom: 13px;
width: 25%;
}
}
.item-group {
.more-btn {
margin-bottom: 13px;
text-align: center;
}
}
.list-content-item {
color: rgba(0, 0, 0, .45);
display: inline-block;
vertical-align: middle;
font-size: 14px;
margin-left: 40px;
}
@media only screen and (min-width: 1600px) {
.list-content-item{
margin-left:60px;
}
}
@media only screen and (max-width: 1300px) {
.list-content-item{
margin-left:20px;
}
.width-hidden4{
display:none
}
}
.list-content-item{
span{line-height: 20px;}
}
.list-content-item{
p{margin-top: 4px;margin-bottom:0;line-height:22px;}
}
.anty-list-cust {
.ant-list-item-meta{flex: 0.3 !important;}
}
.anty-list-cust {
.ant-list-item-content{flex:1 !important; justify-content:flex-start !important;margin-left: 20px;}
}
</style>

315
ant-design-jeecg-vue/src/views/jeecg/report/ArchivesStatisticst.vue Normal file
View File

@ -0,0 +1,315 @@
<template>
<a-card :bordered="false">
<a-tabs defaultActiveKey="1" @change="callback">
<a-tab-pane tab="柱状图" key="1">
<a-row :gutter="24">
<a-col :span="10">
<a-radio-group :value="barType" @change="statisticst">
<a-radio-button value="year">按年统计</a-radio-button>
<a-radio-button value="month">按月统计</a-radio-button>
<a-radio-button value="category">按类别统计</a-radio-button>
<a-radio-button value="cabinet">按柜号统计</a-radio-button>
</a-radio-group>
</a-col>
<a-col :span="14">
<a-form v-if="barType === 'month'" layout="inline" style="margin-top: -4px">
<a-form-item label="月份区间">
<a-range-picker
:placeholder="['开始月份', '结束月份']"
format="YYYY-MM"
:value="barValue"
:mode="barDate"
@panelChange="handleBarDate"/>
</a-form-item>
<a-button style="margin-top: 2px" type="primary" icon="search" @click="queryDatebar">查询</a-button>
<a-button style="margin-top: 2px;margin-left: 8px" type="primary" icon="reload" @click="searchReset">重置</a-button>
</a-form>
</a-col>
<bar class="statistic" title="档案统计" :dataSource="countSource"/>
</a-row>
</a-tab-pane>
<a-tab-pane tab="饼状图" key="2">
<a-row :gutter="24">
<a-col :span="10">
<a-radio-group :value="pieType" @change="statisticst">
<a-radio-button value="year">按年统计</a-radio-button>
<a-radio-button value="month">按月统计</a-radio-button>
<a-radio-button value="category">按类别统计</a-radio-button>
<a-radio-button value="cabinet">按柜号统计</a-radio-button>
</a-radio-group>
</a-col>
<a-col :span="14">
<a-form v-if="pieType === 'month'" layout="inline" style="margin-top: -4px">
<a-row :gutter="24">
<a-form-item label="月份区间">
<a-range-picker
:placeholder="['开始月份', '结束月份']"
format="YYYY-MM"
:value="pieValue"
:mode="pieDate"
@panelChange="handlePieDate"/>
</a-form-item>
<a-button style="margin-top: 2px" type="primary" icon="search" @click="queryDatepie">查询</a-button>
<a-button style="margin-top: 2px;margin-left: 8px" type="primary" icon="reload" @click="searchReset">重置</a-button>
</a-row>
</a-form>
</a-col>
<pie class="statistic" title="档案统计" :dataSource="countSource"/>
</a-row>
</a-tab-pane>
</a-tabs>
</a-card>
</template>
<script>
import Bar from '@/components/chart/Bar'
import Pie from '@/components/chart/Pie'
import ACol from 'ant-design-vue/es/grid/Col'
import { getAction } from '@/api/manage'
export default {
name: 'ArchivesStatisticst',
components: {
ACol,
Bar,
Pie
},
data() {
return {
description: '档案统计页面',
// 查询条件
queryParam: {},
// 数据集
countSource: [],
// 柱状图
barType: 'year',
barDate: ['month', 'month'],
barValue: [],
// 饼状图
pieType: 'year',
pieDate: ['month', 'month'],
pieValue: [],
// 统计图类型
tabStatus:"bar",
url: {
getYearCountInfo: "/api/report/getYearCountInfo",
getMonthCountInfo:"/api/report/getMonthCountInfo",
getCntrNoCountInfo:"/api/report/getCntrNoCountInfo",
getCabinetCountInfo:"/api/report/getCabinetCountInfo",
},
}
},
created() {
let url = this.url.getYearCountInfo;
this.loadDate(url,'year',{});
},
methods: {
loadDate(url,type,param) {
getAction(url,param,'get').then((res) => {
if (res.success) {
this.countSource = [];
if(type === 'year'){
this.getYearCountSource(res.result);
}
if(type === 'month'){
this.getMonthCountSource(res.result);
}
if(type === 'category'){
this.getCategoryCountSource(res.result);
}
if(type === 'cabinet'){
this.getCabinetCountSource(res.result);
}
}else{
var that=this;
that.$message.warning(res.message);
}
})
},
getYearCountSource(data){
for (let i = 0; i < data.length; i++) {
if(this.tabStatus === "bar"){
this.countSource.push({
x: `${data[i].year}年`,
y: data[i].yearcount
})
}else{
this.countSource.push({
item: `${data[i].year}年`,
count:data[i].yearcount
})
}
}
},
getMonthCountSource(data){
for (let i = 0; i < data.length; i++) {
if(this.tabStatus === "bar"){
this.countSource.push({
x: data[i].month,
y: data[i].monthcount
})
}else{
this.countSource.push({
item: data[i].month,
count:data[i].monthcount
})
}
}
},
getCategoryCountSource(data){
for (let i = 0; i < data.length; i++) {
if(this.tabStatus ==="bar"){
this.countSource.push({
x: data[i].classifyname,
y: data[i].cntrnocount
})
}else{
this.countSource.push({
item: data[i].classifyname,
count:data[i].cntrnocount
})
}
}
},
getCabinetCountSource(data){
for (let i = 0; i < data.length; i++) {
if(this.tabStatus === "bar"){
this.countSource.push({
x: data[i].cabinetname,
y: data[i].cabinetcocunt
})
}else{
this.countSource.push({
item: data[i].cabinetname,
count:data[i].cabinetcocunt
})
}
}
},
// 选择统计图类别
callback(key) {
if(key === "1"){
this.tabStatus = "bar";
this.queryDatebar();
}else{
this.tabStatus = "pie";
this.queryDatepie();
}
},
// 选择统计类别
statisticst(e) {
if(this.tabStatus === "pie"){
this.pieType = e.target.value;
this.queryDatepie();
}else{
this.barType = e.target.value;
this.queryDatebar();
}
},
// 按月份查询
queryDatebar(){
if(this.barValue.length>0){
this.getUrl(this.barType,{startTime:this.barValue[0]._d,endTime:this.barValue[1]._d});
}else{
this.getUrl(this.barType,{});
}
},
queryDatepie(){
if(this.pieValue.length>0){
this.getUrl(this.pieType,{startTime:this.pieValue[0]._d,endTime:this.pieValue[1]._d});
}else{
this.getUrl(this.pieType,{});
}
},
searchReset(){
console.log(this.tabStatus);
if(this.tabStatus === "pie"){
this.pieValue = [];
}else{
this.barValue = [];
}
this.getUrl(this.barType,{});
},
// 选择请求url
getUrl(type,param){
let url = "";
if(type === 'year'){
url = this.url.getYearCountInfo;
}
if(type === 'month'){
url = this.url.getMonthCountInfo;
}
if(type === 'category'){
url = this.url.getCntrNoCountInfo;
}
if(type === 'cabinet'){
url = this.url.getCabinetCountInfo;
}
this.loadDate(url,type,param);
},
// 选择月份日期
handleBarDate(value, mode) {
this.barValue = value
this.barDate = [
mode[0] === 'date' ? 'month' : mode[0],
mode[1] === 'date' ? 'month' : mode[1]
]
},
handlePieDate(value, mode) {
this.pieValue = value
this.pieDate = [
mode[0] === 'date' ? 'month' : mode[0],
mode[1] === 'date' ? 'month' : mode[1]
]
},
}
}
</script>
<style scoped>
.ant-card-body .table-operator {
margin-bottom: 18px;
}
.ant-table-tbody .ant-table-row td {
padding-top: 15px;
padding-bottom: 15px;
}
.anty-row-operator button {
margin: 0 5px
}
.ant-btn-danger {
background-color: #ffffff
}
.ant-modal-cust-warp {
height: 100%
}
.ant-modal-cust-warp .ant-modal-body {
height: calc(100% - 110px) !important;
overflow-y: auto
}
.ant-modal-cust-warp .ant-modal-content {
height: 90% !important;
overflow-y: hidden
}
.statistic {
padding: 0px !important;
margin-top: 50px;
}
.statistic h4 {
margin-bottom: 20px;
text-align: center !important;
font-size: 24px !important;;
}
.statistic #canvas_1 {
width: 100% !important;
}
</style>

136
ant-design-jeecg-vue/src/views/jeecg/report/ViserChartDemo.vue Normal file
View File

@ -0,0 +1,136 @@
<template>
<a-card :bordered="false">
<a-tabs defaultActiveKey="1">
<!-- 柱状图 -->
<a-tab-pane tab="柱状图" key="1">
<bar title="销售额排行" :dataSource="barData" :height="height"/>
</a-tab-pane>
<!-- 多列柱状图 -->
<a-tab-pane tab="多列柱状图" key="2">
<bar-multid title="多列柱状图" :height="height"/>
</a-tab-pane>
<!-- 迷你柱状图 -->
<a-tab-pane tab="迷你柱状图" key="3">
<mini-bar :dataSource="barData" :width="400" :height="200"/>
</a-tab-pane>
<!-- 面积图 -->
<a-tab-pane tab="面积图" key="4">
<area-chart-ty title="销售额排行" :dataSource="areaData" x="月份" y="销售额" :height="height"/>
</a-tab-pane>
<!-- 迷你面积图 -->
<a-tab-pane tab="迷你面积图" key="5">
<div style="padding-top: 100px;width:600px;height:200px">
<mini-area :dataSource="areaData" x="月份" y="销售额" :height="height"/>
</div>
</a-tab-pane>
<!-- 多行折线图 -->
<a-tab-pane tab="多行折线图" key="6">
<line-chart-multid title="多行折线图" :height="height"/>
</a-tab-pane>
<!-- 饼图 -->
<a-tab-pane tab="饼图" key="7">
<pie title="饼图" :height="height"/>
</a-tab-pane>
<!-- 雷达图 -->
<a-tab-pane tab="雷达图" key="8">
<radar title="雷达图" :height="height"/>
</a-tab-pane>
<!-- 仪表盘 -->
<a-tab-pane tab="仪表盘" key="9">
<dash-chart-demo title="仪表盘" :value="9" :height="height"/>
</a-tab-pane>
<!-- 进度条 -->
<a-tab-pane tab="进度条" key="10">
<mini-progress :percentage="30" :target="40" :height="30"/>
<mini-progress :percentage="51" :target="60" :height="30" color="#FFA500"/>
<mini-progress :percentage="66" :target="80" :height="30" color="#1E90FF"/>
<mini-progress :percentage="74" :target="70" :height="30" color="#FF4500"/>
<mini-progress :percentage="92" :target="100" :height="30" color="#49CC49"/>
</a-tab-pane>
<!-- 排名列表 -->
<a-tab-pane tab="排名列表" key="11">
<rank-list title="门店销售排行榜" :list="rankList" style="width: 600px;margin: 0 auto;"/>
</a-tab-pane>
<!-- TransferBar -->
<a-tab-pane tab="TransferBar" key="12">
<transfer-bar title="年度消耗流量一览表" :data="barData" x="月份" y="流量(Mb)" :height="height"/>
</a-tab-pane>
<!-- Trend -->
<a-tab-pane tab="Trend" key="13">
<trend title="Trend" term="Trend：" :percentage="30"/>
</a-tab-pane>
<!-- Liquid -->
<a-tab-pane tab="Liquid" key="14">
<liquid :height="height"/>
</a-tab-pane>
</a-tabs>
</a-card>
</template>
<script>
import AreaChartTy from '@/components/chart/AreaChartTy'
import Bar from '@/components/chart/Bar'
import BarMultid from '@/components/chart/BarMultid'
import DashChartDemo from '@/components/chart/DashChartDemo'
import LineChartMultid from '@/components/chart/LineChartMultid'
import Liquid from '@/components/chart/Liquid'
import MiniBar from '@/components/chart/MiniBar'
import MiniArea from '@/components/chart/MiniArea'
import MiniProgress from '@/components/chart/MiniProgress'
import Pie from '@/components/chart/Pie'
import Radar from '@/components/chart/Radar'
import RankList from '@/components/chart/RankList'
import TransferBar from '@/components/chart/TransferBar'
import Trend from '@/components/chart/Trend'
export default {
name: 'ViserChartDemo',
components: {
Bar, MiniBar, BarMultid, AreaChartTy, LineChartMultid,
Pie, Radar, DashChartDemo, MiniProgress, RankList,
TransferBar, Trend, Liquid, MiniArea
},
data() {
return {
height: 420,
rankList: [],
barData: [],
areaData: []
}
},
created() {
setTimeout(() => {
this.loadBarData()
this.loadAreaData()
this.loadRankListData()
}, 100)
},
methods: {
loadData(x, y, max, min, before = '', after = '月') {
let data = []
for (let i = 0; i < 12; i += 1) {
data.push({
[x]: `${before}${i + 1}${after}`,
[y]: Math.floor(Math.random() * max) + min
})
}
return data
},
// 加载柱状图数据
loadBarData() {
this.barData = this.loadData('x', 'y', 1000, 200)
},
// 加载AreaChartTy的数据
loadAreaData() {
this.areaData = this.loadData('x', 'y', 500, 100)
},
loadRankListData() {
this.rankList = this.loadData('name', 'total', 2000, 100, '北京朝阳 ', ' 号店')
}
}
}
</script>
<style scoped>
</style>

212
ant-design-jeecg-vue/src/views/jeecg/tablist/JeecgOrderCustomerList.vue
View File

@ -2,14 +2,19 @@
<a-card :bordered="false">
<!-- 操作按钮区域 -->
<div class="table-operator">
<div class="table-operator" :md="24" :sm="24" style="margin: -25px 0px 10px 0px">
<a-button @click="handleAdd" type="primary" icon="plus">新增</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-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-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
</div>
@ -22,7 +27,7 @@
<a-table
ref="table"
size="default"
size="middle"
bordered
rowKey="id"
:columns="columns"
@ -34,13 +39,13 @@
<span slot="action" slot-scope="text, record">
<a @click="handleEdit(record)">编辑</a>
<a-divider type="vertical" />
<a-divider type="vertical"/>
<a-dropdown>
<a class="ant-dropdown-link">
更多 <a-icon type="down" />
更多 <a-icon type="down"/>
</a>
<a-menu slot="overlay">
<a-menu-item >
<a-menu-item>
<a href="javascript:;" @click="handleDetail(record)">详情</a>
</a-menu-item>
<a-menu-item>
@ -55,238 +60,101 @@
</div>
<!-- table区域-end -->
<!-- 表单区域 -->
<jeecgOrderCustomer-modal ref="JeecgOrderCustomerModal" @ok="modalFormOk"></jeecgOrderCustomer-modal>
<jeecgOrderCustomer-modal ref="modalForm" @ok="modalFormOk"></jeecgOrderCustomer-modal>
</a-card>
</template>
<script>
import JeecgOrderCustomerModal from './form/JeecgOrderCustomerModal'
import { filterObj } from '@/utils/util'
import { deleteAction,getAction } from '@/api/manage'
import JeecgOrderDMainList from './JeecgOrderDMainList'
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
import {getAction} from '@/api/manage'
export default {
name: "JeecgOrderCustomerList",
mixins: [JeecgListMixin],
components: {
JeecgOrderDMainList,
JeecgOrderCustomerModal
},
data () {
data() {
return {
description: '订单客户信息',
// 查询条件
queryParam: {
orderId:null,
},
// 表头
columns: [
{
title: '客户名',
align:"center",
align: "center",
width: 100,
dataIndex: 'name',
key: 'name',
fixed: 'left'
},
{
title: '性别',
align:"center",
align: "center",
dataIndex: 'sex',
customRender:function (text) {
if(text==1){
customRender: function (text) {
if (text == 1) {
return "男";
}else if(text==2){
} else if (text == 2) {
return "女";
}else{
} else {
return text;
}
}
},
{
title: '身份证号码',
align:"center",
align: "center",
dataIndex: 'idcard',
},
{
title: '电话',
dataIndex: 'telphone',
align:"center",
align: "center",
},
{
title: '操作',
key: 'operation',
align: 'center',
fixed: 'right',
width: 130,
scopedSlots: { customRender: 'action' },
scopedSlots: {customRender: 'action'},
},
],
//数据集
dataSource:[],
// 分页参数
ipagination:{
current: 1,
pageSize: 10,
pageSizeOptions: ['10', '20', '30'],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条"
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
isorter:{
column: 'createTime',
order: 'desc',
},
loading:false,
selectedRowKeys: [],
selectedRows: [],
url: {
list: "/test/order/queryOrderCustomerListByMainId",
list: "/test/order/listOrderCustomerByMainId",
delete: "/test/order/deleteCustomer",
deleteBatch: "/test/order/deleteBatchCustomer",
},
}
}
},
created() {
this.loadData();
},
methods: {
loadData (arg){
//加载数据 若传入参数1则加载第一页的内容
if(arg===1){
loadData(arg) {
if (arg === 1) {
this.ipagination.current = 1;
}
var params = this.getQueryParams();//查询条件
getAction(this.url.list,{id:params.orderId}).then((res)=>{
if(res.success){
var params = this.getQueryParams();
getAction(this.url.list, {mainId: params.mainId}).then((res) => {
if (res.success) {
this.dataSource = res.result;
/*
this.ipagination.total = res.result.total;
*/
}else{
} else {
this.dataSource = null;
/* this.ipagination.total = 0;*/
}
})
},
getQueryParams(){
var param = Object.assign({}, this.queryParam,this.isorter);
param.orderId = this.queryParam.orderId;
param.field = this.getQueryField();
param.pageNo = this.ipagination.current;
param.pageSize = this.ipagination.pageSize;
return filterObj(param);
},
getQueryField(){
//TODO 字段权限控制
var str = "id,";
for(var a = 0;a<this.columns.length;a++){
str+=","+this.columns[a].dataIndex;
}
return str;
},
onSelectChange (selectedRowKeys,selectionRows) {
this.selectedRowKeys = selectedRowKeys;
this.selectionRows = selectionRows;
},
onClearSelected(){
this.selectedRowKeys = [];
this.selectionRows = [];
},
searchQuery(){
getOrderMain(orderId) {
this.queryParam.mainId = orderId;
this.loadData(1);
},
searchReset(){
var that = this;
for(var a in that.queryParam){
that.queryParam[a] = '';
}
that.loadData(1);
handleAdd: function () {
this.$refs.modalForm.add(this.queryParam.mainId);
this.$refs.modalForm.title = "添加客户信息";
},
batchDel: function(){
if(this.selectedRowKeys.length<=0){
this.$message.warning('请选择一条记录！');
return ;
}else{
var ids = "";
for(var a =0;a<this.selectedRowKeys.length;a++){
ids+=this.selectedRowKeys[a]+",";
}
var that = this;
this.$confirm({
title:"确认删除",
content:"是否删除选中数据?",
onOk: function(){
deleteAction(that.url.deleteBatch,{ids: ids}).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.loadData();
that.onClearSelected();
}else{
that.$message.warning(res.message);
}
});
}
});
}
},
handleDelete: function(id){
var that = this;
this.$confirm({
title:"确认删除",
content:"是否删除选中数据?",
onOk: function(){
deleteAction(that.url.delete,{id: id}).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.loadData();
}else{
that.$message.warning(res.message);
}
});
}
});
},
handleEdit: function(record){
this.$refs.JeecgOrderCustomerModal.edit(record,'e');
this.$refs.JeecgOrderCustomerModal.title="编辑";
},
handleAdd: function(){
this.$refs.JeecgOrderCustomerModal.add(this.queryParam.orderId);
this.$refs.JeecgOrderCustomerModal.title="添加客户信息";
},
handleDetail: function(record){
this.$refs.JeecgOrderCustomerModal.detail(record);
this.$refs.JeecgOrderCustomerModal.title="添加客户信息";
},
handleTableChange(pagination, filters, sorter){
//分页、排序、筛选变化时触发
console.log(sorter);
//TODO 筛选
if (Object.keys(sorter).length>0){
this.isorter.column = sorter.field;
this.isorter.order = "ascend"==sorter.order?"asc":"desc"
}
this.ipagination = pagination;
this.loadData();
},
modalFormOk () {
// 新增/修改 成功时，重载列表
this.loadData();
},
getOrderMain(orderId){
this.queryParam.orderId = orderId.toString();
this.loadData(1);
}
}
}
</script>
<style scoped>
.ant-card{
.ant-card {
margin-left: -30px;
margin-right: -30px;
}

255
ant-design-jeecg-vue/src/views/jeecg/tablist/JeecgOrderDMainList.vue
View File

@ -6,21 +6,21 @@
<a-form layout="inline">
<a-row :gutter="24">
<a-col :span="6">
<a-col :md="6" :sm="24">
<a-form-item label="订单号">
<a-input placeholder="请输入订单号" v-model="queryParam.orderCode"></a-input>
</a-form-item>
</a-col>
<a-col :span="6">
<a-col :md="6" :sm="24">
<a-form-item label="订单类型">
<a-select placeholder="请输入订单类型" v-model="queryParam.ctype">
<a-select placeholder="请输入订单类型" v-model="queryParam.ctype">
<a-select-option value="1">国内订单</a-select-option>
<a-select-option value="2">国际订单</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :span="8" >
<a-col :md="6" :sm="24">
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
@ -38,9 +38,14 @@
<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-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-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
</div>
@ -53,7 +58,7 @@
<a-table
ref="table"
size="default"
size="middle"
bordered
rowKey="id"
filterMultiple="filterMultiple"
@ -68,7 +73,7 @@
<span slot="action" slot-scope="text, record">
<a @click="handleEdit(record)">编辑</a>
<a-divider type="vertical" />
<a-divider type="vertical"/>
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
<a>删除</a>
</a-popconfirm>
@ -88,7 +93,7 @@
</a-tabs>
<!-- 表单区域 -->
<jeecgOrderDMain-modal ref="JeecgOrderDMainModal" @ok="modalFormOk"></jeecgOrderDMain-modal>
<jeecgOrderDMain-modal ref="modalForm" @ok="modalFormOk"></jeecgOrderDMain-modal>
</a-card>
</template>
@ -97,13 +102,14 @@
import JeecgOrderDMainModal from './form/JeecgOrderDMainModal'
import JeecgOrderCustomerList from './JeecgOrderCustomerList'
import JeecgOrderTicketList from './JeecgOrderTicketList'
import { filterObj } from '@/utils/util'
import { deleteAction,getAction } from '@/api/manage'
import {deleteAction} from '@/api/manage'
import JeecgOrderCustomerModal from './form/JeecgOrderCustomerModal'
import JeecgOrderTicketModal from './form/JeecgOrderTicketModal'
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
export default {
name: "JeecgOrderDMainList",
mixins: [JeecgListMixin],
components: {
JeecgOrderTicketModal,
JeecgOrderCustomerModal,
@ -111,30 +117,40 @@
JeecgOrderCustomerList,
JeecgOrderTicketList,
},
data () {
data() {
return {
description: '订单管理页面',
// 查询条件
queryParam: {},
/* 分页参数 */
ipagination:{
current: 1,
pageSize: 5,
pageSizeOptions: ['5', '10', '20'],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条"
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
// 表头
columns: [ {
columns: [{
title: '#',
dataIndex: '',
key:'rowIndex',
width:60,
align:"center",
customRender:function (t,r,index) {
return parseInt(index)+1;
key: 'rowIndex',
width: 60,
align: "center",
customRender: function (t, r, index) {
return parseInt(index) + 1;
}
},
{
title: '订单号',
align:"center",
align: "center",
dataIndex: 'orderCode'
},
{
title: '订单类型',
align:"center",
align: "center",
dataIndex: 'ctype',
customRender: (text) => {
let re = "";
@ -148,47 +164,27 @@
},
{
title: '订单日期',
align:"center",
align: "center",
dataIndex: 'orderDate'
},
{
title: '订单金额',
align:"center",
align: "center",
dataIndex: 'orderMoney'
},
{
title: '订单备注',
align:"center",
align: "center",
dataIndex: 'content'
},
{
title: '操作',
dataIndex: 'action',
align:"center",
scopedSlots: { customRender: 'action' },
align: "center",
scopedSlots: {customRender: 'action'},
}],
//数据集
dataSource:[],
// 分页参数
type: "radio",
ipagination:{
current: 1,
pageSize: 10,
pageSizeOptions: ['10', '20', '30'],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条"
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
isorter:{
column: 'createTime',
order: 'desc',
},
loading:false,
selectedRowKeys: [],
selectedRows: [],
url: {
list: "/test/order/orderList",
delete: "/test/order/delete",
@ -196,152 +192,93 @@
},
}
},
created() {
this.loadData();
},
methods: {
loadData (arg){
//加载数据 若传入参数1则加载第一页的内容
if(arg===1){
this.ipagination.current = 1;
}
var params = this.getQueryParams();//查询条件
getAction(this.url.list,params).then((res)=>{
if(res.success){
this.dataSource = res.result.records;
this.ipagination.total = res.result.total;
}
})
},
getQueryParams(){
var param = Object.assign({}, this.queryParam,this.isorter);
param.field = this.getQueryField();
param.pageNo = this.ipagination.current;
param.pageSize = this.ipagination.pageSize;
return filterObj(param);
},
getQueryField(){
//TODO 字段权限控制
var str = "id,";
for(var a = 0;a<this.columns.length;a++){
str+=","+this.columns[a].dataIndex;
}
return str;
},
clickThenCheck(record){
clickThenCheck(record) {
return {
on: {
click: () => {
this.onSelectChange(record.id.split(","),[record]);
this.onSelectChange(record.id.split(","), [record]);
}
}
};
},
onSelectChange (selectedRowKeys,selectionRows) {
onSelectChange(selectedRowKeys, selectionRows) {
this.selectedRowKeys = selectedRowKeys;
this.selectionRows = selectionRows;
this.$refs.JeecgOrderCustomerList.getOrderMain(this.selectedRowKeys[0]);
this.$refs.JeecgOrderTicketList.getOrderMain(this.selectedRowKeys[0]);
},
onClearSelected(){
onClearSelected() {
this.selectedRowKeys = [];
this.selectionRows = [];
this.$refs.JeecgOrderCustomerList.queryParam.orderId = null;
this.$refs.JeecgOrderTicketList.queryParam.orderId = null;
this.$refs.JeecgOrderCustomerList.queryParam.mainId = null;
this.$refs.JeecgOrderTicketList.queryParam.mainId = null;
this.$refs.JeecgOrderCustomerList.loadData();
this.$refs.JeecgOrderTicketList.loadData();
this.$refs.JeecgOrderCustomerList.selectedRowKeys = [];
this.$refs.JeecgOrderCustomerList.selectionRows = [];
this.$refs.JeecgOrderTicketList.selectedRowKeys = [];
this.$refs.JeecgOrderTicketList.selectionRows = [];
},
searchQuery(){
this.loadData(1);
},
searchReset(){
handleDelete: function (id) {
var that = this;
that.queryParam={};
that.loadData(1);
},
batchDel: function(){
if(this.selectedRowKeys.length<=0){
this.$message.warning('请选择一条记录！');
return ;
}else{
var ids = "";
for(var a =0;a<this.selectedRowKeys.length;a++){
ids+=this.selectedRowKeys[a]+",";
}
var that = this;
this.$confirm({
title:"确认删除",
content:"是否删除选中数据?",
onOk: function(){
deleteAction(that.url.deleteBatch,{ids: ids}).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.loadData();
that.onClearSelected();
this.$refs.JeecgOrderCustomerList.loadData();
this.$refs.JeecgOrderTicketList.loadData();
}else{
that.$message.warning(res.message);
}
});
}
});
}
},
handleDelete: function(id){
var that = this;
deleteAction(that.url.delete,{id: id}).then((res)=>{
if(res.success){
deleteAction(that.url.delete, {id: id}).then((res) => {
if (res.success) {
that.$message.success(res.message);
that.loadData();
this.$refs.JeecgOrderCustomerList.loadData();
this.$refs.JeecgOrderTicketList.loadData();
}else{
} else {
that.$message.warning(res.message);
}
});
},
handleEdit: function(record){
this.$refs.JeecgOrderDMainModal.edit(record);
this.$refs.JeecgOrderDMainModal.title="编辑";
},
handleAdd: function(){
this.$refs.JeecgOrderDMainModal.add();
this.$refs.JeecgOrderDMainModal.title="新增";
},
handleTableChange(pagination, filters, sorter){
//分页、排序、筛选变化时触发
console.log(sorter);
//TODO 筛选
if (Object.keys(sorter).length>0){
this.isorter.column = sorter.field;
this.isorter.order = "ascend"==sorter.order?"asc":"desc"
}
this.ipagination = pagination;
this.loadData();
},
modalFormOk () {
// 新增/修改 成功时，重载列表
searchQuery:function(){
this.selectedRowKeys = [];
this.selectionRows = [];
this.$refs.JeecgOrderCustomerList.queryParam.mainId = null;
this.$refs.JeecgOrderTicketList.queryParam.mainId = null;
this.$refs.JeecgOrderCustomerList.loadData();
this.$refs.JeecgOrderTicketList.loadData();
this.$refs.JeecgOrderCustomerList.selectedRowKeys = [];
this.$refs.JeecgOrderCustomerList.selectionRows = [];
this.$refs.JeecgOrderTicketList.selectedRowKeys = [];
this.$refs.JeecgOrderTicketList.selectionRows = [];
this.loadData();
}
}
}
</script>
<style scoped>
.ant-card-body .table-operator{
.ant-card-body .table-operator {
margin-bottom: 18px;
}
.ant-layout-content{
margin:12px 16px 0 !important;
}
.ant-table-tbody .ant-table-row td{
padding-top:15px;
padding-bottom:15px;
}
.anty-row-operator button{margin: 0 5px}
.ant-btn-danger{background-color: #ffffff}
.ant-modal-cust-warp{height: 100%}
.ant-modal-cust-warp .ant-modal-body{height:calc(100% - 110px) !important;overflow-y: auto}
.ant-modal-cust-warp .ant-modal-content{height:90% !important;overflow-y: hidden}
.ant-table-tbody .ant-table-row td {
padding-top: 15px;
padding-bottom: 15px;
}
.anty-row-operator button {
margin: 0 5px
}
.ant-btn-danger {
background-color: #ffffff
}
.ant-modal-cust-warp {
height: 100%
}
.ant-modal-cust-warp .ant-modal-body {
height: calc(100% - 110px) !important;
overflow-y: auto
}
.ant-modal-cust-warp .ant-modal-content {
height: 90% !important;
overflow-y: hidden
}
</style>

245
ant-design-jeecg-vue/src/views/jeecg/tablist/JeecgOrderTicketList.vue
View File

@ -2,14 +2,19 @@
<a-card :bordered="false">
<!-- 操作按钮区域 -->
<div class="table-operator">
<div class="table-operator" :md="24" :sm="24" style="margin: -25px 0px 10px 2px">
<a-button @click="handleAdd" type="primary" icon="plus">新增</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-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-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
</div>
@ -22,7 +27,7 @@
<a-table
ref="table"
size="default"
size="middle"
bordered
rowKey="id"
:columns="columns"
@ -34,13 +39,13 @@
<span slot="action" slot-scope="text, record">
<a @click="handleEdit(record)">编辑</a>
<a-divider type="vertical" />
<a-divider type="vertical"/>
<a-dropdown>
<a class="ant-dropdown-link">
更多 <a-icon type="down" />
更多 <a-icon type="down"/>
</a>
<a-menu slot="overlay">
<a-menu-item >
<a-menu-item>
<a href="javascript:;" @click="handleDetail(record)">详情</a>
</a-menu-item>
@ -58,216 +63,88 @@
<!-- table区域-end -->
<!-- 表单区域 -->
<JeecgOrderTicket-modal ref="JeecgOrderTicketModal" @ok="modalFormOk"></JeecgOrderTicket-modal>
<JeecgOrderTicket-modal ref="modalForm" @ok="modalFormOk"></JeecgOrderTicket-modal>
</a-card>
</template>
<script>
import { filterObj } from '@/utils/util'
import { deleteAction,getAction } from '@/api/manage'
import JeecgOrderTicketModal from './form/JeecgOrderTicketModal'
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
import {getAction} from '@/api/manage'
export default {
name: "JeecgOrderTicketList",
mixins: [JeecgListMixin],
components: {
JeecgOrderTicketModal,
},
data () {
data() {
return {
description: '机票信息',
// 查询条件
queryParam: {
orderId:null,
},
// 表头
columns: [{
title:'航班号',
align:"center",
dataIndex:'ticketCode'
},{
title:'航班时间',
align:"center",
dataIndex:'tickectDate'
},{
title:'订单号码',
align:"center",
dataIndex:'orderId',
},{
title:'创建人',
align:"center",
dataIndex:'createBy'
},{
title:'创建时间',
align:"center",
dataIndex:'createTime',
sorter:true
},{
title: '操作',
key: 'operation',
fixed:'right',
align:"center",
width:130,
scopedSlots: { customRender: 'action' },
}],
//数据集
dataSource:[],
// 分页参数
ipagination:{
current: 1,
pageSize: 5,
pageSizeOptions: ['5','10', '20'],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条"
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
isorter:{
column: 'createTime',
order: 'asc',
},
loading:false,
selectedRowKeys: [],
selectedRows: [],
title: '航班号',
align: "center",
dataIndex: 'ticketCode'
}, {
title: '航班时间',
align: "center",
dataIndex: 'tickectDate'
}, {
title: '订单号码',
align: "center",
dataIndex: 'orderId',
}, {
title: '创建人',
align: "center",
dataIndex: 'createBy'
}, {
title: '创建时间',
align: "center",
dataIndex: 'createTime',
sorter: true
}, {
title: '操作',
key: 'operation',
align: "center",
width: 130,
scopedSlots: {customRender: 'action'},
}],
url: {
list: "/test/order/queryOrderTicketListByMainId",
list: "/test/order/listOrderTicketByMainId",
delete: "/test/order/deleteTicket",
deleteBatch: "/test/order/deleteBatchTicket",
},
}
}
},
created() {
this.loadData();
},
methods: {
loadData (arg){
//加载数据 若传入参数1则加载第一页的内容
if(arg===1){
loadData(arg) {
if (arg === 1) {
this.ipagination.current = 1;
}
var params = this.getQueryParams();//查询条件
getAction(this.url.list,{id:params.orderId}).then((res)=>{
if(res.success){
var params = this.getQueryParams();
getAction(this.url.list, {mainId: params.mainId}).then((res) => {
if (res.success) {
this.dataSource = res.result;
/* this.ipagination.total = res.result.total;*/
}else{
} else {
this.dataSource = null;
/* this.ipagination.total = 0;*/
}
})
},
getQueryParams(){
var param = Object.assign({}, this.queryParam,this.isorter);
param.field = this.getQueryField();
param.pageNo = this.ipagination.current;
param.pageSize = this.ipagination.pageSize;
return filterObj(param);
},
getQueryField(){
//TODO 字段权限控制
var str = "id,";
for(var a = 0;a<this.columns.length;a++){
str+=","+this.columns[a].dataIndex;
}
return str;
},
onSelectChange (selectedRowKeys,selectionRows) {
this.selectedRowKeys = selectedRowKeys;
this.selectionRows = selectionRows;
},
onClearSelected(){
this.selectedRowKeys = [];
this.selectionRows = [];
},
searchQuery(){
getOrderMain(orderId) {
this.queryParam.mainId = orderId;
this.loadData(1);
},
searchReset(){
var that = this;
for(var a in that.queryParam){
that.queryParam[a] = '';
}
that.loadData(1);
handleAdd: function () {
this.$refs.modalForm.add(this.queryParam.mainId);
this.$refs.modalForm.title = "添加机票信息";
},
batchDel: function(){
if(this.selectedRowKeys.length<=0){
this.$message.warning('请选择一条记录！');
return ;
}else{
var ids = "";
for(var a =0;a<this.selectedRowKeys.length;a++){
ids+=this.selectedRowKeys[a]+",";
}
var that = this;
this.$confirm({
title:"确认删除",
content:"是否删除选中数据?",
onOk: function(){
deleteAction(that.url.deleteBatch,{ids: ids}).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.loadData();
that.onClearSelected();
}else{
that.$message.warning(res.message);
}
});
}
});
}
},
handleDelete: function(id){
var that = this;
this.$confirm({
title:"确认删除",
content:"是否删除选中数据?",
onOk: function(){
deleteAction(that.url.delete,{id: id}).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.loadData();
}else{
that.$message.warning(res.message);
}
});
}
});
},
handleEdit: function(record){
this.$refs.JeecgOrderTicketModal.edit(record,'e');
this.$refs.JeecgOrderTicketModal.title="新增机票信息";
},
handleAdd: function(){
this.$refs.JeecgOrderTicketModal.add(this.queryParam.orderId);
this.$refs.JeecgOrderTicketModal.title="新增机票信息";
},
handleDetail: function(record){
this.$refs.JeecgOrderTicketModal.detail(record);
this.$refs.JeecgOrderTicketModal.title="新增机票信息";
},
handleTableChange(pagination, filters, sorter){
//分页、排序、筛选变化时触发
console.log(sorter);
//TODO 筛选
if (Object.keys(sorter).length>0){
this.isorter.column = sorter.field;
this.isorter.order = "ascend"==sorter.order?"asc":"desc"
}
this.ipagination = pagination;
this.loadData();
},
modalFormOk () {
// 新增/修改 成功时，重载列表
this.loadData();
},
getOrderMain(orderId){
this.queryParam.orderId = orderId;
this.loadData(1);
}
}
}
</script>
<style scoped>
.ant-card {
margin-left: -30px;
margin-right: -30px;
}
</style>

300
ant-design-jeecg-vue/src/views/jeecg/tablist/form/JeecgOrderCustomerModal.vue
View File

@ -10,21 +10,22 @@
cancelText="关闭">
<!-- 编辑 -->
<a-spin :spinning="confirmLoading" v-if="editStatus">
<a-spin :spinning="confirmLoading" v-if="editStatus">
<a-form :form="form">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="客户姓名"
hasFeedback >
<a-input placeholder="请输入客户姓名" v-decorator="['name', {rules: [{ required: true, message: '请输入客户姓名!' }]}]" :readOnly="disableSubmit" />
hasFeedback>
<a-input placeholder="请输入客户姓名" v-decorator="['name', {rules: [{ required: true, message: '请输入客户姓名!' }]}]"
:readOnly="disableSubmit"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="性别"
hasFeedback >
hasFeedback>
<a-select v-decorator="['sex', {}]" placeholder="请选择性别">
<a-select-option value="1">男性</a-select-option>
<a-select-option value="2">女性</a-select-option>
@ -34,14 +35,14 @@
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="身份证号码"
hasFeedback >
<a-input placeholder="请输入身份证号码" v-decorator="['idcard', validatorRules.idcard]" :readOnly="disableSubmit" />
hasFeedback>
<a-input placeholder="请输入身份证号码" v-decorator="['idcard', validatorRules.idcard]" :readOnly="disableSubmit"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="身份证扫描件"
hasFeedback >
hasFeedback>
<a-upload
:action="uploadAction"
listType="picture-card"
@ -51,293 +52,244 @@
@preview="handlePreview"
>
<a-button>
<a-icon type="upload" /> upload
<a-icon type="upload"/>
upload
</a-button>
</a-upload>
<img v-if="model.idcardPic" :src="getIdCardView()" alt="头像" style="height:104px;max-width:300px"/>
<a-modal :visible="previewVisible" :footer="null" @cancel="handlePicCancel">
<img alt="example" style="width: 100%" :src="previewImage" />
<img alt="example" style="width: 100%" :src="previewImage"/>
</a-modal>
<br />
</a-form-item>
<a-form-item
<br/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="联系方式"
hasFeedback >
<a-input v-decorator="[ 'telphone', validatorRules.telphone]" :readOnly="disableSubmit" />
hasFeedback>
<a-input v-decorator="[ 'telphone', validatorRules.telphone]" :readOnly="disableSubmit"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单号码"
v-model="this.orderId"
:hidden="hiding"
hasFeedback >
<a-input v-decorator="[ 'orderId', {}]" disabled="disabled" />
hasFeedback>
<a-input v-decorator="[ 'orderId', {}]" disabled="disabled"/>
</a-form-item>
</a-form>
</a-spin>
<!-- 新增 -->
<a-table
v-if="addStatus"
ref="table"
bordered
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange"
>
</a-table>
</a-modal>
</template>
<script>
import { httpAction,getAction,postAction} from '@/api/manage'
import { doMian } from '@/api/api'
import {httpAction} from '@/api/manage'
import pick from 'lodash.pick'
import Vue from 'vue'
import { ACCESS_TOKEN } from "@/store/mutation-types"
import {ACCESS_TOKEN} from "@/store/mutation-types"
export default {
name: "JeecgOrderCustomerModal",
// 查询条件
data () {
data() {
return {
title:"操作",
title: "操作",
visible: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 5 },
xs: {span: 24},
sm: {span: 5},
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 },
xs: {span: 24},
sm: {span: 16},
},
// 表头
columns: [
{
title: '客户名',
align:"center",
align: "center",
dataIndex: 'name',
},
{
title: '性别',
align:"center",
align: "center",
dataIndex: 'sex',
},
{
title: '身份证号码',
align:"center",
align: "center",
dataIndex: 'idcard',
},
{
title: '身份证扫描件',
align:"center",
align: "center",
dataIndex: 'idcardPic',
},
{
title: '电话',
dataIndex: 'telphone',
align:"center",
align: "center",
},
{
title: '订单号码',
dataIndex: 'orderId',
align:"center",
align: "center",
},
{
title: '创建人',
dataIndex: 'createBy',
align:"center",
align: "center",
},
{
title: '创建时间',
dataIndex: 'createTime',
align:"center",
align: "center",
},
{
title: '更新时间',
dataIndex: 'updateBy',
align:"center",
align: "center",
},
{
title: '更新人',
dataIndex: 'updateTime',
align:"center",
align: "center",
},
],
dataSource:[],
// 分页参数
ipagination:{
current: 1,
pageSize: 10,
pageSizeOptions: ['10', '20', '30'],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条"
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
fileList:[],
disableSubmit:false,
fileList: [],
disableSubmit: false,
selectedRowKeys: [],
orderId:"",
hiding:false,
headers:{},
picUrl:"",
orderId: "",
hiding: false,
headers: {},
picUrl: "",
previewVisible: false,
previewImage: '',
addStatus:false,
editStatus:false,
addStatus: false,
editStatus: false,
confirmLoading: false,
form: this.$form.createForm(this),
url: {
fileUpload:doMian+"sys/common/upload",
add: "/test/order/addCustomer",
edit: "/test/order/editCustomer",
imgerver:doMian+"sys/common/view",
getOrderCustomerList: "/test/order/queryOrderCustomerListByMainId",
fileUpload: window._CONFIG['domianURL'] + "/sys/common/upload",
imgerver: window._CONFIG['domianURL'] + "/sys/common/view",
getOrderCustomerList: "/test/order/listOrderCustomerByMainId",
},
validatorRules:{
telphone:{rules: [{ validator:this.validateMobile}]},
idcard:{rules:[{ validator:this.validateIdCard}]}
validatorRules: {
telphone: {rules: [{validator: this.validateMobile}]},
idcard: {rules: [{validator: this.validateIdCard}]}
},
}
},
computed:{
uploadAction:function () {
computed: {
uploadAction: function () {
return this.url.fileUpload;
}
},
created () {
created() {
const token = Vue.ls.get(ACCESS_TOKEN);
this.headers = {"X-Access-Token":token}
this.headers = {"X-Access-Token": token}
},
methods: {
add (orderId) {
add(orderId) {
this.hiding = true;
if(orderId){
if (orderId) {
this.orderId = orderId;
this.edit({},'');
}else{
this.edit({orderId}, '');
} else {
this.$message.warning("请选择一个客户信息");
}
},
detail(record){
this.edit(record,'d');
detail(record) {
this.edit(record, 'd');
},
edit (record,v) {
this.form.resetFields();
this.model = Object.assign({}, record);
if(record.id){
edit(record, v) {
if (v == 'e') {
this.hiding = false;
this.disableSubmit = false;
} else if (v == 'd') {
this.hiding = false;
this.disableSubmit = true;
} else {
this.hiding = true;
this.disableSubmit = false;
}
this.form.resetFields();
this.orderId = record.orderId;
this.picUrl = record.idcardPic;
this.model = Object.assign({}, record);
if (record.id) {
this.hiding = false;
if(v == 'e'){
this.disableSubmit = false;
}else {
this.disableSubmit = true;
}
this.addStatus = false;
this.editStatus = true;
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model,'id','name','sex','idcard','idcardPic','telphone','orderId','createBy','createTime','updateBy','updateTime'))
this.form.setFieldsValue(pick(this.model, 'id', 'name', 'sex', 'idcard', 'idcardPic', 'telphone', 'orderId', 'createBy', 'createTime', 'updateBy', 'updateTime'))
});
}else{
} else {
this.addStatus = false;
this.editStatus = true;
}
// 加载客户信息
let httpurl = this.url.getOrderCustomerList;
getAction(httpurl,{id:this.orderId}).then((res)=>{
if(res.success){
this.dataSource = res.result;
}else{
this.$message.warning(res.message);
}
});
this.visible = true;
},
close () {
close() {
this.$emit('close');
this.visible = false;
this.picUrl = "";
this.fileList=[];
},
onSelectChange (selectedRowKeys,selectionRows) {
this.selectedRowKeys = selectedRowKeys;
console.log(selectionRows);
},
handleOk () {
handleOk() {
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;
let formData = Object.assign(this.model, values);
formData.orderId = this.orderId;
formData.idcardPic = this.picUrl;
postAction(httpurl,formData).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.$emit('ok');
this.visible = false;
}else{
this.$message.warning(res.message);
}
});
}else{
httpurl+=this.url.edit;
if (!this.model.id) {
httpurl += this.url.add;
method = 'post';
} else {
httpurl += this.url.edit;
method = 'put';
let formData = Object.assign(this.model, values);
//时间格式化
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;
that.close();
})
}
let formData = Object.assign(this.model, values);
console.log(formData);
formData.orderId = this.orderId;
formData.idcardPic = this.picUrl;
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;
that.close();
})
}
})
},
handleTableChange(pagination, filters, sorter){
//TODO 筛选
if (Object.keys(sorter).length>0){
this.isorter.column = sorter.field;
this.isorter.order = "ascend"==sorter.order?"asc":"desc"
}
this.ipagination = pagination;
this.loadData();
handleCancel() {
this.close();
},
handleCancel () {
this.close()
},
validateMobile(rule,value,callback){
if (!value || new RegExp(/^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/).test(value)){
validateMobile(rule, value, callback) {
if (!value || new RegExp(/^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/).test(value)) {
callback();
}else{
} else {
callback("您的手机号码格式不正确!");
}
},
validateIdCard(rule,value,callback){
if (!value || new RegExp(/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/).test(value)){
validateIdCard(rule, value, callback) {
if (!value || new RegExp(/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/).test(value)) {
callback();
}else{
} else {
callback("您的身份证号码格式不正确!");
}
},
handleChange (info) {
handleChange(info) {
this.fileList = info.fileList;
if (info.file.status === 'uploading') {
return
@ -345,39 +297,43 @@
if (info.file.status === 'done') {
var response = info.file.response;
console.log(response);
if(response.success){
if (response.success) {
this.picUrl += response.message + ",";
}else{
} else {
this.$message.warning(response.message);
}
}
},
handlePicCancel () {
handlePicCancel() {
this.previewVisible = false
},
handlePreview (file) {
handlePreview(file) {
this.previewImage = file.url || file.thumbUrl
this.previewVisible = true
},
getIdCardView(){
getIdCardView() {
let pics = this.model.idcardPic.split(",");
return this.url.imgerver +"/"+ pics[0];
let pics_len = pics.length;
// 显示上传的最后一个图片
return this.url.imgerver + "/" + pics[pics_len-2];
}
}
}
}
</script>
<style scoped>
/* tile uploaded pictures */
.upload-list-inline >>> .ant-upload-list-item {
.upload-list-inline > > > .ant-upload-list-item {
float: left;
width: 200px;
margin-right: 8px;
}
.upload-list-inline >>> .ant-upload-animate-enter {
.upload-list-inline > > > .ant-upload-animate-enter {
animation-name: uploadAnimateInlineIn;
}
.upload-list-inline >>> .ant-upload-animate-leave {
.upload-list-inline > > > .ant-upload-animate-leave {
animation-name: uploadAnimateInlineOut;
}
</style>

274
ant-design-jeecg-vue/src/views/jeecg/tablist/form/JeecgOrderDMainModal.vue
View File

@ -10,136 +10,50 @@
<a-spin :spinning="confirmLoading">
<a-form :form="form">
<!-- 主表单区域 -->
<a-row class="form-row" :gutter="16">
<a-col :lg="8">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单号">
<a-input placeholder="请输入订单号" v-decorator="['orderCode', {rules: [{ required: true, message: '请输入订单号!' }]}]" />
</a-form-item>
</a-col>
<a-col :lg="8">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单类型">
<a-select placeholder="请输入订单类型" v-decorator="['ctype',{}]">
<a-select-option value="1">国内订单</a-select-option>
<a-select-option value="2">国际订单</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :lg="8">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单日期">
<a-date-picker showTime format='YYYY-MM-DD HH:mm:ss' v-decorator="[ 'orderDate',{}]"/>
</a-form-item>
</a-col>
</a-row>
<a-row class="form-row" :gutter="16">
<a-col :lg="8">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单金额">
<a-input-number style="width: 200px" v-decorator="[ 'orderMoney', {}]" />
</a-form-item>
</a-col>
<a-col :lg="8">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单备注">
<a-input placeholder="请输入订单备注" v-decorator="['content', {}]" />
</a-form-item>
</a-col>
</a-row>
<!-- 子表单区域 -->
<a-tabs defaultActiveKey="1" >
<a-tab-pane tab="客户信息" key="1">
<div>
<a-row type="flex" style="margin-bottom:10px" :gutter="16">
<a-col :span="5">客户名</a-col>
<a-col :span="5">性别</a-col>
<a-col :span="5">身份证号码</a-col>
<a-col :span="5">手机号</a-col>
<a-col :span="4">操作</a-col>
</a-row>
<a-row type="flex" style="margin-bottom:10px" :gutter="16" v-for="(item, index) in orderMainModel.jeecgOrderCustomerList" :key="index">
<a-col :span="5">
<a-form-item>
<a-input placeholder="客户名" v-decorator="['jeecgOrderCustomerList['+index+'].name', {'initialValue':item.name,rules: [{ required: true, message: '请输入用户名!' }]}]" />
</a-form-item>
</a-col>
<a-col :span="5">
<a-form-item>
<a-select placeholder="性别" v-decorator="['jeecgOrderCustomerList['+index+'].sex', {'initialValue':item.sex}]">
<a-select-option value="1">男</a-select-option>
<a-select-option value="2">女</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :span="5">
<a-form-item>
<a-input placeholder="身份证号" v-decorator="['jeecgOrderCustomerList['+index+'].idcard', {'initialValue':item.idcard,rules: [{ pattern: '^\\d{6}(18|19|20)?\\d{2}(0[1-9]|1[012])(0[1-9]|[12]\\d|3[01])\\d{3}(\\d|[xX])$', message: '身份证号格式不对!' }]}]"/>
</a-form-item>
</a-col>
<a-col :span="5">
<a-form-item>
<a-input placeholder="手机号" v-decorator="['jeecgOrderCustomerList['+index+'].telphone', {'initialValue':item.telphone,rules: [{ pattern: '^1(3|4|5|7|8)\\d{9}$', message: '手机号格式不对!' }]}]"/>
</a-form-item>
</a-col>
<a-col :span="4">
<a-form-item>
<a-button @click="addRowCustom" icon="plus"></a-button>&nbsp;
<a-button @click="delRowCustom(index)" icon="minus"></a-button>
</a-form-item>
</a-col>
</a-row>
</div>
</a-tab-pane>
<a-tab-pane tab="机票信息" key="2" forceRender>
<div>
<a-row type="flex" style="margin-bottom:10px" :gutter="16">
<a-col :span="6">航班号</a-col>
<a-col :span="6">航班时间</a-col>
<a-col :span="6">操作</a-col>
</a-row>
<a-row type="flex" style="margin-bottom:10px" :gutter="16" v-for="(item, index) in orderMainModel.jeecgOrderTicketList" :key="index">
<a-col :span="6">
<a-form-item>
<a-input placeholder="航班号" v-decorator="['jeecgOrderTicketList['+index+'].ticketCode', {'initialValue':item.ticketCode,rules: [{ required: true, message: '请输入航班号!' }]}]" />
</a-form-item>
</a-col>
<a-col :span="6">
<a-form-item>
<j-date placeholder="航班时间" :trigger-change="true" v-decorator="['jeecgOrderTicketList['+index+'].tickectDate', {'initialValue':item.tickectDate}]"></j-date>
</a-form-item>
</a-col>
<a-col :span="6">
<a-form-item>
<a-button @click="addRowTicket" icon="plus"></a-button>&nbsp;
<a-button @click="delRowTicket(index)" icon="minus"></a-button>
</a-form-item>
</a-col>
</a-row>
</div>
</a-tab-pane>
</a-tabs>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单号"
hasFeedback>
<a-input
placeholder="请输入订单号"
v-decorator="['orderCode', {rules: [{ required: true, message: '请输入订单号!' }]}]"
/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单类型">
<a-select placeholder="请输入订单类型" v-decorator="['ctype',{}]">
<a-select-option value="1">国内订单</a-select-option>
<a-select-option value="2">国际订单</a-select-option>
</a-select>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单日期">
<a-date-picker showTime format='YYYY-MM-DD HH:mm:ss' v-decorator="[ 'orderDate',{}]"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单金额">
<a-input-number style="width: 200px" v-decorator="[ 'orderMoney', {}]"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="订单备注">
<a-input placeholder="请输入订单备注" v-decorator="['content', {}]"/>
</a-form-item>
</a-form>
</a-spin>
</a-modal>
</template>
<script>
import { httpAction,getAction } from '@/api/manage'
import {httpAction} from '@/api/manage'
import JDate from '@/components/jeecg/JDate'
import pick from 'lodash.pick'
import moment from "moment"
@ -149,77 +63,54 @@
components: {
JDate
},
data () {
data() {
return {
title:"操作",
title: "操作",
visible: false,
orderMainModel: {jeecgOrderCustomerList: [{}],
jeecgOrderTicketList: [{}]},
orderMainModel: {
jeecgOrderCustomerList: [{}],
jeecgOrderTicketList: [{}]
},
labelCol: {
xs: { span: 24 },
sm: { span: 5 },
xs: {span: 24},
sm: {span: 5},
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 },
xs: {span: 24},
sm: {span: 16},
},
confirmLoading: false,
form: this.$form.createForm(this),
validatorRules:{
},
validatorRules: {},
url: {
add: "/test/order/add",
edit: "/test/order/edit",
orderCustomerList: "/test/order/queryOrderCustomerListByMainId",
orderTicketList: "/test/order/queryOrderTicketListByMainId",
orderCustomerList: "/test/order/listOrderCustomerByMainId",
orderTicketList: "/test/order/listOrderTicketByMainId",
},
}
},
created () {
},
methods: {
add () {
add() {
this.edit({});
},
edit (record) {
edit(record) {
this.form.resetFields();
this.orderMainModel = Object.assign({}, record);
this.orderMainModel.jeecgOrderCustomerList = [{}];
this.orderMainModel.jeecgOrderTicketList = [{}];
//--------------------------------------------------------
//初始化明细表数据
console.log(this.orderMainModel.id)
if(this.orderMainModel.id){
let params = {id:this.orderMainModel.id}
//初始化订单机票列表
getAction(this.url.orderCustomerList,params).then((res)=>{
if(res.success){
this.orderMainModel.jeecgOrderCustomerList = res.result;
this.$forceUpdate()
}
})
//初始化订单客户列表
getAction(this.url.orderTicketList,params).then((res)=>{
if(res.success){
this.orderMainModel.jeecgOrderTicketList = res.result;
this.$forceUpdate()
}
})
}
//--------------------------------------------------------
this.visible = true;
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.orderMainModel,'orderCode','ctype','orderMoney','content'))
this.form.setFieldsValue({orderDate:this.orderMainModel.orderDate?moment(this.orderMainModel.orderDate):null}) //时间格式化
this.form.setFieldsValue(pick(this.orderMainModel, 'orderCode', 'ctype', 'orderMoney', 'content'))
this.form.setFieldsValue({orderDate: this.orderMainModel.orderDate ? moment(this.orderMainModel.orderDate) : null}) //时间格式化
});
console.log(this.orderMainModel)
},
close () {
close() {
this.$emit('close');
this.visible = false;
},
handleOk () {
handleOk() {
const that = this;
// 触发表单验证
this.form.validateFields((err, values) => {
@ -227,60 +118,38 @@
that.confirmLoading = true;
let httpurl = '';
let method = '';
if(!this.orderMainModel.id){
httpurl+=this.url.add;
if (!this.orderMainModel.id) {
httpurl += this.url.add;
method = 'post';
}else{
httpurl+=this.url.edit;
} else {
httpurl += this.url.edit;
method = 'put';
}
let orderMainData = Object.assign(this.orderMainModel, values);
//时间格式化
orderMainData.orderDate = orderMainData.orderDate?orderMainData.orderDate.format('YYYY-MM-DD HH:mm:ss'):null;
let formData = {jeecgOrderMain:orderMainData,
jeecgOrderCustomerList:orderMainData.jeecgOrderCustomerList,
jeecgOrderTicketList:orderMainData.jeecgOrderTicketList}
orderMainData.orderDate = orderMainData.orderDate ? orderMainData.orderDate.format('YYYY-MM-DD HH:mm:ss') : null;
let formData = {
...orderMainData
}
console.log(formData)
httpAction(httpurl,formData,method).then((res)=>{
if(res.success){
httpAction(httpurl, formData, method).then((res) => {
if (res.success) {
that.$message.success(res.message);
that.$emit('ok');
}else{
} else {
that.$message.warning(res.message);
}
}).finally(() => {
that.confirmLoading = false;
that.close();
})
}
})
},
handleCancel () {
handleCancel() {
this.close()
},
addRowCustom () {
this.orderMainModel.jeecgOrderCustomerList.push({});
this.$forceUpdate();
},
delRowCustom (index) {
console.log(index)
this.orderMainModel.jeecgOrderCustomerList.splice(index,1);
this.$forceUpdate();
},
addRowTicket () {
this.orderMainModel.jeecgOrderTicketList.push({});
console.log(this.orderMainModel.jeecgOrderTicketList)
this.$forceUpdate();
},
delRowTicket (index) {
console.log(index)
this.orderMainModel.jeecgOrderTicketList.splice(index,1);
this.$forceUpdate();
},
}
}
}
</script>
@ -290,13 +159,16 @@
padding: 0 10px;
margin-left: 3px;
}
.ant-form-item-control {
line-height: 0px;
}
/** 主表单行间距 */
.ant-form .ant-form-item {
margin-bottom: 10px;
}
/** Tab页面行间距 */
.ant-tabs-content .ant-form-item {
margin-bottom: 0px;

110
ant-design-jeecg-vue/src/views/jeecg/tablist/form/JeecgOrderTicketModal.vue
View File

@ -16,14 +16,17 @@
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="航班号"
hasFeedback >
<a-input placeholder="请输入航班号" v-decorator="['ticketCode', {rules:[{ required: true,message: '请输入航班号!'}]}]" :readOnly="disableSubmit"/>
hasFeedback>
<a-input
placeholder="请输入航班号"
:readOnly="disableSubmit"
v-decorator="['ticketCode', {rules:[{ required: true,message: '请输入航班号!'}]}]"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="航班时间"
hasFeedback >
hasFeedback>
<j-date v-decorator="['tickectDate',{trigger:'input',rules:[{ required: true,message: '请输入航班号!'}]}]"></j-date>
</a-form-item>
<a-form-item
@ -32,7 +35,7 @@
label="订单号码"
v-model="this.orderId"
:hidden="hiding"
hasFeedback >
hasFeedback>
<a-input v-decorator="[ 'orderId', {}]" disabled="disabled"/>
</a-form-item>
<a-form-item
@ -40,7 +43,7 @@
:wrapperCol="wrapperCol"
label="创建人"
:hidden="hiding"
hasFeedback >
hasFeedback>
<a-input v-decorator="[ 'createBy', {}]" :readOnly="disableSubmit"/>
</a-form-item>
<a-form-item
@ -48,7 +51,7 @@
:wrapperCol="wrapperCol"
label="创建时间"
:hidden="hiding"
hasFeedback >
hasFeedback>
<a-input v-decorator="[ 'createTime', {}]" :readOnly="disableSubmit"/>
</a-form-item>
</a-form>
@ -57,7 +60,7 @@
</template>
<script>
import { httpAction } from '@/api/manage'
import {httpAction} from '@/api/manage'
import pick from 'lodash.pick'
import moment from 'moment'
import JDate from '@/components/jeecg/JDate'
@ -66,80 +69,71 @@
components: {
JDate
},
name: "JeecgOrderTicketModal",
data () {
name: 'JeecgOrderTicketModal',
data() {
return {
title:"操作",
title: '操作',
visible: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 5 },
xs: {span: 24},
sm: {span: 5}
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 },
xs: {span: 24},
sm: {span: 16}
},
moment,
format:"YYYY-MM-DD HH:mm:ss",
format: 'YYYY-MM-DD HH:mm:ss',
disableSubmit: false,
orderId:"",
orderId: '',
hiding: false,
confirmLoading: false,
form: this.$form.createForm(this),
validatorRules:{
},
validatorRules: {},
url: {
add: "/test/order/addTicket",
edit: "/test/order/editTicket",
},
add: '/test/order/addTicket',
edit: '/test/order/editTicket'
}
}
},
created () {
created() {
},
methods: {
add (orderId) {
if(orderId){
this.orderId = orderId;
this.edit({},'');
}else{
this.$message.warning("请选择一条航班数据");
add(orderId) {
if (orderId) {
this.edit({orderId}, '')
} else {
this.$message.warning('请选择一条航班数据')
}
},
detail(record){
this.edit(record,'d');
detail(record) {
this.edit(record, 'd')
},
edit (record,v) {
if(v == 'e'){
edit(record, v) {
if (v == 'e') {
this.hiding = false;
this.disableSubmit = false;
}else if(v == 'd'){
} else if (v == 'd') {
this.hiding = false;
this.disableSubmit = true;
}else{
} else {
this.hiding = true;
this.disableSubmit = false;
}
this.form.resetFields();
this.orderId = record.orderId;
this.model = Object.assign({}, record);
this.visible = true;
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model,'ticketCode','tickectDate','orderId','createBy','createTime','updateBy','updateTime'))
});
this.form.setFieldsValue(pick(this.model, 'ticketCode', 'tickectDate', 'orderId', 'createBy', 'createTime', 'updateBy', 'updateTime'))
})
},
onChange(value, dateString) {
console.log('Selected Time: ', value);
console.log('Formatted Selected Time: ', dateString);
this.model.tickectDate = dateString;
},
onOk(value) {
console.log('onOk: ', value);
},
close () {
close() {
this.$emit('close');
this.visible = false;
},
handleOk () {
handleOk() {
const that = this;
// 触发表单验证
this.form.validateFields((err, values) => {
@ -147,22 +141,20 @@
that.confirmLoading = true;
let httpurl = '';
let method = '';
if(!this.model.id){
httpurl+=this.url.add;
if (!this.model.id) {
httpurl += this.url.add;
method = 'post';
}else{
httpurl+=this.url.edit;
} else {
httpurl += this.url.edit;
method = 'put';
}
let formData = Object.assign(this.model, values);
//时间格式化
formData.orderId = this.orderId;
console.log(formData)
httpAction(httpurl,formData,method).then((res)=>{
if(res.success){
formData.mainId = this.orderId;
httpAction(httpurl, formData, method).then((res) => {
if (res.success) {
that.$message.success(res.message);
that.$emit('ok');
}else{
that.$emit('ok')
} else {
that.$message.warning(res.message);
}
}).finally(() => {
@ -172,9 +164,9 @@
}
})
},
handleCancel () {
handleCancel() {
this.close()
},
}
}
}
</script>