wangyifang
/
cz-hjjc-oa
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

init

Browse Source
master
xy 1 year ago
parent 45617ba587
commit d9a690ad5c
5 changed files with 644 additions and 462 deletions
Show Stats Download Patch File Download Diff File

30
src/api/flow/index.js
Unescape View File

@ -1,5 +1,5 @@
import request from '@/utils/request'
import qs from 'qs'
export function flow(isLoading=false) {
return request({
method: 'get',
@ -8,6 +8,15 @@ export function flow(isLoading=false) {
})
}
export function flowList(params, type) {
return request({
method: 'get',
url: `/api/oa/flow/list/${type}`,
params
})
}
export function preConfig(custom_model_id,isLoading=false) {
return request({
method: 'get',
@ -15,3 +24,22 @@ export function preConfig(custom_model_id,isLoading=false) {
isLoading
})
}
export function create(data,custom_model_id) {
return request({
method: 'post',
url: `/api/oa/flow/create/${custom_model_id}`,
data: qs.stringify(data, { arrayFormat: 'brackets' }),
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
})
}
export function deal(data,flow_id) {
return request({
method: 'post',
url: `/api/oa/flow/deal/${flow_id}`,
data
})
}

198
src/utils/formBuilder.js
Unescape View File

@ -1,5 +1,5 @@
import formBuilderMap from './formBuilderMap'
import { CreateElement } from 'vue'
import { CreateElement, VNode } from 'vue'
import moment from 'moment'
import { getToken } from "@/utils/auth";
import { deepCopy } from "@/utils/index";
@ -7,16 +7,19 @@ import {deepCopy} from "@/utils/index";
* @param {String} device 'desktop' or 'mobile'
* @param {Object} info field参数
* @param {CreateElement} h
* @param {Object} pForm 父级表单对象
* @param {Object} row 子表单的row
* @param {Boolean} pWrite 主表单中子表单字段是否可写
* @return {VNode} 主表单包含el-form-item 子表单表单组件
**/
export default function formBuilder (device, info,h,pForm) {
export default function formBuilder (device, info, h, row, pWrite=false) {
let formItem;
if (device === 'desktop') {
if(info._writeable || (info.type === 'relation' && info._readable) || pWrite) {
switch (info.type) {
case 'text':
formItem = h(formBuilderMap(device).get(info.type),{
props: {
value: pForm ? pForm[info.name] : this.form[info.name],
value: row ? row[info.name] : this.form[info.name],
clearable: true,
placeholder: info.help_text
},
@ -25,7 +28,7 @@ export default function formBuilder (device, info,h,pForm) {
},
on: {
input: e => {
pForm ? this.$set(pForm,info.name,e) : this.$set(this.form,info.name,e)
row ? this.$set(row,info.name,e) : this.$set(this.form,info.name,e)
}
}
})
@ -37,7 +40,7 @@ export default function formBuilder (device, info,h,pForm) {
autosize: {
minRows: 2
},
value: pForm ? pForm[info.name] : this.form[info.name],
value: row ? row[info.name] : this.form[info.name],
clearable: true,
placeholder: info.help_text
},
@ -46,7 +49,7 @@ export default function formBuilder (device, info,h,pForm) {
},
on: {
input: e => {
pForm ? this.$set(pForm,info.name,e) : this.$set(this.form,info.name,e)
row ? this.$set(row,info.name,e) : this.$set(this.form,info.name,e)
}
}
})
@ -57,7 +60,7 @@ export default function formBuilder (device, info,h,pForm) {
type: 'date',
'value-format': 'yyyy-MM-dd',
format: 'yyyy年MM月dd日',
value: pForm ? pForm[info.name] : this.form[info.name],
value: row ? row[info.name] : this.form[info.name],
clearable: true,
placeholder: info.help_text,
'picker-options': {
@ -116,7 +119,7 @@ export default function formBuilder (device, info,h,pForm) {
},
on: {
input: e => {
pForm ? this.$set(pForm,info.name,e) : this.$set(this.form,info.name,e)
row ? this.$set(row,info.name,e) : this.$set(this.form,info.name,e)
}
}
})
@ -127,7 +130,7 @@ export default function formBuilder (device, info,h,pForm) {
type: 'datetime',
'value-format': 'yyyy-MM-dd',
format: 'yyyy年MM月dd日',
value: pForm ? pForm[info.name] : this.form[info.name],
value: row ? row[info.name] : this.form[info.name],
clearable: true,
placeholder: info.help_text,
'picker-options': {
@ -186,7 +189,7 @@ export default function formBuilder (device, info,h,pForm) {
},
on: {
input: e => {
pForm ? this.$set(pForm,info.name,e) : this.$set(this.form,info.name,e)
row ? this.$set(row,info.name,e) : this.$set(this.form,info.name,e)
}
}
})
@ -194,7 +197,7 @@ export default function formBuilder (device, info,h,pForm) {
case 'select':
formItem = h(formBuilderMap(device).get(info.type),{
props: {
value: pForm ? pForm[info.name] : this.form[info.name],
value: row ? row[info.name] : this.form[info.name],
clearable: true,
placeholder: info.help_text
},
@ -203,7 +206,7 @@ export default function formBuilder (device, info,h,pForm) {
},
on: {
input: e => {
pForm ? this.$set(pForm,info.name,e) : this.$set(this.form,info.name,e)
row ? this.$set(row,info.name,e) : this.$set(this.form,info.name,e)
}
}
},[1,2,3].map(option => (
@ -218,14 +221,14 @@ export default function formBuilder (device, info,h,pForm) {
case 'radio':
formItem = h(formBuilderMap(device).get(info.type),{
props: {
value: pForm ? pForm[info.name] : this.form[info.name],
value: row ? row[info.name] : this.form[info.name],
},
attrs: {
placeholder: info.help_text
},
on: {
input: e => {
pForm ? this.$set(pForm,info.name,e) : this.$set(this.form,info.name,e)
row ? this.$set(row,info.name,e) : this.$set(this.form,info.name,e)
}
}
},[1,2,3].map(option => (
@ -356,7 +359,7 @@ export default function formBuilder (device, info,h,pForm) {
type: 'primary'
},
attrs: {
href: pForm ? pForm[info.name] : this.form[info.name],
href: row ? row[info.name] : this.form[info.name],
target: "_blank"
}
},info.label)
@ -368,7 +371,7 @@ export default function formBuilder (device, info,h,pForm) {
case 'choice':
formItem = h(formBuilderMap(device).get(info.type),{
props: {
value: pForm ? pForm[info.name] : this.form[info.name],
value: row ? row[info.name] : this.form[info.name],
clearable: true,
placeholder: info.help_text
},
@ -377,7 +380,7 @@ export default function formBuilder (device, info,h,pForm) {
},
on: {
input: e => {
pForm ? this.$set(pForm,info.name,e) : this.$set(this.form,info.name,e)
row ? this.$set(row,info.name,e) : this.$set(this.form,info.name,e)
}
}
},[1,2,3].map(option => (
@ -392,7 +395,7 @@ export default function formBuilder (device, info,h,pForm) {
case 'choices':
formItem = h(formBuilderMap(device).get(info.type),{
props: {
value: pForm ? pForm[info.name] : this.form[info.name],
value: row ? row[info.name] : this.form[info.name],
clearable: true,
placeholder: info.help_text,
multiple: true
@ -402,7 +405,7 @@ export default function formBuilder (device, info,h,pForm) {
},
on: {
input: e => {
pForm ? this.$set(pForm,info.name,e) : this.$set(this.form,info.name,e)
row ? this.$set(row,info.name,e) : this.$set(this.form,info.name,e)
}
}
},[1,2,3].map(option => (
@ -415,79 +418,123 @@ export default function formBuilder (device, info,h,pForm) {
)))
break;
case 'relation':
formItem = h('div',{
formItem = h('vxe-table',{
ref: `subForm-${info.name}`,
style: {
'margin-top': '10px'
},
props: {
'min-height': '200px',
border: true,
stripe: true,
data: this.form[info.name],
'keep-source': true,
'column-config': { resizable: true },
'show-overflow': true,
'edit-config': info._writeable ? {
trigger: 'click',
mode: 'row',
showStatus: false,
isHover: true,
autoClear: false
} : {}
},
on: {
'edit-closed': ({ row, column }) => {
const $table = this.$refs[`subForm-${info.name}`]
if ($table) {
const field = column.field
const cellValue = row[field]
// 判断单元格值是否被修改
if ($table.isUpdateByRow(row, field)) {
setTimeout(() => {
console.log(`局部保存成功！ ${field}=${cellValue}`)
// 局部更新单元格为已保存状态
$table.reloadRow(row, null, field)
}, 300)
}
}
}
}
},[
h('vxe-toolbar',[
h('el-button',{
slot: 'buttons',
h('vxe-column',{
props: {
type: 'primary',
width: 56,
align: 'center'
},
scopedSlots: {
default: ({ row }) => {
return h('el-button',{
slot: 'default',
style: {
'padding': '9px'
},
props: {
type: 'danger',
size: 'small',
icon: "el-icon-plus"
icon: "el-icon-minus"
},
on: {
click: _ => {
this.form[info.name].push(deepCopy(pForm))
click: async _ => {
const $table = this.$refs[`subForm-${info.name}`]
if ($table) {
await $table.remove(row)
}
}
},'增加')
]),
h('vxe-table',{
}
})
}
}
},[
h('el-button',{
slot: 'header',
style: {
'margin-top': '10px'
'padding': '9px'
},
props: {
stripe: true,
data: this.form[info.name]
type: 'primary',
size: 'small',
icon: "el-icon-plus"
},
on: {
click: async _ => {
const $table = this.$refs[`subForm-${info.name}`]
if ($table) {
const record = {}
const { row: newRow } = await $table.insert(record)
await this.$nextTick()
await $table.setEditRow(newRow)
}
}
},this.subForm.get(info.sub_custom_model_id)?.customModel?.fields?.map((subField,subIndex) => h('vxe-column',{
}
}),
]),
...this.subForm.get(info.sub_custom_model_id)?.customModel?.fields?.map((subField,subIndex) => h('vxe-column',{
props: {
field: subField.name,
title: subField.label,
align: 'center'
align: 'center',
'edit-render': {}
},
scopedSlots: {
edit:({ row }) => {
return formBuilder.bind(this)(device, subField, h, row, info._writeable)
}
},formBuilder.bind(this)(device, subField, h, this.form[info.name][subIndex]))))
}
}))
])
// formItem = h('div', [
// h('div',[
// h('el-button',{
// props: {
// size: "small",
// type: "primary",
// icon: "el-icon-plus"
// },
// on: {
// click: _ => {
// this.form[info.name].push(deepCopy(pForm))
// }
// }
// },'增加')
// ]),
// ...this.form[info.name]?.map((i,subIndex) => h('el-card',[
// h('el-button',{
// props: {
// size: 'small',
// type: 'primary'
// },
// on: {
// click: _ => {
// this.form[info.name].splice(subIndex,1)
// }
// }
// },'删除'),
// h('el-form', {
// class: 'form',
// props: {
// model: this.form[info.name][subIndex],
// 'label-position': 'top'
// }
// },this.subForm.get(info.sub_custom_model_id)?.customModel?.fields.map(subField => formBuilder.bind(this)(device, subField, h, this.form[info.name][subIndex])))
// ]))
// ])
break;
}
return h('el-form-item',{
} else if (info._readable) {
formItem = h('span',{
style: {
color: '#333'
}
},this.form[info.name])
}
if (formItem) {
return row ? formItem : h('el-form-item',{
props: {
prop: info.name,
label: info.label
@ -500,6 +547,7 @@ export default function formBuilder (device, info,h,pForm) {
}
},[formItem])
}
}
if(device === 'mobile') {
switch (info.type) {
case 'text':

31
src/views/flow/DesktopForm.vue
Unescape View File

@ -3,6 +3,16 @@ import { deepCopy } from "@/utils"
import formBuilder from '@/utils/formBuilder'
export default {
props: {
readable: {
type: Array,
default: () => [],
required: true
},
writeable: {
type: Array,
default: () => [],
required: true
},
originalForm: {
type: Object,
default: () => ({}),
@ -17,18 +27,21 @@ export default {
default: 'desktop',
required: true
},
info: {
fields: {
type: Array,
default: () => [],
required: true
},
fileList: {
type: Object,
default: () => ({}),
required: true
}
},
data() {
return {
form: {},
file: {
ggg: []
}
file: {}
}
},
methods: {
@ -45,16 +58,24 @@ export default {
},
originalForm(newVal) {
this.form = deepCopy(newVal)
},
fileList(newVal) {
this.file = deepCopy(newVal)
}
},
render(h) {
const authFields = this.fields.map(field => ({
...field,
_readable: this.readable.indexOf(field.id) !== -1,
_writeable: this.writeable.indexOf(field.id) !== -1
}))
return h('el-form', {
class: 'form',
props: {
model: this.form,
'label-position': 'top'
}
},this.info.map(field => formBuilder.bind(this)(this.device, field, h)))
},authFields.map(field => formBuilder.bind(this)(this.device, field, h)))
}
}
</script>

93
src/views/flow/create.vue
Unescape View File

@ -1,28 +1,56 @@
<template>
<div class="container">
<el-card shadow="always">
<el-card shadow="always" class="card" style="height: 2000px;">
<template #header>
<p>{{ config.customModel ? config.customModel.name : '办理' }}</p>
</template>
<template>
<div class="steps">
<el-steps :space="120" finish-status="success" align-center>
<el-step :title="node.name" status="finish" icon="el-icon-edit"></el-step>
<el-step v-for="nextNode in node.nextNodes"
:key="nextNode.id"
:title="nextNode.name"
icon="el-icon-right"
status="wait"></el-step>
</el-steps>
</div>
<el-divider></el-divider>
<div class="form-container">
<template v-if="device === 'desktop'">
<DesktopForm :device="device" :sub-form="subConfig" :info="fields" :original-form="form"></DesktopForm>
<DesktopForm :device="device"
ref="desktopForm"
:sub-form="subConfig"
:fields="fields"
:original-form="form"
:readable="readableFields"
:file-list="fileList"
:writeable="writeableFields"></DesktopForm>
</template>
<template v-else>
<MobileForm :device="device" :info="fields"></MobileForm>
</template>
</div>
</template>
<div class="btns" ref="btns">
<el-button type="primary" size="small" @click="submit">保存并流转 <i class="el-icon-right"></i></el-button>
</div>
</el-card>
<el-backtop></el-backtop>
</div>
</template>
<script>
import DesktopForm from "./DesktopForm.vue";
import MobileForm from "./MobileForm.vue";
import { preConfig } from "@/api/flow"
import { preConfig, deal, create } from "@/api/flow"
import { deepCopy } from "@/utils";
export default {
components: {
DesktopForm,
@ -41,6 +69,9 @@ export default {
methods: {
generateForm(object,fields) {
fields.forEach(field => {
if(field.type === 'file') {
this.fileList[field.name] = []
}
if(field.type === 'relation') {
object[field.name] = [{}]
@ -58,7 +89,7 @@ export default {
background: 'rgba(0, 0, 0, 0.8)'
});
try {
const res = await preConfig(this.$route.query.id)
const res = await preConfig(this.$route.query.module_id)
const { fields } = res?.customModel;
let subFormRequest = []
const getSubForm = (id) => {
@ -84,6 +115,39 @@ export default {
this.$message.error("配置失败")
loading.close()
}
},
submit() {
if(this.device === 'desktop') {
console.log(this.$refs['desktopForm'].form)
let copyForm = deepCopy(this.$refs['desktopForm'].form)
let copyFile = deepCopy(this.$refs['desktopForm'].file)
for (let [key, value] of Object.entries(copyFile)) {
if (copyForm.hasOwnProperty(key)) {
copyForm[key] = value.map(i => i.response?.id)?.toString()
}
}
for (let key in copyForm) {
if(copyForm[key] instanceof Array && copyForm[key][0]) {
let formatObj = {}
let subKeys = Object.keys(copyForm[key][0])
subKeys.forEach(key => {
formatObj[key] = []
})
copyForm[key].forEach(item => {
subKeys.forEach(subKey => {
formatObj[subKey].push(item[subKey])
})
})
delete formatObj['_X_ROW_KEY']
copyForm[key] = formatObj
}
}
create(copyForm,this.$route.query.module_id)
console.log(copyForm)
}
}
},
computed: {
@ -92,10 +156,21 @@ export default {
},
fields() {
return this.config?.customModel?.fields || []
},
readableFields() {
return this.config?.currentNode?.readable || []
},
writeableFields() {
return this.config?.currentNode?.writeable || []
},
node() {
return this.config?.currentNode || {}
}
},
created() {
this.getConfig()
},
mounted() {
}
}
</script>
@ -106,6 +181,16 @@ export default {
}
.container {
padding: 20px;
.card {
position: relative;
}
.btns {
margin-top: 10px;
position: sticky;
bottom: 20px;
}
}
.form-container {
}

2
src/views/flow/index.vue
Unescape View File

@ -93,7 +93,7 @@ export default {
this.$router.push({
path: '/flow/create',
query: {
id: flow.id
module_id: flow.id
}
})
}

Write Preview
Loading…
Cancel
Save