【modify】使用ESLint格式化代码
This commit is contained in:
zer0Black
@@ -11,7 +11,6 @@
|
||||
<a-button @click="handleTableSet" type="primary">设置值</a-button>
|
||||
</a-tooltip>
|
||||
|
||||
|
||||
<j-editable-table
|
||||
ref="editableTable"
|
||||
:loading="loading"
|
||||
@@ -34,266 +33,264 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { randomUUID, randomNumber } from '@/utils/util'
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
import moment from 'moment'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { randomUUID, randomNumber } from '@/utils/util'
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
|
||||
export default {
|
||||
name: 'DefaultTable',
|
||||
components: { JEditableTable },
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
columns: [
|
||||
{
|
||||
title: '字段名称',
|
||||
key: 'dbFieldName',
|
||||
// width: '19%',
|
||||
width: '300px',
|
||||
type: FormTypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}',
|
||||
validateRules: [
|
||||
{
|
||||
required: true, // 必填
|
||||
message: '请输入${title}' // 显示的文本
|
||||
},
|
||||
{
|
||||
pattern: /^[a-z|A-Z][a-z|A-Z\d_-]{0,}$/, // 正则
|
||||
message: '${title}必须以字母开头，可包含数字、下划线、横杠'
|
||||
},
|
||||
{
|
||||
unique: true,
|
||||
message: '${title}不能重复'
|
||||
},
|
||||
{
|
||||
handler(type, value, row, column, callback, target) {
|
||||
// type 触发校验的类型（input、change、blur）
|
||||
// value 当前校验的值
|
||||
// callback(flag, message) 方法必须执行且只能执行一次
|
||||
// flag = 是否通过了校验，不填写或者填写 null 代表不进行任何操作
|
||||
// message = 提示的类型，默认使用配置的 message
|
||||
// target 行编辑的实例对象
|
||||
|
||||
if (type === 'blur') {
|
||||
if (value === 'abc') {
|
||||
callback(false, '${title}不能是abc') // false = 未通过校验
|
||||
} else {
|
||||
callback(true) // true = 通过验证
|
||||
}
|
||||
} else {
|
||||
callback(true) // 不填写或者填写 null 代表不进行任何操作
|
||||
}
|
||||
},
|
||||
message: '${title}默认提示'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '文件域',
|
||||
key: 'upload',
|
||||
type: FormTypes.upload,
|
||||
// width: '19%',
|
||||
width: '300px',
|
||||
placeholder: '点击上传',
|
||||
token: true,
|
||||
responseName: 'message',
|
||||
action: window._CONFIG['domianURL'] + '/sys/common/upload',
|
||||
data: {
|
||||
biz: 'temp',
|
||||
// 更多扩展参数
|
||||
export default {
|
||||
name: 'DefaultTable',
|
||||
components: { JEditableTable },
|
||||
data () {
|
||||
return {
|
||||
loading: false,
|
||||
columns: [
|
||||
{
|
||||
title: '字段名称',
|
||||
key: 'dbFieldName',
|
||||
// width: '19%',
|
||||
width: '300px',
|
||||
type: FormTypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}',
|
||||
validateRules: [
|
||||
{
|
||||
required: true, // 必填
|
||||
message: '请输入${title}' // 显示的文本
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '字段类型',
|
||||
key: 'dbFieldType',
|
||||
// width: '18%',
|
||||
width: '300px',
|
||||
type: FormTypes.select,
|
||||
options: [ // 下拉选项
|
||||
{ title: 'String', value: 'string' },
|
||||
{ title: 'Integer', value: 'int' },
|
||||
{ title: 'Double', value: 'double' },
|
||||
{ title: 'Boolean', value: 'boolean' }
|
||||
],
|
||||
allowInput: true,
|
||||
defaultValue: '',
|
||||
placeholder: '请选择${title}',
|
||||
validateRules: [{ required: true, message: '请选择${title}' }]
|
||||
},
|
||||
{
|
||||
title: '性别（字典）',
|
||||
key: 'sex_dict',
|
||||
width: '300px',
|
||||
type: FormTypes.select,
|
||||
options: [],
|
||||
dictCode: 'sex',
|
||||
placeholder: '请选择${title}',
|
||||
validateRules: [{ required: true, message: '请选择${title}' }]
|
||||
},
|
||||
{
|
||||
title: '多选测试',
|
||||
key: 'multipleSelect',
|
||||
// width: '18%',
|
||||
width: '300px',
|
||||
type: FormTypes.select,
|
||||
props: { 'mode': 'multiple' }, // 支持多选
|
||||
options: [
|
||||
{ title: 'String', value: 'string' },
|
||||
{ title: 'Integer', value: 'int' },
|
||||
{ title: 'Double', value: 'double' },
|
||||
{ title: 'Boolean', value: 'boolean' }
|
||||
],
|
||||
defaultValue: ['int', 'boolean'], // 多个默认项
|
||||
// defaultValue: 'string,double,int', // 也可使用这种方式
|
||||
placeholder: '这里可以多选',
|
||||
validateRules: [{ required: true, message: '请选择${title}' }]
|
||||
},
|
||||
{
|
||||
title: '字段长度',
|
||||
key: 'dbLength',
|
||||
// width: '8%',
|
||||
width: '100px',
|
||||
type: FormTypes.inputNumber,
|
||||
defaultValue: 32,
|
||||
placeholder: '${title}',
|
||||
// 是否是统计列，只有 inputNumber 才能设置统计列
|
||||
statistics: true,
|
||||
validateRules: [{ required: true, message: '请输入${title}' }]
|
||||
},
|
||||
{
|
||||
title: '日期',
|
||||
key: 'datetime',
|
||||
// width: '22%',
|
||||
width: '320px',
|
||||
type: FormTypes.datetime,
|
||||
defaultValue: '2019-4-30 14:52:22',
|
||||
placeholder: '请选择${title}',
|
||||
validateRules: [{ required: true, message: '请选择${title}' }]
|
||||
},
|
||||
{
|
||||
title: '数字',
|
||||
key: 'money',
|
||||
width: '320px',
|
||||
type: FormTypes.inputNumber,
|
||||
defaultValue: '100.32',
|
||||
placeholder: '请选择${title}',
|
||||
validateRules: [{ required: true, message: '请选择${title}' }]
|
||||
},
|
||||
{
|
||||
title: '可以为空',
|
||||
key: 'isNull',
|
||||
// width: '8%',
|
||||
width: '100px',
|
||||
type: FormTypes.checkbox,
|
||||
customValue: ['Y', 'N'], // true ,false
|
||||
defaultChecked: false
|
||||
},
|
||||
{
|
||||
type: FormTypes.popup,
|
||||
key: 'popup',
|
||||
title: 'JPopup',
|
||||
width: '180px',
|
||||
popupCode: 'demo',
|
||||
field: 'name',
|
||||
orgFields: 'name',
|
||||
destFields: 'name'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
// width: '8%',
|
||||
width: '100px',
|
||||
type: FormTypes.slot,
|
||||
slotName: 'action',
|
||||
}
|
||||
{
|
||||
pattern: /^[a-z|A-Z][a-z|A-Z\d_-]{0,}$/, // 正则
|
||||
message: '${title}必须以字母开头，可包含数字、下划线、横杠'
|
||||
},
|
||||
{
|
||||
unique: true,
|
||||
message: '${title}不能重复'
|
||||
},
|
||||
{
|
||||
handler (type, value, row, column, callback, target) {
|
||||
// type 触发校验的类型（input、change、blur）
|
||||
// value 当前校验的值
|
||||
// callback(flag, message) 方法必须执行且只能执行一次
|
||||
// flag = 是否通过了校验，不填写或者填写 null 代表不进行任何操作
|
||||
// message = 提示的类型，默认使用配置的 message
|
||||
// target 行编辑的实例对象
|
||||
|
||||
],
|
||||
dataSource: [],
|
||||
selectedRowIds: []
|
||||
if (type === 'blur') {
|
||||
if (value === 'abc') {
|
||||
callback(false, '${title}不能是abc') // false = 未通过校验
|
||||
} else {
|
||||
callback(true) // true = 通过验证
|
||||
}
|
||||
} else {
|
||||
callback(true) // 不填写或者填写 null 代表不进行任何操作
|
||||
}
|
||||
},
|
||||
message: '${title}默认提示'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '文件域',
|
||||
key: 'upload',
|
||||
type: FormTypes.upload,
|
||||
// width: '19%',
|
||||
width: '300px',
|
||||
placeholder: '点击上传',
|
||||
token: true,
|
||||
responseName: 'message',
|
||||
action: window._CONFIG.domianURL + '/sys/common/upload',
|
||||
data: {
|
||||
biz: 'temp'
|
||||
// 更多扩展参数
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '字段类型',
|
||||
key: 'dbFieldType',
|
||||
// width: '18%',
|
||||
width: '300px',
|
||||
type: FormTypes.select,
|
||||
options: [ // 下拉选项
|
||||
{ title: 'String', value: 'string' },
|
||||
{ title: 'Integer', value: 'int' },
|
||||
{ title: 'Double', value: 'double' },
|
||||
{ title: 'Boolean', value: 'boolean' }
|
||||
],
|
||||
allowInput: true,
|
||||
defaultValue: '',
|
||||
placeholder: '请选择${title}',
|
||||
validateRules: [{ required: true, message: '请选择${title}' }]
|
||||
},
|
||||
{
|
||||
title: '性别（字典）',
|
||||
key: 'sex_dict',
|
||||
width: '300px',
|
||||
type: FormTypes.select,
|
||||
options: [],
|
||||
dictCode: 'sex',
|
||||
placeholder: '请选择${title}',
|
||||
validateRules: [{ required: true, message: '请选择${title}' }]
|
||||
},
|
||||
{
|
||||
title: '多选测试',
|
||||
key: 'multipleSelect',
|
||||
// width: '18%',
|
||||
width: '300px',
|
||||
type: FormTypes.select,
|
||||
props: { mode: 'multiple' }, // 支持多选
|
||||
options: [
|
||||
{ title: 'String', value: 'string' },
|
||||
{ title: 'Integer', value: 'int' },
|
||||
{ title: 'Double', value: 'double' },
|
||||
{ title: 'Boolean', value: 'boolean' }
|
||||
],
|
||||
defaultValue: ['int', 'boolean'], // 多个默认项
|
||||
// defaultValue: 'string,double,int', // 也可使用这种方式
|
||||
placeholder: '这里可以多选',
|
||||
validateRules: [{ required: true, message: '请选择${title}' }]
|
||||
},
|
||||
{
|
||||
title: '字段长度',
|
||||
key: 'dbLength',
|
||||
// width: '8%',
|
||||
width: '100px',
|
||||
type: FormTypes.inputNumber,
|
||||
defaultValue: 32,
|
||||
placeholder: '${title}',
|
||||
// 是否是统计列，只有 inputNumber 才能设置统计列
|
||||
statistics: true,
|
||||
validateRules: [{ required: true, message: '请输入${title}' }]
|
||||
},
|
||||
{
|
||||
title: '日期',
|
||||
key: 'datetime',
|
||||
// width: '22%',
|
||||
width: '320px',
|
||||
type: FormTypes.datetime,
|
||||
defaultValue: '2019-4-30 14:52:22',
|
||||
placeholder: '请选择${title}',
|
||||
validateRules: [{ required: true, message: '请选择${title}' }]
|
||||
},
|
||||
{
|
||||
title: '数字',
|
||||
key: 'money',
|
||||
width: '320px',
|
||||
type: FormTypes.inputNumber,
|
||||
defaultValue: '100.32',
|
||||
placeholder: '请选择${title}',
|
||||
validateRules: [{ required: true, message: '请选择${title}' }]
|
||||
},
|
||||
{
|
||||
title: '可以为空',
|
||||
key: 'isNull',
|
||||
// width: '8%',
|
||||
width: '100px',
|
||||
type: FormTypes.checkbox,
|
||||
customValue: ['Y', 'N'], // true ,false
|
||||
defaultChecked: false
|
||||
},
|
||||
{
|
||||
type: FormTypes.popup,
|
||||
key: 'popup',
|
||||
title: 'JPopup',
|
||||
width: '180px',
|
||||
popupCode: 'demo',
|
||||
field: 'name',
|
||||
orgFields: 'name',
|
||||
destFields: 'name'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
// width: '8%',
|
||||
width: '100px',
|
||||
type: FormTypes.slot,
|
||||
slotName: 'action'
|
||||
}
|
||||
|
||||
],
|
||||
dataSource: [],
|
||||
selectedRowIds: []
|
||||
}
|
||||
},
|
||||
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
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.randomData(23, false)
|
||||
},
|
||||
methods: {
|
||||
|
||||
/** 表单验证 */
|
||||
handleTableCheck() {
|
||||
this.$refs.editableTable.getValues((error) => {
|
||||
if (error === 0) {
|
||||
this.$message.success('验证通过')
|
||||
} else {
|
||||
this.$message.error('验证未通过')
|
||||
}
|
||||
const randomDatetime = () => {
|
||||
const time = parseInt(randomNumber(1000, 9999999999999))
|
||||
return moment(new Date(time)).format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
|
||||
const begin = Date.now()
|
||||
const values = []
|
||||
for (let i = 0; i < size; i++) {
|
||||
values.push({
|
||||
id: randomUUID(),
|
||||
dbFieldName: `name_${i + 1}`,
|
||||
// dbFieldTxt: randomString(10),
|
||||
multipleSelect: ['string', ['int', 'double', 'boolean'][randomNumber(0, 2)]],
|
||||
dbFieldType: ['string', 'int', 'double', 'boolean'][randomNumber(0, 3)],
|
||||
dbLength: randomNumber(0, 233),
|
||||
datetime: randomDatetime(),
|
||||
isNull: ['Y', 'N'][randomNumber(0, 1)]
|
||||
})
|
||||
},
|
||||
/** 获取值，忽略表单验证 */
|
||||
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
|
||||
}
|
||||
|
||||
let randomDatetime = () => {
|
||||
let time = parseInt(randomNumber(1000, 9999999999999))
|
||||
return moment(new Date(time)).format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
|
||||
let begin = Date.now()
|
||||
let values = []
|
||||
for (let i = 0; i < size; i++) {
|
||||
values.push({
|
||||
id: randomUUID(),
|
||||
dbFieldName: `name_${i + 1}`,
|
||||
// dbFieldTxt: randomString(10),
|
||||
multipleSelect: ['string', ['int', 'double', 'boolean'][randomNumber(0, 2)]],
|
||||
dbFieldType: ['string', 'int', 'double', 'boolean'][randomNumber(0, 3)],
|
||||
dbLength: randomNumber(0, 233),
|
||||
datetime: randomDatetime(),
|
||||
isNull: ['Y', 'N'][randomNumber(0, 1)]
|
||||
})
|
||||
}
|
||||
|
||||
this.dataSource = values
|
||||
let end = Date.now()
|
||||
let diff = end - begin
|
||||
|
||||
if (loading && diff < size) {
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, size - diff)
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
handleDelete(props) {
|
||||
let { rowId, target } = props
|
||||
target.removeRows(rowId)
|
||||
}
|
||||
|
||||
this.dataSource = values
|
||||
const end = Date.now()
|
||||
const diff = end - begin
|
||||
|
||||
if (loading && diff < size) {
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, size - diff)
|
||||
}
|
||||
},
|
||||
|
||||
handleDelete (props) {
|
||||
const { rowId, target } = props
|
||||
target.removeRows(rowId)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -84,229 +84,228 @@
|
||||
|
||||
<script>
|
||||
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
import { VALIDATE_FAILED, getRefPromise, validateFormModelAndTables } from '@/components/jero/JVxeTable/utils/vxeUtils'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
import { JVXETypes } from '@/components/jero/JVxeTable'
|
||||
import JDate from '@/components/jero/JDate'
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
import { VALIDATE_FAILED, getRefPromise, validateFormModelAndTables } from '@/components/jero/JVxeTable/utils/vxeUtils'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
import { JVXETypes } from '@/components/jero/JVxeTable'
|
||||
import JDate from '@/components/jero/JDate'
|
||||
|
||||
export default {
|
||||
name: 'JeroOrderModalForJvexTable',
|
||||
components: {
|
||||
JDate, JEditableTable
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
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: JVXETypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}',
|
||||
validateRules: [{ required: true, message: '${title}不能为空' }]
|
||||
},
|
||||
{
|
||||
title: '性别',
|
||||
key: 'sex',
|
||||
width: '18%',
|
||||
type: JVXETypes.select,
|
||||
options: [ // 下拉选项
|
||||
{ title: '男', value: '1' },
|
||||
{ title: '女', value: '2' }
|
||||
],
|
||||
defaultValue: '',
|
||||
placeholder: '请选择${title}'
|
||||
},
|
||||
{
|
||||
title: '身份证号',
|
||||
key: 'idcard',
|
||||
width: '24%',
|
||||
type: JVXETypes.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: JVXETypes.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: JVXETypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}',
|
||||
validateRules: [{ required: true, message: '${title}不能为空' }]
|
||||
},
|
||||
{
|
||||
title: '航班时间',
|
||||
key: 'tickectDate',
|
||||
width: '30%',
|
||||
type: JVXETypes.date,
|
||||
placeholder: '请选择${title}',
|
||||
defaultValue: ''
|
||||
}
|
||||
]
|
||||
},
|
||||
url: {
|
||||
add: '/test/jeroOrderMain/add',
|
||||
edit: '/test/jeroOrderMain/edit',
|
||||
orderCustomerList: '/test/jeroOrderMain/queryOrderCustomerListByMainId',
|
||||
orderTicketList: '/test/jeroOrderMain/queryOrderTicketListByMainId'
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
|
||||
// 获取所有的editableTable实例
|
||||
getAllTable() {
|
||||
return Promise.all([
|
||||
getRefPromise(this, 'editableTable1'),
|
||||
getRefPromise(this, 'editableTable2')
|
||||
])
|
||||
export default {
|
||||
name: 'JeroOrderModalForJvexTable',
|
||||
components: {
|
||||
JDate, JEditableTable
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 }
|
||||
},
|
||||
|
||||
add() {
|
||||
// 默认新增一条数据
|
||||
this.getAllTable().then(editableTables => {
|
||||
//editableTables[0].add()
|
||||
//editableTables[1].add()
|
||||
})
|
||||
this.edit({})
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 24 - 6 }
|
||||
},
|
||||
edit(record) {
|
||||
this.visible = true
|
||||
this.activeKey = '1'
|
||||
this.model = Object.assign({}, record)
|
||||
// 加载子表数据
|
||||
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 => {
|
||||
this.table1.dataSource=[];
|
||||
this.table2.dataSource=[];
|
||||
})
|
||||
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 validateFormModelAndTables(this.$refs.form,this.model, tables)
|
||||
}).then(allValues => {
|
||||
let formData = this.classifyIntoFormData(allValues)
|
||||
// 发起请求
|
||||
return this.requestAddOrEdit(formData)
|
||||
}).catch(e => {
|
||||
if (e.error === VALIDATE_FAILED) {
|
||||
// 如果有未通过表单验证的子表，就自动跳转到它所在的tab
|
||||
this.activeKey = e.index == null ? this.activeKey : (e.index + 1).toString()
|
||||
} else {
|
||||
console.error(e)
|
||||
activeKey: '1',
|
||||
// 客户信息
|
||||
table1: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{
|
||||
title: '客户名',
|
||||
key: 'name',
|
||||
width: '24%',
|
||||
type: JVXETypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}',
|
||||
validateRules: [{ required: true, message: '${title}不能为空' }]
|
||||
},
|
||||
{
|
||||
title: '性别',
|
||||
key: 'sex',
|
||||
width: '18%',
|
||||
type: JVXETypes.select,
|
||||
options: [ // 下拉选项
|
||||
{ title: '男', value: '1' },
|
||||
{ title: '女', value: '2' }
|
||||
],
|
||||
defaultValue: '',
|
||||
placeholder: '请选择${title}'
|
||||
},
|
||||
{
|
||||
title: '身份证号',
|
||||
key: 'idcard',
|
||||
width: '24%',
|
||||
type: JVXETypes.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: JVXETypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}',
|
||||
validateRules: [{
|
||||
pattern: '^1(3|4|5|7|8)\\d{9}$',
|
||||
message: '${title}格式不正确'
|
||||
}]
|
||||
}
|
||||
})
|
||||
]
|
||||
},
|
||||
/** 整理成formData */
|
||||
classifyIntoFormData(allValues) {
|
||||
let orderMain = Object.assign(this.model, allValues.formValue)
|
||||
return {
|
||||
...orderMain, // 展开
|
||||
jeroOrderCustomerList: allValues.tablesValue[0].tableData,
|
||||
jeroOrderTicketList: allValues.tablesValue[1].tableData
|
||||
}
|
||||
},
|
||||
/** 发起新增或修改的请求 */
|
||||
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)
|
||||
// 机票信息
|
||||
table2: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{
|
||||
title: '航班号',
|
||||
key: 'ticketCode',
|
||||
width: '40%',
|
||||
type: JVXETypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}',
|
||||
validateRules: [{ required: true, message: '${title}不能为空' }]
|
||||
},
|
||||
{
|
||||
title: '航班时间',
|
||||
key: 'tickectDate',
|
||||
width: '30%',
|
||||
type: JVXETypes.date,
|
||||
placeholder: '请选择${title}',
|
||||
defaultValue: ''
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
]
|
||||
},
|
||||
url: {
|
||||
add: '/test/jeroOrderMain/add',
|
||||
edit: '/test/jeroOrderMain/edit',
|
||||
orderCustomerList: '/test/jeroOrderMain/queryOrderCustomerListByMainId',
|
||||
orderTicketList: '/test/jeroOrderMain/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.model = Object.assign({}, record)
|
||||
// 加载子表数据
|
||||
if (this.model.id) {
|
||||
const 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 => {
|
||||
this.table1.dataSource = []
|
||||
this.table2.dataSource = []
|
||||
})
|
||||
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 validateFormModelAndTables(this.$refs.form, this.model, tables)
|
||||
}).then(allValues => {
|
||||
const formData = this.classifyIntoFormData(allValues)
|
||||
// 发起请求
|
||||
return this.requestAddOrEdit(formData)
|
||||
}).catch(e => {
|
||||
if (e.error === VALIDATE_FAILED) {
|
||||
// 如果有未通过表单验证的子表，就自动跳转到它所在的tab
|
||||
this.activeKey = e.index == null ? this.activeKey : (e.index + 1).toString()
|
||||
} else {
|
||||
console.error(e)
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 整理成formData */
|
||||
classifyIntoFormData (allValues) {
|
||||
const orderMain = Object.assign(this.model, allValues.formValue)
|
||||
return {
|
||||
...orderMain, // 展开
|
||||
jeroOrderCustomerList: allValues.tablesValue[0].tableData,
|
||||
jeroOrderTicketList: allValues.tablesValue[1].tableData
|
||||
}
|
||||
},
|
||||
/** 发起新增或修改的请求 */
|
||||
requestAddOrEdit (formData) {
|
||||
let url = this.url.add; let 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>
|
||||
</style>
|
||||
|
||||
@@ -10,61 +10,61 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
|
||||
export default {
|
||||
name: 'ReadOnlyTable',
|
||||
components: { JEditableTable },
|
||||
data() {
|
||||
return {
|
||||
|
||||
columns: [
|
||||
{
|
||||
title: '输入框',
|
||||
key: 'input',
|
||||
type: FormTypes.input,
|
||||
placeholder: '清输入'
|
||||
},
|
||||
{
|
||||
title: '下拉框',
|
||||
key: 'select',
|
||||
type: FormTypes.select,
|
||||
options: [
|
||||
{ title: 'String', value: 'string' },
|
||||
{ title: 'Integer', value: 'int' },
|
||||
{ title: 'Double', value: 'double' },
|
||||
{ title: 'Boolean', value: 'boolean' }
|
||||
],
|
||||
placeholder: '请选择'
|
||||
},
|
||||
{
|
||||
title: '多选框',
|
||||
key: 'checkbox',
|
||||
type: FormTypes.checkbox,
|
||||
customValue: [true, false]
|
||||
},
|
||||
{
|
||||
title: '日期',
|
||||
key: 'datetime',
|
||||
type: FormTypes.datetime
|
||||
}
|
||||
],
|
||||
dataSource: [
|
||||
{ input: 'hello', select: 'int', checkbox: true, datetime: '2019-6-17 14:50:48' },
|
||||
{ input: 'world', select: 'string', checkbox: false, datetime: '2019-6-16 14:50:48' },
|
||||
{ input: 'one', select: 'double', checkbox: true, datetime: '2019-6-17 15:50:48' },
|
||||
{ input: 'two', select: 'boolean', checkbox: false, datetime: '2019-6-14 14:50:48' },
|
||||
{ input: 'three', select: '', checkbox: false, datetime: '2019-6-13 14:50:48' }
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
export default {
|
||||
name: 'ReadOnlyTable',
|
||||
components: { JEditableTable },
|
||||
data () {
|
||||
return {
|
||||
|
||||
columns: [
|
||||
{
|
||||
title: '输入框',
|
||||
key: 'input',
|
||||
type: FormTypes.input,
|
||||
placeholder: '清输入'
|
||||
},
|
||||
{
|
||||
title: '下拉框',
|
||||
key: 'select',
|
||||
type: FormTypes.select,
|
||||
options: [
|
||||
{ title: 'String', value: 'string' },
|
||||
{ title: 'Integer', value: 'int' },
|
||||
{ title: 'Double', value: 'double' },
|
||||
{ title: 'Boolean', value: 'boolean' }
|
||||
],
|
||||
placeholder: '请选择'
|
||||
},
|
||||
{
|
||||
title: '多选框',
|
||||
key: 'checkbox',
|
||||
type: FormTypes.checkbox,
|
||||
customValue: [true, false]
|
||||
},
|
||||
{
|
||||
title: '日期',
|
||||
key: 'datetime',
|
||||
type: FormTypes.datetime
|
||||
}
|
||||
],
|
||||
dataSource: [
|
||||
{ input: 'hello', select: 'int', checkbox: true, datetime: '2019-6-17 14:50:48' },
|
||||
{ input: 'world', select: 'string', checkbox: false, datetime: '2019-6-16 14:50:48' },
|
||||
{ input: 'one', select: 'double', checkbox: true, datetime: '2019-6-17 15:50:48' },
|
||||
{ input: 'two', select: 'boolean', checkbox: false, datetime: '2019-6-14 14:50:48' },
|
||||
{ input: 'three', select: '', checkbox: false, datetime: '2019-6-13 14:50:48' }
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -11,119 +11,117 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
|
||||
export default {
|
||||
name: 'ThreeLinkage',
|
||||
components: { JEditableTable },
|
||||
data() {
|
||||
return {
|
||||
columns: [
|
||||
{
|
||||
title: '省/直辖市/自治区',
|
||||
key: 's1',
|
||||
type: FormTypes.select,
|
||||
width: '240px',
|
||||
options: [],
|
||||
placeholder: '请选择${title}'
|
||||
},
|
||||
{
|
||||
title: '市',
|
||||
key: 's2',
|
||||
type: FormTypes.select,
|
||||
width: '240px',
|
||||
options: [],
|
||||
placeholder: '请选择${title}'
|
||||
},
|
||||
{
|
||||
title: '县/区',
|
||||
key: 's3',
|
||||
type: FormTypes.select,
|
||||
width: '240px',
|
||||
options: [],
|
||||
placeholder: '请选择${title}'
|
||||
}
|
||||
],
|
||||
dataSource: [],
|
||||
|
||||
mockData: [
|
||||
{ label: '北京市', value: '110000', parent: null },
|
||||
{ label: '天津市', value: '120000', parent: null },
|
||||
{ label: '河北省', value: '130000', parent: null },
|
||||
{ label: '上海市', value: '310000', parent: null },
|
||||
|
||||
{ label: '北京市', value: '110100', parent: '110000' },
|
||||
{ label: '天津市市', value: '120100', parent: '120000' },
|
||||
{ label: '石家庄市', value: '130100', parent: '130000' },
|
||||
{ label: '唐山市', value: '130200', parent: '130000' },
|
||||
{ label: '秦皇岛市', value: '130300', parent: '130000' },
|
||||
{ label: '上海市', value: '310100', parent: '310000' },
|
||||
|
||||
{ label: '东城区', value: '110101', parent: '110100' },
|
||||
{ label: '西城区', value: '110102', parent: '110100' },
|
||||
{ label: '朝阳区', value: '110105', parent: '110100' },
|
||||
{ label: '和平区', value: '120101', parent: '120000' },
|
||||
{ label: '河东区', value: '120102', parent: '120000' },
|
||||
{ label: '河西区', value: '120103', parent: '120000' },
|
||||
{ label: '黄浦区', value: '310101', parent: '310100' },
|
||||
{ label: '徐汇区', value: '310104', parent: '310100' },
|
||||
{ label: '长宁区', value: '310105', parent: '310100' },
|
||||
{ label: '长安区', value: '130102', parent: '130100' },
|
||||
{ label: '桥西区', value: '130104', parent: '130100' },
|
||||
{ label: '新华区', value: '130105', parent: '130100' },
|
||||
{ label: '路南区', value: '130202', parent: '130200' },
|
||||
{ label: '路北区', value: '130203', parent: '130200' },
|
||||
{ label: '古冶区', value: '130204', parent: '130200' },
|
||||
{ label: '海港区', value: '130302', parent: '130300' },
|
||||
{ label: '山海关区', value: '130303', parent: '130300' },
|
||||
{ label: '北戴河区', value: '130304', parent: '130300' },
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 初始化数据
|
||||
this.columns[0].options = this.request(null)
|
||||
},
|
||||
methods: {
|
||||
|
||||
request(parentId) {
|
||||
return this.mockData.filter(i => i.parent === parentId)
|
||||
},
|
||||
|
||||
/** 当选项被改变时，联动其他组件 */
|
||||
handleValueChange(event) {
|
||||
const { type, row, column, value, target } = event
|
||||
|
||||
if (type === FormTypes.select) {
|
||||
|
||||
// 第一列
|
||||
if (column.key === 's1') {
|
||||
// 设置第二列的 options
|
||||
this.columns[1].options = this.request(value)
|
||||
// 清空后两列的数据
|
||||
target.setValues([{
|
||||
rowKey: row.id,
|
||||
values: { s2: '', s3: '' }
|
||||
}])
|
||||
this.columns[2].options = []
|
||||
} else
|
||||
// 第二列
|
||||
if (column.key === 's2') {
|
||||
this.columns[2].options = this.request(value)
|
||||
target.setValues([{
|
||||
rowKey: row.id,
|
||||
values: { s3: '' }
|
||||
}])
|
||||
}
|
||||
export default {
|
||||
name: 'ThreeLinkage',
|
||||
components: { JEditableTable },
|
||||
data () {
|
||||
return {
|
||||
columns: [
|
||||
{
|
||||
title: '省/直辖市/自治区',
|
||||
key: 's1',
|
||||
type: FormTypes.select,
|
||||
width: '240px',
|
||||
options: [],
|
||||
placeholder: '请选择${title}'
|
||||
},
|
||||
{
|
||||
title: '市',
|
||||
key: 's2',
|
||||
type: FormTypes.select,
|
||||
width: '240px',
|
||||
options: [],
|
||||
placeholder: '请选择${title}'
|
||||
},
|
||||
{
|
||||
title: '县/区',
|
||||
key: 's3',
|
||||
type: FormTypes.select,
|
||||
width: '240px',
|
||||
options: [],
|
||||
placeholder: '请选择${title}'
|
||||
}
|
||||
],
|
||||
dataSource: [],
|
||||
|
||||
}
|
||||
mockData: [
|
||||
{ label: '北京市', value: '110000', parent: null },
|
||||
{ label: '天津市', value: '120000', parent: null },
|
||||
{ label: '河北省', value: '130000', parent: null },
|
||||
{ label: '上海市', value: '310000', parent: null },
|
||||
|
||||
{ label: '北京市', value: '110100', parent: '110000' },
|
||||
{ label: '天津市市', value: '120100', parent: '120000' },
|
||||
{ label: '石家庄市', value: '130100', parent: '130000' },
|
||||
{ label: '唐山市', value: '130200', parent: '130000' },
|
||||
{ label: '秦皇岛市', value: '130300', parent: '130000' },
|
||||
{ label: '上海市', value: '310100', parent: '310000' },
|
||||
|
||||
{ label: '东城区', value: '110101', parent: '110100' },
|
||||
{ label: '西城区', value: '110102', parent: '110100' },
|
||||
{ label: '朝阳区', value: '110105', parent: '110100' },
|
||||
{ label: '和平区', value: '120101', parent: '120000' },
|
||||
{ label: '河东区', value: '120102', parent: '120000' },
|
||||
{ label: '河西区', value: '120103', parent: '120000' },
|
||||
{ label: '黄浦区', value: '310101', parent: '310100' },
|
||||
{ label: '徐汇区', value: '310104', parent: '310100' },
|
||||
{ label: '长宁区', value: '310105', parent: '310100' },
|
||||
{ label: '长安区', value: '130102', parent: '130100' },
|
||||
{ label: '桥西区', value: '130104', parent: '130100' },
|
||||
{ label: '新华区', value: '130105', parent: '130100' },
|
||||
{ label: '路南区', value: '130202', parent: '130200' },
|
||||
{ label: '路北区', value: '130203', parent: '130200' },
|
||||
{ label: '古冶区', value: '130204', parent: '130200' },
|
||||
{ label: '海港区', value: '130302', parent: '130300' },
|
||||
{ label: '山海关区', value: '130303', parent: '130300' },
|
||||
{ label: '北戴河区', value: '130304', parent: '130300' }
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
// 初始化数据
|
||||
this.columns[0].options = this.request(null)
|
||||
},
|
||||
methods: {
|
||||
|
||||
request (parentId) {
|
||||
return this.mockData.filter(i => i.parent === parentId)
|
||||
},
|
||||
|
||||
/** 当选项被改变时，联动其他组件 */
|
||||
handleValueChange (event) {
|
||||
const { type, row, column, value, target } = event
|
||||
|
||||
if (type === FormTypes.select) {
|
||||
// 第一列
|
||||
if (column.key === 's1') {
|
||||
// 设置第二列的 options
|
||||
this.columns[1].options = this.request(value)
|
||||
// 清空后两列的数据
|
||||
target.setValues([{
|
||||
rowKey: row.id,
|
||||
values: { s2: '', s3: '' }
|
||||
}])
|
||||
this.columns[2].options = []
|
||||
} else
|
||||
// 第二列
|
||||
if (column.key === 's2') {
|
||||
this.columns[2].options = this.request(value)
|
||||
target.setValues([{
|
||||
rowKey: row.id,
|
||||
values: { s3: '' }
|
||||
}])
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -48,99 +48,96 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { httpAction } from '@/api/manage'
|
||||
import { httpAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: "JeroDemoModal",
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
visible: false,
|
||||
model: {},
|
||||
layout: {
|
||||
labelCol: { span: 3 },
|
||||
wrapperCol: { span: 14 },
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 3 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules:{
|
||||
name: [
|
||||
{ required: true, message: '请输入姓名!' },
|
||||
{ min: 2, max: 30, message: '长度在 2 到 30 个字符', trigger: 'blur' }
|
||||
],
|
||||
email: [
|
||||
{ required: false, type: 'email', message: '邮箱格式不正确', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
url: {
|
||||
add: "/test/jeroDemo/add",
|
||||
edit: "/test/jeroDemo/edit",
|
||||
},
|
||||
export default {
|
||||
name: 'JeroDemoModal',
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
layout: {
|
||||
labelCol: { span: 3 },
|
||||
wrapperCol: { span: 14 }
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 3 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules: {
|
||||
name: [
|
||||
{ required: true, message: '请输入姓名!' },
|
||||
{ min: 2, max: 30, message: '长度在 2 到 30 个字符', trigger: 'blur' }
|
||||
],
|
||||
email: [
|
||||
{ required: false, type: 'email', message: '邮箱格式不正确', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
url: {
|
||||
add: '/test/jeroDemo/add',
|
||||
edit: '/test/jeroDemo/edit'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.edit({})
|
||||
},
|
||||
created () {
|
||||
edit (record) {
|
||||
this.model = Object.assign({}, record)
|
||||
this.visible = true
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.edit({});
|
||||
},
|
||||
edit (record) {
|
||||
this.model = Object.assign({}, record);
|
||||
this.visible = true;
|
||||
},
|
||||
close () {
|
||||
this.$refs.form.resetFields();
|
||||
this.$emit('close');
|
||||
this.visible = false;
|
||||
},
|
||||
handleOk () {
|
||||
const that = this;
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true;
|
||||
let httpurl = '';
|
||||
let method = '';
|
||||
if(!this.model.id){
|
||||
httpurl+=this.url.add;
|
||||
method = 'post';
|
||||
}else{
|
||||
httpurl+=this.url.edit;
|
||||
method = 'put';
|
||||
}
|
||||
|
||||
httpAction(httpurl,this.model,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();
|
||||
})
|
||||
|
||||
|
||||
|
||||
close () {
|
||||
this.$refs.form.resetFields()
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
},
|
||||
handleOk () {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
let httpurl = ''
|
||||
let method = ''
|
||||
if (!this.model.id) {
|
||||
httpurl += this.url.add
|
||||
method = 'post'
|
||||
} else {
|
||||
httpurl += this.url.edit
|
||||
method = 'put'
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
|
||||
httpAction(httpurl, this.model, 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()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -103,183 +103,182 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {httpAction} from '@/api/manage'
|
||||
import pick from 'lodash.pick'
|
||||
import moment from "moment"
|
||||
import { httpAction } from '@/api/manage'
|
||||
import pick from 'lodash.pick'
|
||||
import moment from 'moment'
|
||||
|
||||
export default {
|
||||
name: "JeroDemoTabsModal",
|
||||
data() {
|
||||
return {
|
||||
title: "操作",
|
||||
visible: false,
|
||||
model: {},
|
||||
// table
|
||||
columns: [
|
||||
{
|
||||
title: '成员姓名',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
width: '20%',
|
||||
scopedSlots: {customRender: 'name'}
|
||||
},
|
||||
{
|
||||
title: '工号',
|
||||
dataIndex: 'workId',
|
||||
key: 'workId',
|
||||
width: '20%',
|
||||
scopedSlots: {customRender: 'workId'}
|
||||
},
|
||||
{
|
||||
title: '所属部门',
|
||||
dataIndex: 'department',
|
||||
key: 'department',
|
||||
width: '40%',
|
||||
scopedSlots: {customRender: 'department'}
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
scopedSlots: {customRender: 'operation'}
|
||||
}
|
||||
],
|
||||
data: [
|
||||
{
|
||||
key: '1',
|
||||
name: '小明',
|
||||
workId: '001',
|
||||
editable: false,
|
||||
department: '行政部'
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: '李莉',
|
||||
workId: '002',
|
||||
editable: false,
|
||||
department: 'IT部'
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
name: '王小帅',
|
||||
workId: '003',
|
||||
editable: false,
|
||||
department: '财务部'
|
||||
}
|
||||
],
|
||||
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules: {},
|
||||
url: {
|
||||
add: "/test/jeroDemo/add",
|
||||
edit: "/test/jeroDemo/edit",
|
||||
export default {
|
||||
name: 'JeroDemoTabsModal',
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
// table
|
||||
columns: [
|
||||
{
|
||||
title: '成员姓名',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
width: '20%',
|
||||
scopedSlots: { customRender: 'name' }
|
||||
},
|
||||
{
|
||||
title: '工号',
|
||||
dataIndex: 'workId',
|
||||
key: 'workId',
|
||||
width: '20%',
|
||||
scopedSlots: { customRender: 'workId' }
|
||||
},
|
||||
{
|
||||
title: '所属部门',
|
||||
dataIndex: 'department',
|
||||
key: 'department',
|
||||
width: '40%',
|
||||
scopedSlots: { customRender: 'department' }
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
scopedSlots: { customRender: 'operation' }
|
||||
}
|
||||
],
|
||||
data: [
|
||||
{
|
||||
key: '1',
|
||||
name: '小明',
|
||||
workId: '001',
|
||||
editable: false,
|
||||
department: '行政部'
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: '李莉',
|
||||
workId: '002',
|
||||
editable: false,
|
||||
department: 'IT部'
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
name: '王小帅',
|
||||
workId: '003',
|
||||
editable: false,
|
||||
department: '财务部'
|
||||
}
|
||||
],
|
||||
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules: {},
|
||||
url: {
|
||||
add: '/test/jeroDemo/add',
|
||||
edit: '/test/jeroDemo/edit'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.edit({})
|
||||
},
|
||||
edit (record) {
|
||||
this.form.resetFields()
|
||||
this.model = Object.assign({}, record)
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model, 'name', 'keyWord', 'sex', 'age', 'email', 'content'))
|
||||
// 时间格式化
|
||||
this.form.setFieldsValue({ punchTime: this.model.punchTime ? moment(this.model.punchTime, 'YYYY-MM-DD HH:mm:ss') : null })
|
||||
this.form.setFieldsValue({ birthday: this.model.birthday ? moment(this.model.birthday) : null })
|
||||
})
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
},
|
||||
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
|
||||
method = 'post'
|
||||
} else {
|
||||
httpurl += this.url.edit
|
||||
method = 'put'
|
||||
}
|
||||
const formData = Object.assign(this.model, values)
|
||||
// 时间格式化
|
||||
formData.punchTime = formData.punchTime ? formData.punchTime.format('YYYY-MM-DD HH:mm:ss') : null
|
||||
formData.birthday = formData.birthday ? formData.birthday.format() : null
|
||||
|
||||
console.log(formData)
|
||||
httpAction(httpurl, formData, method).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.$emit('ok')
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
newRow () {
|
||||
// 通过时间戳生成 UUID
|
||||
const uuid = Math.round(new Date().getTime()).toString()
|
||||
console.log('uuid: ' + uuid)
|
||||
this.data.push({
|
||||
key: uuid,
|
||||
name: '',
|
||||
workId: '',
|
||||
department: '',
|
||||
editable: true,
|
||||
isNew: true
|
||||
})
|
||||
},
|
||||
removeRow (key) {
|
||||
const newData = this.data.filter(item => item.key !== key)
|
||||
this.data = newData
|
||||
},
|
||||
saveRow (key) {
|
||||
const target = this.data.filter(item => item.key === key)[0]
|
||||
target.editable = false
|
||||
target.isNew = false
|
||||
},
|
||||
handlerRowChange (value, key, column) {
|
||||
const newData = [...this.data]
|
||||
const target = newData.filter(item => key === item.key)[0]
|
||||
if (target) {
|
||||
target[column] = value
|
||||
this.data = newData
|
||||
}
|
||||
},
|
||||
created() {
|
||||
editRow (key) {
|
||||
const target = this.data.filter(item => item.key === key)[0]
|
||||
target.editable = !target.editable
|
||||
},
|
||||
methods: {
|
||||
add() {
|
||||
this.edit({});
|
||||
},
|
||||
edit(record) {
|
||||
this.form.resetFields();
|
||||
this.model = Object.assign({}, record);
|
||||
this.visible = true;
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model, 'name', 'keyWord', 'sex', 'age', 'email', 'content'))
|
||||
//时间格式化
|
||||
this.form.setFieldsValue({punchTime: this.model.punchTime ? moment(this.model.punchTime, 'YYYY-MM-DD HH:mm:ss') : null})
|
||||
this.form.setFieldsValue({birthday: this.model.birthday ? moment(this.model.birthday) : null})
|
||||
});
|
||||
|
||||
},
|
||||
close() {
|
||||
this.$emit('close');
|
||||
this.visible = false;
|
||||
},
|
||||
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;
|
||||
method = 'post';
|
||||
} else {
|
||||
httpurl += this.url.edit;
|
||||
method = 'put';
|
||||
}
|
||||
let formData = Object.assign(this.model, values);
|
||||
//时间格式化
|
||||
formData.punchTime = formData.punchTime ? formData.punchTime.format('YYYY-MM-DD HH:mm:ss') : null;
|
||||
formData.birthday = formData.birthday ? formData.birthday.format() : null;
|
||||
|
||||
console.log(formData)
|
||||
httpAction(httpurl, formData, method).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message);
|
||||
that.$emit('ok');
|
||||
} else {
|
||||
that.$message.warning(res.message);
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false;
|
||||
that.close();
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel() {
|
||||
this.close()
|
||||
},
|
||||
newRow () {
|
||||
// 通过时间戳生成 UUID
|
||||
let uuid = Math.round(new Date().getTime()).toString();
|
||||
console.log('uuid: '+ uuid)
|
||||
this.data.push({
|
||||
key: uuid,
|
||||
name: '',
|
||||
workId: '',
|
||||
department: '',
|
||||
editable: true,
|
||||
isNew: true
|
||||
})
|
||||
},
|
||||
removeRow (key) {
|
||||
const newData = this.data.filter(item => item.key !== key)
|
||||
this.data = newData
|
||||
},
|
||||
saveRow (key) {
|
||||
let target = this.data.filter(item => item.key === key)[0]
|
||||
target.editable = false
|
||||
target.isNew = false
|
||||
},
|
||||
handlerRowChange (value, key, column) {
|
||||
const newData = [...this.data]
|
||||
const target = newData.filter(item => key === item.key)[0]
|
||||
if (target) {
|
||||
target[column] = value
|
||||
this.data = newData
|
||||
}
|
||||
},
|
||||
editRow (key) {
|
||||
let target = this.data.filter(item => item.key === key)[0]
|
||||
target.editable = !target.editable
|
||||
},
|
||||
cancelEditRow (key) {
|
||||
let target = this.data.filter(item => item.key === key)[0]
|
||||
target.editable = false
|
||||
},
|
||||
cancelEditRow (key) {
|
||||
const target = this.data.filter(item => item.key === key)[0]
|
||||
target.editable = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.ant-modal-body {
|
||||
padding: 8px!important;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -138,141 +138,140 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { httpAction,getAction } from '@/api/manage'
|
||||
import JDate from '@/components/jero/JDate'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
import JDate from '@/components/jero/JDate'
|
||||
|
||||
export default {
|
||||
name: "JeroOrderMainModal",
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
visible: false,
|
||||
orderMainModel: {
|
||||
jeroOrderCustomerList: [{}],
|
||||
jeroOrderTicketList: [{}]
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules:{
|
||||
orderCode: [
|
||||
{ required: true, message: '订单号不能为空', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
url: {
|
||||
add: "/test/jeroOrderMain/add",
|
||||
edit: "/test/jeroOrderMain/edit",
|
||||
orderCustomerList: "/test/jeroOrderMain/queryOrderCustomerListByMainId",
|
||||
orderTicketList: "/test/jeroOrderMain/queryOrderTicketListByMainId",
|
||||
},
|
||||
export default {
|
||||
name: 'JeroOrderMainModal',
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
orderMainModel: {
|
||||
jeroOrderCustomerList: [{}],
|
||||
jeroOrderTicketList: [{}]
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules: {
|
||||
orderCode: [
|
||||
{ required: true, message: '订单号不能为空', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
url: {
|
||||
add: '/test/jeroOrderMain/add',
|
||||
edit: '/test/jeroOrderMain/edit',
|
||||
orderCustomerList: '/test/jeroOrderMain/queryOrderCustomerListByMainId',
|
||||
orderTicketList: '/test/jeroOrderMain/queryOrderTicketListByMainId'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.edit({})
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.edit({});
|
||||
},
|
||||
edit (record) {
|
||||
this.orderMainModel = Object.assign({
|
||||
jeroOrderCustomerList: [{}],
|
||||
jeroOrderTicketList: [{}]
|
||||
}, record);
|
||||
//--------------------------------------------------------
|
||||
//初始化明细表数据
|
||||
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.jeroOrderCustomerList = res.result;
|
||||
this.$forceUpdate()
|
||||
}
|
||||
})
|
||||
//初始化订单客户列表
|
||||
getAction(this.url.orderTicketList,params).then((res)=>{
|
||||
if(res.success){
|
||||
this.orderMainModel.jeroOrderTicketList = res.result;
|
||||
this.$forceUpdate()
|
||||
}
|
||||
})
|
||||
}
|
||||
this.visible = true;
|
||||
},
|
||||
close () {
|
||||
this.$emit('close');
|
||||
this.visible = false;
|
||||
},
|
||||
handleOk () {
|
||||
const that = this;
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true;
|
||||
let httpurl = '';
|
||||
let method = '';
|
||||
if(!this.orderMainModel.id){
|
||||
httpurl+=this.url.add;
|
||||
method = 'post';
|
||||
}else{
|
||||
httpurl+=this.url.edit;
|
||||
method = 'put';
|
||||
}
|
||||
|
||||
httpAction(httpurl,this.orderMainModel,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();
|
||||
})
|
||||
|
||||
edit (record) {
|
||||
this.orderMainModel = Object.assign({
|
||||
jeroOrderCustomerList: [{}],
|
||||
jeroOrderTicketList: [{}]
|
||||
}, record)
|
||||
// --------------------------------------------------------
|
||||
// 初始化明细表数据
|
||||
console.log(this.orderMainModel.id)
|
||||
if (this.orderMainModel.id) {
|
||||
const params = { id: this.orderMainModel.id }
|
||||
// 初始化订单机票列表
|
||||
getAction(this.url.orderCustomerList, params).then((res) => {
|
||||
if (res.success) {
|
||||
this.orderMainModel.jeroOrderCustomerList = res.result
|
||||
this.$forceUpdate()
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
addRowCustom () {
|
||||
this.orderMainModel.jeroOrderCustomerList.push({});
|
||||
this.$forceUpdate();
|
||||
},
|
||||
delRowCustom (index) {
|
||||
console.log(index)
|
||||
let all = this.orderMainModel
|
||||
all['jeroOrderCustomerList'].splice(index,1);
|
||||
this.orderMainModel.jeroOrderCustomerList.splice(index,1);
|
||||
this.$forceUpdate();
|
||||
},
|
||||
addRowTicket () {
|
||||
this.orderMainModel.jeroOrderTicketList.push({});
|
||||
console.log(this.orderMainModel.jeroOrderTicketList)
|
||||
this.$forceUpdate();
|
||||
},
|
||||
delRowTicket (index) {
|
||||
console.log(index)
|
||||
let all = this.orderMainModel
|
||||
all['jeroOrderTicketList'].splice(index,1);
|
||||
this.orderMainModel.jeroOrderTicketList.splice(index,1);
|
||||
this.$forceUpdate();
|
||||
},
|
||||
// 初始化订单客户列表
|
||||
getAction(this.url.orderTicketList, params).then((res) => {
|
||||
if (res.success) {
|
||||
this.orderMainModel.jeroOrderTicketList = res.result
|
||||
this.$forceUpdate()
|
||||
}
|
||||
})
|
||||
}
|
||||
this.visible = true
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
},
|
||||
handleOk () {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
let httpurl = ''
|
||||
let method = ''
|
||||
if (!this.orderMainModel.id) {
|
||||
httpurl += this.url.add
|
||||
method = 'post'
|
||||
} else {
|
||||
httpurl += this.url.edit
|
||||
method = 'put'
|
||||
}
|
||||
|
||||
httpAction(httpurl, this.orderMainModel, 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()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
addRowCustom () {
|
||||
this.orderMainModel.jeroOrderCustomerList.push({})
|
||||
this.$forceUpdate()
|
||||
},
|
||||
delRowCustom (index) {
|
||||
console.log(index)
|
||||
const all = this.orderMainModel
|
||||
all.jeroOrderCustomerList.splice(index, 1)
|
||||
this.orderMainModel.jeroOrderCustomerList.splice(index, 1)
|
||||
this.$forceUpdate()
|
||||
},
|
||||
addRowTicket () {
|
||||
this.orderMainModel.jeroOrderTicketList.push({})
|
||||
console.log(this.orderMainModel.jeroOrderTicketList)
|
||||
this.$forceUpdate()
|
||||
},
|
||||
delRowTicket (index) {
|
||||
console.log(index)
|
||||
const all = this.orderMainModel
|
||||
all.jeroOrderTicketList.splice(index, 1)
|
||||
this.orderMainModel.jeroOrderTicketList.splice(index, 1)
|
||||
this.$forceUpdate()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -82,230 +82,229 @@
|
||||
|
||||
<script>
|
||||
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
import { FormTypes, VALIDATE_NO_PASSED, getRefPromise, validateFormModelAndTables } from '@/utils/JEditableTableUtil'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
import JDate from '@/components/jero/JDate'
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
import { FormTypes, VALIDATE_NO_PASSED, getRefPromise, validateFormModelAndTables } from '@/utils/JEditableTableUtil'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
import JDate from '@/components/jero/JDate'
|
||||
|
||||
export default {
|
||||
name: 'JeroOrderModalForJEditableTable',
|
||||
components: {
|
||||
JDate, JEditableTable
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
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/jeroOrderMain/add',
|
||||
edit: '/test/jeroOrderMain/edit',
|
||||
orderCustomerList: '/test/jeroOrderMain/queryOrderCustomerListByMainId',
|
||||
orderTicketList: '/test/jeroOrderMain/queryOrderTicketListByMainId'
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
|
||||
// 获取所有的editableTable实例
|
||||
getAllTable() {
|
||||
return Promise.all([
|
||||
getRefPromise(this, 'editableTable1'),
|
||||
getRefPromise(this, 'editableTable2')
|
||||
])
|
||||
export default {
|
||||
name: 'JeroOrderModalForJEditableTable',
|
||||
components: {
|
||||
JDate, JEditableTable
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 }
|
||||
},
|
||||
|
||||
add() {
|
||||
// 默认新增一条数据
|
||||
this.getAllTable().then(editableTables => {
|
||||
editableTables[0].add()
|
||||
editableTables[1].add()
|
||||
})
|
||||
|
||||
this.edit({})
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 24 - 6 }
|
||||
},
|
||||
edit(record) {
|
||||
this.visible = true
|
||||
this.activeKey = '1'
|
||||
this.model = Object.assign({}, record)
|
||||
// 加载子表数据
|
||||
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')
|
||||
this.$refs.form.resetFields();
|
||||
},
|
||||
/** 查询某个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 validateFormModelAndTables(this.$refs.form,this.model, 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)
|
||||
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}格式不正确'
|
||||
}]
|
||||
}
|
||||
})
|
||||
]
|
||||
},
|
||||
/** 整理成formData */
|
||||
classifyIntoFormData(allValues) {
|
||||
let orderMain = Object.assign(this.model, allValues.formValue)
|
||||
return {
|
||||
...orderMain, // 展开
|
||||
jeroOrderCustomerList: allValues.tablesValue[0].values,
|
||||
jeroOrderTicketList: 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)
|
||||
// 机票信息
|
||||
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: ''
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
]
|
||||
},
|
||||
url: {
|
||||
add: '/test/jeroOrderMain/add',
|
||||
edit: '/test/jeroOrderMain/edit',
|
||||
orderCustomerList: '/test/jeroOrderMain/queryOrderCustomerListByMainId',
|
||||
orderTicketList: '/test/jeroOrderMain/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.model = Object.assign({}, record)
|
||||
// 加载子表数据
|
||||
if (this.model.id) {
|
||||
const 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')
|
||||
this.$refs.form.resetFields()
|
||||
},
|
||||
/** 查询某个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 validateFormModelAndTables(this.$refs.form, this.model, tables)
|
||||
}).then(allValues => {
|
||||
const 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) {
|
||||
const orderMain = Object.assign(this.model, allValues.formValue)
|
||||
return {
|
||||
...orderMain, // 展开
|
||||
jeroOrderCustomerList: allValues.tablesValue[0].values,
|
||||
jeroOrderTicketList: allValues.tablesValue[1].values
|
||||
}
|
||||
},
|
||||
/** 发起新增或修改的请求 */
|
||||
requestAddOrEdit (formData) {
|
||||
let url = this.url.add; let 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>
|
||||
</style>
|
||||
|
||||
@@ -12,45 +12,45 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Vue from 'vue'
|
||||
import { ACCESS_TOKEN } from "@/store/mutation-types"
|
||||
|
||||
export default {
|
||||
name: "PdfPreviewModal",
|
||||
data () {
|
||||
return {
|
||||
url: window._CONFIG['pdfDomainURL'],
|
||||
id:"pdfPreviewIframe",
|
||||
headers:{}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
const token = Vue.ls.get(ACCESS_TOKEN);
|
||||
this.headers = {"X-Access-Token":token}
|
||||
},
|
||||
computed:{
|
||||
|
||||
},
|
||||
mounted(){
|
||||
window.addEventListener('message', this.handleScanFileMessage);
|
||||
},
|
||||
methods: {
|
||||
handleScanFileMessage (event) {
|
||||
// 根据上面制定的结构来解析iframe内部发回来的数据
|
||||
const data = event.data;
|
||||
console.log(data);
|
||||
},
|
||||
|
||||
previewFiles (title,token) {
|
||||
var iframe = document.getElementById("pdfPreviewIframe");
|
||||
var json = {"title":title,"token":token};
|
||||
iframe.contentWindow.postMessage(json, "*");
|
||||
},
|
||||
import Vue from 'vue'
|
||||
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
||||
|
||||
export default {
|
||||
name: 'PdfPreviewModal',
|
||||
data () {
|
||||
return {
|
||||
url: window._CONFIG.pdfDomainURL,
|
||||
id: 'pdfPreviewIframe',
|
||||
headers: {}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
const token = Vue.ls.get(ACCESS_TOKEN)
|
||||
this.headers = { 'X-Access-Token': token }
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
mounted () {
|
||||
window.addEventListener('message', this.handleScanFileMessage)
|
||||
},
|
||||
methods: {
|
||||
handleScanFileMessage (event) {
|
||||
// 根据上面制定的结构来解析iframe内部发回来的数据
|
||||
const data = event.data
|
||||
console.log(data)
|
||||
},
|
||||
|
||||
previewFiles (title, token) {
|
||||
var iframe = document.getElementById('pdfPreviewIframe')
|
||||
var json = { title: title, token: token }
|
||||
iframe.contentWindow.postMessage(json, '*')
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -6,22 +6,22 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ImgTurnPage from '../ImgTurnPage'
|
||||
export default {
|
||||
name: "SplitPanelAModal",
|
||||
components:{
|
||||
ImgTurnPage
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
import ImgTurnPage from '../ImgTurnPage'
|
||||
export default {
|
||||
name: 'SplitPanelAModal',
|
||||
components: {
|
||||
ImgTurnPage
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -6,22 +6,22 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ImgTurnPage from '../ImgTurnPage'
|
||||
export default {
|
||||
name: "SplitPanelAModal",
|
||||
components:{
|
||||
ImgTurnPage
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
import ImgTurnPage from '../ImgTurnPage'
|
||||
export default {
|
||||
name: 'SplitPanelAModal',
|
||||
components: {
|
||||
ImgTurnPage
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -22,42 +22,42 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import splitPane from 'vue-splitpane'
|
||||
import SplitPanelA from './SplitPanelA'
|
||||
import SplitPanelB from './SplitPanelB'
|
||||
export default {
|
||||
name: "SplitPanelModal",
|
||||
components:{
|
||||
splitPane,
|
||||
SplitPanelA,
|
||||
SplitPanelB
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
visible: false,
|
||||
bodyStyle:{
|
||||
padding: "0",
|
||||
height:(window.innerHeight-150)+"px"
|
||||
},
|
||||
modalWidth:800,
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.modalWidth = window.innerWidth-0;
|
||||
},
|
||||
methods: {
|
||||
show () {
|
||||
this.visible = true;
|
||||
import splitPane from 'vue-splitpane'
|
||||
import SplitPanelA from './SplitPanelA'
|
||||
import SplitPanelB from './SplitPanelB'
|
||||
export default {
|
||||
name: 'SplitPanelModal',
|
||||
components: {
|
||||
splitPane,
|
||||
SplitPanelA,
|
||||
SplitPanelB
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
visible: false,
|
||||
bodyStyle: {
|
||||
padding: '0',
|
||||
height: (window.innerHeight - 150) + 'px'
|
||||
},
|
||||
handleOk(){
|
||||
modalWidth: 800
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.modalWidth = window.innerWidth - 0
|
||||
},
|
||||
methods: {
|
||||
show () {
|
||||
this.visible = true
|
||||
},
|
||||
handleOk () {
|
||||
|
||||
},
|
||||
handleCancel () {
|
||||
this.visible = false;
|
||||
},
|
||||
},
|
||||
handleCancel () {
|
||||
this.visible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -51,45 +51,45 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { httpAction } from '@/api/manage'
|
||||
import { httpAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: "SuperQueryModal",
|
||||
data () {
|
||||
return {
|
||||
visible: false,
|
||||
queryParamsModel: [{},{}],
|
||||
confirmLoading: false
|
||||
}
|
||||
export default {
|
||||
name: 'SuperQueryModal',
|
||||
data () {
|
||||
return {
|
||||
visible: false,
|
||||
queryParamsModel: [{}, {}],
|
||||
confirmLoading: false
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
show () {
|
||||
this.visible = true
|
||||
},
|
||||
created () {
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
},
|
||||
methods: {
|
||||
show () {
|
||||
this.visible = true;
|
||||
},
|
||||
close () {
|
||||
this.$emit('close');
|
||||
this.visible = false;
|
||||
},
|
||||
handleOk () {
|
||||
console.log(this.queryParamsModel)
|
||||
// 子组件中触发父组件方法ee并传值cc12345
|
||||
this.$emit('handleSuperQuery', this.queryParamsModel)
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
handleAdd () {
|
||||
this.queryParamsModel.push({});
|
||||
},
|
||||
handleDel (index) {
|
||||
console.log(index)
|
||||
this.queryParamsModel.splice(index,1);
|
||||
}
|
||||
handleOk () {
|
||||
console.log(this.queryParamsModel)
|
||||
// 子组件中触发父组件方法ee并传值cc12345
|
||||
this.$emit('handleSuperQuery', this.queryParamsModel)
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
handleAdd () {
|
||||
this.queryParamsModel.push({})
|
||||
},
|
||||
handleDel (index) {
|
||||
console.log(index)
|
||||
this.queryParamsModel.splice(index, 1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -250,384 +250,384 @@
|
||||
</a-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
export default {
|
||||
name:'VueCron',
|
||||
props:['data','i18n'],
|
||||
data(){
|
||||
return {
|
||||
visible: false,
|
||||
confirmLoading:false,
|
||||
size:'large',
|
||||
weekDays:['天','一','二','三','四','五','六'].map(val=>'星期'+val),
|
||||
result: {
|
||||
second:{
|
||||
cronEvery:'',
|
||||
incrementStart:3,
|
||||
incrementIncrement:5,
|
||||
rangeStart:1,
|
||||
rangeEnd:0,
|
||||
specificSpecific:[],
|
||||
},
|
||||
minute:{
|
||||
cronEvery:'',
|
||||
incrementStart:3,
|
||||
incrementIncrement:5,
|
||||
rangeStart:1,
|
||||
rangeEnd:'0',
|
||||
specificSpecific:[],
|
||||
},
|
||||
hour:{
|
||||
cronEvery:'',
|
||||
incrementStart:3,
|
||||
incrementIncrement:5,
|
||||
rangeStart:'0',
|
||||
rangeEnd:'0',
|
||||
specificSpecific:[],
|
||||
},
|
||||
day:{
|
||||
cronEvery:'',
|
||||
incrementStart:1,
|
||||
incrementIncrement:'1',
|
||||
rangeStart:'',
|
||||
rangeEnd:'',
|
||||
specificSpecific:[],
|
||||
cronLastSpecificDomDay:1,
|
||||
cronDaysBeforeEomMinus:'',
|
||||
cronDaysNearestWeekday:'',
|
||||
},
|
||||
week:{
|
||||
cronEvery:'',
|
||||
incrementStart:1,
|
||||
incrementIncrement:'1',
|
||||
specificSpecific:[],
|
||||
cronNthDayDay:1,
|
||||
cronNthDayNth:'1',
|
||||
},
|
||||
month:{
|
||||
cronEvery:'',
|
||||
incrementStart:3,
|
||||
incrementIncrement:5,
|
||||
rangeStart:1,
|
||||
rangeEnd:1,
|
||||
specificSpecific:[],
|
||||
},
|
||||
year:{
|
||||
cronEvery:'',
|
||||
incrementStart:2017,
|
||||
incrementIncrement:1,
|
||||
rangeStart:2019,
|
||||
rangeEnd: 2019,
|
||||
specificSpecific:[],
|
||||
},
|
||||
label:''
|
||||
},
|
||||
output:{
|
||||
second:{
|
||||
cronEvery:'',
|
||||
incrementStart:'',
|
||||
incrementIncrement:'',
|
||||
rangeStart:'',
|
||||
rangeEnd:'',
|
||||
specificSpecific:[],
|
||||
},
|
||||
minute:{
|
||||
cronEvery:'',
|
||||
incrementStart:'',
|
||||
incrementIncrement:'',
|
||||
rangeStart:'',
|
||||
rangeEnd:'',
|
||||
specificSpecific:[],
|
||||
},
|
||||
hour:{
|
||||
cronEvery:'',
|
||||
incrementStart:'',
|
||||
incrementIncrement:'',
|
||||
rangeStart:'',
|
||||
rangeEnd:'',
|
||||
specificSpecific:[],
|
||||
},
|
||||
day:{
|
||||
cronEvery:'',
|
||||
incrementStart:'',
|
||||
incrementIncrement:'',
|
||||
rangeStart:'',
|
||||
rangeEnd:'',
|
||||
specificSpecific:[],
|
||||
cronLastSpecificDomDay:'',
|
||||
cronDaysBeforeEomMinus:'',
|
||||
cronDaysNearestWeekday:'',
|
||||
},
|
||||
week:{
|
||||
cronEvery:'',
|
||||
incrementStart:'',
|
||||
incrementIncrement:'',
|
||||
specificSpecific:[],
|
||||
cronNthDayDay:'',
|
||||
cronNthDayNth:'',
|
||||
},
|
||||
month:{
|
||||
cronEvery:'',
|
||||
incrementStart:'',
|
||||
incrementIncrement:'',
|
||||
rangeStart:'',
|
||||
rangeEnd:'',
|
||||
specificSpecific:[],
|
||||
},
|
||||
year:{
|
||||
cronEvery:'',
|
||||
incrementStart:'',
|
||||
incrementIncrement:'',
|
||||
rangeStart:'',
|
||||
rangeEnd:'',
|
||||
specificSpecific:[],
|
||||
}
|
||||
}
|
||||
}
|
||||
import pick from 'lodash.pick'
|
||||
export default {
|
||||
name: 'VueCron',
|
||||
props: ['data', 'i18n'],
|
||||
data () {
|
||||
return {
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
size: 'large',
|
||||
weekDays: ['天', '一', '二', '三', '四', '五', '六'].map(val => '星期' + val),
|
||||
result: {
|
||||
second: {
|
||||
cronEvery: '',
|
||||
incrementStart: 3,
|
||||
incrementIncrement: 5,
|
||||
rangeStart: 1,
|
||||
rangeEnd: 0,
|
||||
specificSpecific: []
|
||||
},
|
||||
computed: {
|
||||
modalWidth(){
|
||||
return 608;
|
||||
},
|
||||
text(){
|
||||
return Language['cn']
|
||||
},
|
||||
secondsText() {
|
||||
let seconds = '';
|
||||
let cronEvery=this.result.second.cronEvery;
|
||||
switch (cronEvery.toString()){
|
||||
case '1':
|
||||
seconds = '*';
|
||||
break;
|
||||
case '2':
|
||||
seconds = this.result.second.incrementStart+'/'+this.result.second.incrementIncrement;
|
||||
break;
|
||||
case '3':
|
||||
this.result.second.specificSpecific.map(val=> {seconds += val+','});
|
||||
seconds = seconds.slice(0, -1);
|
||||
break;
|
||||
case '4':
|
||||
seconds = this.result.second.rangeStart+'-'+this.result.second.rangeEnd;
|
||||
break;
|
||||
}
|
||||
return seconds;
|
||||
},
|
||||
minutesText() {
|
||||
let minutes = '';
|
||||
let cronEvery=this.result.minute.cronEvery;
|
||||
switch (cronEvery.toString()){
|
||||
case '1':
|
||||
minutes = '*';
|
||||
break;
|
||||
case '2':
|
||||
minutes = this.result.minute.incrementStart+'/'+this.result.minute.incrementIncrement;
|
||||
break;
|
||||
case '3':
|
||||
this.result.minute.specificSpecific.map(val=> {
|
||||
minutes += val+','
|
||||
});
|
||||
minutes = minutes.slice(0, -1);
|
||||
break;
|
||||
case '4':
|
||||
minutes = this.result.minute.rangeStart+'-'+this.result.minute.rangeEnd;
|
||||
break;
|
||||
}
|
||||
return minutes;
|
||||
},
|
||||
hoursText() {
|
||||
let hours = '';
|
||||
let cronEvery=this.result.hour.cronEvery;
|
||||
switch (cronEvery.toString()){
|
||||
case '1':
|
||||
hours = '*';
|
||||
break;
|
||||
case '2':
|
||||
hours = this.result.hour.incrementStart+'/'+this.result.hour.incrementIncrement;
|
||||
break;
|
||||
case '3':
|
||||
this.result.hour.specificSpecific.map(val=> {
|
||||
hours += val+','
|
||||
});
|
||||
hours = hours.slice(0, -1);
|
||||
break;
|
||||
case '4':
|
||||
hours = this.result.hour.rangeStart+'-'+this.result.hour.rangeEnd;
|
||||
break;
|
||||
}
|
||||
return hours;
|
||||
},
|
||||
daysText() {
|
||||
let days='';
|
||||
let cronEvery=this.result.day.cronEvery;
|
||||
switch (cronEvery.toString()){
|
||||
case '1':
|
||||
break;
|
||||
case '2':
|
||||
case '4':
|
||||
case '11':
|
||||
days = '?';
|
||||
break;
|
||||
case '3':
|
||||
days = this.result.day.incrementStart+'/'+this.result.day.incrementIncrement;
|
||||
break;
|
||||
case '5':
|
||||
this.result.day.specificSpecific.map(val=> {
|
||||
days += val+','
|
||||
});
|
||||
days = days.slice(0, -1);
|
||||
break;
|
||||
case '6':
|
||||
days = "L";
|
||||
break;
|
||||
case '7':
|
||||
days = "LW";
|
||||
break;
|
||||
case '8':
|
||||
days = this.result.day.cronLastSpecificDomDay + 'L';
|
||||
break;
|
||||
case '9':
|
||||
days = 'L-' + this.result.day.cronDaysBeforeEomMinus;
|
||||
break;
|
||||
case '10':
|
||||
days = this.result.day.cronDaysNearestWeekday+"W";
|
||||
break
|
||||
}
|
||||
return days;
|
||||
},
|
||||
weeksText() {
|
||||
let weeks = '';
|
||||
let cronEvery=this.result.day.cronEvery;
|
||||
switch (cronEvery.toString()){
|
||||
case '1':
|
||||
case '3':
|
||||
case '5':
|
||||
weeks = '?';
|
||||
break;
|
||||
case '2':
|
||||
weeks = this.result.week.incrementStart+'/'+this.result.week.incrementIncrement;
|
||||
break;
|
||||
case '4':
|
||||
this.result.week.specificSpecific.map(val=> {
|
||||
weeks += val+','
|
||||
});
|
||||
weeks = weeks.slice(0, -1);
|
||||
break;
|
||||
case '6':
|
||||
case '7':
|
||||
case '8':
|
||||
case '9':
|
||||
case '10':
|
||||
weeks = "?";
|
||||
break;
|
||||
case '11':
|
||||
weeks = this.result.week.cronNthDayDay+"#"+this.result.week.cronNthDayNth;
|
||||
break;
|
||||
}
|
||||
return weeks;
|
||||
},
|
||||
monthsText() {
|
||||
let months = '';
|
||||
let cronEvery=this.result.month.cronEvery;
|
||||
switch (cronEvery.toString()){
|
||||
case '1':
|
||||
months = '*';
|
||||
break;
|
||||
case '2':
|
||||
months = this.result.month.incrementStart+'/'+this.result.month.incrementIncrement;
|
||||
break;
|
||||
case '3':
|
||||
this.result.month.specificSpecific.map(val=> {
|
||||
months += val+','
|
||||
});
|
||||
months = months.slice(0, -1);
|
||||
break;
|
||||
case '4':
|
||||
months = this.result.month.rangeStart+'-'+this.result.month.rangeEnd;
|
||||
break;
|
||||
}
|
||||
return months;
|
||||
},
|
||||
yearsText() {
|
||||
let years = '';
|
||||
let cronEvery=this.result.year.cronEvery;
|
||||
switch (cronEvery.toString()){
|
||||
case '1':
|
||||
years = '*';
|
||||
break;
|
||||
case '2':
|
||||
years = this.result.year.incrementStart+'/'+this.result.year.incrementIncrement;
|
||||
break;
|
||||
case '3':
|
||||
this.result.year.specificSpecific.map(val=> {
|
||||
years += val+','
|
||||
});
|
||||
years = years.slice(0, -1);
|
||||
break;
|
||||
case '4':
|
||||
years = this.result.year.rangeStart+'-'+this.result.year.rangeEnd;
|
||||
break;
|
||||
}
|
||||
return years;
|
||||
},
|
||||
cron(){
|
||||
return {
|
||||
value: this.result,
|
||||
label:`${this.secondsText||'*'} ${this.minutesText||'*'} ${this.hoursText||'*'} ${this.daysText||'*'} ${this.monthsText||'*'} ${this.weeksText||'*'} ${this.yearsText||'*'}`
|
||||
}
|
||||
},
|
||||
minute: {
|
||||
cronEvery: '',
|
||||
incrementStart: 3,
|
||||
incrementIncrement: 5,
|
||||
rangeStart: 1,
|
||||
rangeEnd: '0',
|
||||
specificSpecific: []
|
||||
},
|
||||
watch:{
|
||||
data(){
|
||||
//this.rest(this.data);
|
||||
}
|
||||
hour: {
|
||||
cronEvery: '',
|
||||
incrementStart: 3,
|
||||
incrementIncrement: 5,
|
||||
rangeStart: '0',
|
||||
rangeEnd: '0',
|
||||
specificSpecific: []
|
||||
},
|
||||
methods: {
|
||||
show(){
|
||||
//this.rest(pick(this.data.value,'second','minute','hour','day','week','month','year'));
|
||||
//this.rest(this.data.value);
|
||||
Object.assign(this.data.value,this.result);
|
||||
console.log('data初始化',this.data);
|
||||
//this.result = this.data.value;
|
||||
this.visible=true;
|
||||
},
|
||||
getValue(){
|
||||
return this.cron;
|
||||
},
|
||||
change(){
|
||||
console.log('返回前',this.cron);
|
||||
this.$emit('change',this.cron);
|
||||
this.close();
|
||||
this.visible = false;
|
||||
},
|
||||
close(){
|
||||
this.visible = false;
|
||||
//this.$emit('close')
|
||||
},
|
||||
rest(data){
|
||||
for(let i in data){
|
||||
console.log(data[i]);
|
||||
if(data[i] instanceof Object){
|
||||
this.rest(data[i])
|
||||
}else {
|
||||
switch(typeof data[i]) {
|
||||
case 'object':
|
||||
data[i] = [];
|
||||
break;
|
||||
case 'string':
|
||||
data[i] = '';
|
||||
break;
|
||||
case 'number':
|
||||
data[i] = null;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
callback (key) {
|
||||
//console.log(key)
|
||||
}
|
||||
day: {
|
||||
cronEvery: '',
|
||||
incrementStart: 1,
|
||||
incrementIncrement: '1',
|
||||
rangeStart: '',
|
||||
rangeEnd: '',
|
||||
specificSpecific: [],
|
||||
cronLastSpecificDomDay: 1,
|
||||
cronDaysBeforeEomMinus: '',
|
||||
cronDaysNearestWeekday: ''
|
||||
},
|
||||
week: {
|
||||
cronEvery: '',
|
||||
incrementStart: 1,
|
||||
incrementIncrement: '1',
|
||||
specificSpecific: [],
|
||||
cronNthDayDay: 1,
|
||||
cronNthDayNth: '1'
|
||||
},
|
||||
month: {
|
||||
cronEvery: '',
|
||||
incrementStart: 3,
|
||||
incrementIncrement: 5,
|
||||
rangeStart: 1,
|
||||
rangeEnd: 1,
|
||||
specificSpecific: []
|
||||
},
|
||||
year: {
|
||||
cronEvery: '',
|
||||
incrementStart: 2017,
|
||||
incrementIncrement: 1,
|
||||
rangeStart: 2019,
|
||||
rangeEnd: 2019,
|
||||
specificSpecific: []
|
||||
},
|
||||
label: ''
|
||||
},
|
||||
output: {
|
||||
second: {
|
||||
cronEvery: '',
|
||||
incrementStart: '',
|
||||
incrementIncrement: '',
|
||||
rangeStart: '',
|
||||
rangeEnd: '',
|
||||
specificSpecific: []
|
||||
},
|
||||
minute: {
|
||||
cronEvery: '',
|
||||
incrementStart: '',
|
||||
incrementIncrement: '',
|
||||
rangeStart: '',
|
||||
rangeEnd: '',
|
||||
specificSpecific: []
|
||||
},
|
||||
hour: {
|
||||
cronEvery: '',
|
||||
incrementStart: '',
|
||||
incrementIncrement: '',
|
||||
rangeStart: '',
|
||||
rangeEnd: '',
|
||||
specificSpecific: []
|
||||
},
|
||||
day: {
|
||||
cronEvery: '',
|
||||
incrementStart: '',
|
||||
incrementIncrement: '',
|
||||
rangeStart: '',
|
||||
rangeEnd: '',
|
||||
specificSpecific: [],
|
||||
cronLastSpecificDomDay: '',
|
||||
cronDaysBeforeEomMinus: '',
|
||||
cronDaysNearestWeekday: ''
|
||||
},
|
||||
week: {
|
||||
cronEvery: '',
|
||||
incrementStart: '',
|
||||
incrementIncrement: '',
|
||||
specificSpecific: [],
|
||||
cronNthDayDay: '',
|
||||
cronNthDayNth: ''
|
||||
},
|
||||
month: {
|
||||
cronEvery: '',
|
||||
incrementStart: '',
|
||||
incrementIncrement: '',
|
||||
rangeStart: '',
|
||||
rangeEnd: '',
|
||||
specificSpecific: []
|
||||
},
|
||||
year: {
|
||||
cronEvery: '',
|
||||
incrementStart: '',
|
||||
incrementIncrement: '',
|
||||
rangeStart: '',
|
||||
rangeEnd: '',
|
||||
specificSpecific: []
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
modalWidth () {
|
||||
return 608
|
||||
},
|
||||
text () {
|
||||
return Language.cn
|
||||
},
|
||||
secondsText () {
|
||||
let seconds = ''
|
||||
const cronEvery = this.result.second.cronEvery
|
||||
switch (cronEvery.toString()) {
|
||||
case '1':
|
||||
seconds = '*'
|
||||
break
|
||||
case '2':
|
||||
seconds = this.result.second.incrementStart + '/' + this.result.second.incrementIncrement
|
||||
break
|
||||
case '3':
|
||||
this.result.second.specificSpecific.map(val => { seconds += val + ',' })
|
||||
seconds = seconds.slice(0, -1)
|
||||
break
|
||||
case '4':
|
||||
seconds = this.result.second.rangeStart + '-' + this.result.second.rangeEnd
|
||||
break
|
||||
}
|
||||
return seconds
|
||||
},
|
||||
minutesText () {
|
||||
let minutes = ''
|
||||
const cronEvery = this.result.minute.cronEvery
|
||||
switch (cronEvery.toString()) {
|
||||
case '1':
|
||||
minutes = '*'
|
||||
break
|
||||
case '2':
|
||||
minutes = this.result.minute.incrementStart + '/' + this.result.minute.incrementIncrement
|
||||
break
|
||||
case '3':
|
||||
this.result.minute.specificSpecific.map(val => {
|
||||
minutes += val + ','
|
||||
})
|
||||
minutes = minutes.slice(0, -1)
|
||||
break
|
||||
case '4':
|
||||
minutes = this.result.minute.rangeStart + '-' + this.result.minute.rangeEnd
|
||||
break
|
||||
}
|
||||
return minutes
|
||||
},
|
||||
hoursText () {
|
||||
let hours = ''
|
||||
const cronEvery = this.result.hour.cronEvery
|
||||
switch (cronEvery.toString()) {
|
||||
case '1':
|
||||
hours = '*'
|
||||
break
|
||||
case '2':
|
||||
hours = this.result.hour.incrementStart + '/' + this.result.hour.incrementIncrement
|
||||
break
|
||||
case '3':
|
||||
this.result.hour.specificSpecific.map(val => {
|
||||
hours += val + ','
|
||||
})
|
||||
hours = hours.slice(0, -1)
|
||||
break
|
||||
case '4':
|
||||
hours = this.result.hour.rangeStart + '-' + this.result.hour.rangeEnd
|
||||
break
|
||||
}
|
||||
return hours
|
||||
},
|
||||
daysText () {
|
||||
let days = ''
|
||||
const cronEvery = this.result.day.cronEvery
|
||||
switch (cronEvery.toString()) {
|
||||
case '1':
|
||||
break
|
||||
case '2':
|
||||
case '4':
|
||||
case '11':
|
||||
days = '?'
|
||||
break
|
||||
case '3':
|
||||
days = this.result.day.incrementStart + '/' + this.result.day.incrementIncrement
|
||||
break
|
||||
case '5':
|
||||
this.result.day.specificSpecific.map(val => {
|
||||
days += val + ','
|
||||
})
|
||||
days = days.slice(0, -1)
|
||||
break
|
||||
case '6':
|
||||
days = 'L'
|
||||
break
|
||||
case '7':
|
||||
days = 'LW'
|
||||
break
|
||||
case '8':
|
||||
days = this.result.day.cronLastSpecificDomDay + 'L'
|
||||
break
|
||||
case '9':
|
||||
days = 'L-' + this.result.day.cronDaysBeforeEomMinus
|
||||
break
|
||||
case '10':
|
||||
days = this.result.day.cronDaysNearestWeekday + 'W'
|
||||
break
|
||||
}
|
||||
return days
|
||||
},
|
||||
weeksText () {
|
||||
let weeks = ''
|
||||
const cronEvery = this.result.day.cronEvery
|
||||
switch (cronEvery.toString()) {
|
||||
case '1':
|
||||
case '3':
|
||||
case '5':
|
||||
weeks = '?'
|
||||
break
|
||||
case '2':
|
||||
weeks = this.result.week.incrementStart + '/' + this.result.week.incrementIncrement
|
||||
break
|
||||
case '4':
|
||||
this.result.week.specificSpecific.map(val => {
|
||||
weeks += val + ','
|
||||
})
|
||||
weeks = weeks.slice(0, -1)
|
||||
break
|
||||
case '6':
|
||||
case '7':
|
||||
case '8':
|
||||
case '9':
|
||||
case '10':
|
||||
weeks = '?'
|
||||
break
|
||||
case '11':
|
||||
weeks = this.result.week.cronNthDayDay + '#' + this.result.week.cronNthDayNth
|
||||
break
|
||||
}
|
||||
return weeks
|
||||
},
|
||||
monthsText () {
|
||||
let months = ''
|
||||
const cronEvery = this.result.month.cronEvery
|
||||
switch (cronEvery.toString()) {
|
||||
case '1':
|
||||
months = '*'
|
||||
break
|
||||
case '2':
|
||||
months = this.result.month.incrementStart + '/' + this.result.month.incrementIncrement
|
||||
break
|
||||
case '3':
|
||||
this.result.month.specificSpecific.map(val => {
|
||||
months += val + ','
|
||||
})
|
||||
months = months.slice(0, -1)
|
||||
break
|
||||
case '4':
|
||||
months = this.result.month.rangeStart + '-' + this.result.month.rangeEnd
|
||||
break
|
||||
}
|
||||
return months
|
||||
},
|
||||
yearsText () {
|
||||
let years = ''
|
||||
const cronEvery = this.result.year.cronEvery
|
||||
switch (cronEvery.toString()) {
|
||||
case '1':
|
||||
years = '*'
|
||||
break
|
||||
case '2':
|
||||
years = this.result.year.incrementStart + '/' + this.result.year.incrementIncrement
|
||||
break
|
||||
case '3':
|
||||
this.result.year.specificSpecific.map(val => {
|
||||
years += val + ','
|
||||
})
|
||||
years = years.slice(0, -1)
|
||||
break
|
||||
case '4':
|
||||
years = this.result.year.rangeStart + '-' + this.result.year.rangeEnd
|
||||
break
|
||||
}
|
||||
return years
|
||||
},
|
||||
cron () {
|
||||
return {
|
||||
value: this.result,
|
||||
label: `${this.secondsText || '*'} ${this.minutesText || '*'} ${this.hoursText || '*'} ${this.daysText || '*'} ${this.monthsText || '*'} ${this.weeksText || '*'} ${this.yearsText || '*'}`
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
data () {
|
||||
// this.rest(this.data);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
show () {
|
||||
// this.rest(pick(this.data.value,'second','minute','hour','day','week','month','year'));
|
||||
// this.rest(this.data.value);
|
||||
Object.assign(this.data.value, this.result)
|
||||
console.log('data初始化', this.data)
|
||||
// this.result = this.data.value;
|
||||
this.visible = true
|
||||
},
|
||||
getValue () {
|
||||
return this.cron
|
||||
},
|
||||
change () {
|
||||
console.log('返回前', this.cron)
|
||||
this.$emit('change', this.cron)
|
||||
this.close()
|
||||
this.visible = false
|
||||
},
|
||||
close () {
|
||||
this.visible = false
|
||||
// this.$emit('close')
|
||||
},
|
||||
rest (data) {
|
||||
for (const i in data) {
|
||||
console.log(data[i])
|
||||
if (data[i] instanceof Object) {
|
||||
this.rest(data[i])
|
||||
} else {
|
||||
switch (typeof data[i]) {
|
||||
case 'object':
|
||||
data[i] = []
|
||||
break
|
||||
case 'string':
|
||||
data[i] = ''
|
||||
break
|
||||
case 'number':
|
||||
data[i] = null
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
callback (key) {
|
||||
// console.log(key)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
|
||||
Reference in New Issue
Block a user