suojin
/
bladex_workflow_saber
mirror of https://git.nutflow.vip/blade-workflow/Saber.git
22
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix: model scope submit error

Browse Source
3.x
ssc 3 years ago
parent 1262d4e67c
commit 27da4a2c53
1 changed files with 189 additions and 132 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 321
      src/views/plugin/workflow/components/nf-user-option/index.vue

321
src/views/plugin/workflow/components/nf-user-option/index.vue
Unescape View File

@ -1,137 +1,155 @@
<template> <template>
<el-dialog ref="nf-dialog" <el-dialog
class="nf-dialog" ref="nf-dialog"
v-model="visible" class="nf-dialog"
title="权限配置" v-model="visible"
width="60%" title="权限配置"
:before-close="handleClose" width="60%"
append-to-body> :before-close="handleClose"
<p v-if="all" append-to-body
style="padding: 0 20px;">不限制权限，所有人均可发起：<el-switch v-model="switchAll"></el-switch>（平台需单独配置）</p> >
<el-table v-if="visible" <p v-if="all" style="padding: 0 20px">
:data="data" 不限制权限，所有人均可发起：<el-switch v-model="switchAll"></el-switch>（平台需单独配置）
border </p>
size="default"> <el-table v-if="visible" :data="data" border size="default">
<el-table-column align="center" <el-table-column align="center" header-align="center" width="80">
header-align="center"
width="80">
<template #header> <template #header>
<el-button circle <el-button
type="primary" circle
size="default" type="primary"
icon="el-icon-plus" size="default"
@click="data.push({})"></el-button> icon="el-icon-plus"
@click="data.push({})"
></el-button>
</template> </template>
<template #default="{$index}"> <template #default="{ $index }">
<el-button circle <el-button
type="danger" circle
size="default" type="danger"
icon="el-icon-delete" size="default"
@click="data.splice($index, 1)"></el-button> icon="el-icon-delete"
@click="data.splice($index, 1)"
></el-button>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="类型" <el-table-column label="类型" prop="type" align="center" header-align="center">
prop="type" <template #default="{ row, $index }">
align="center" <el-select
header-align="center"> v-model="row.type"
<template #default="{row, $index}"> size="default"
<el-select v-model="row.type" placeholder="类型"
size="default" @change="handleTypeChange($index)"
placeholder="类型" >
@change="handleTypeChange($index)"> <el-option
<el-option v-for="item in typeList" v-for="item in typeList"
:key="item.value" :key="item.value"
:label="item.label" :label="item.label"
:value="item.value" :value="item.value"
:disabled="Boolean(data.find(d => d.type == item.value)) || (switchAll && !['platform'].includes(item.value))"></el-option> :disabled="
Boolean(data.find(d => d.type == item.value)) ||
(switchAll && !['platform'].includes(item.value))
"
></el-option>
</el-select> </el-select>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="值" <el-table-column label="值" prop="text" align="center" header-align="center">
prop="text" <template #default="{ row, $index }">
align="center"
header-align="center">
<template #default="{row, $index}">
<template v-if="row.type == 'user'"> <template v-if="row.type == 'user'">
<el-input v-model="row.text" <el-input
size="default" v-model="row.text"
placeholder="用户" size="default"
readonly placeholder="用户"
@click="handleSelect($index, 'user-select')"> readonly
@click="handleSelect($index, 'user-select')"
>
<template #append> <template #append>
<el-button icon="el-icon-plus"></el-button> <el-button icon="el-icon-plus"></el-button>
</template> </template>
</el-input> </el-input>
</template> </template>
<template v-else-if="row.type == 'role'"> <template v-else-if="row.type == 'role'">
<el-tree-select :ref="`role_${$index}`" <el-tree-select
v-model="row.value" :ref="`role_${$index}`"
size="default" v-model="row.value"
multiple size="default"
clearable multiple
placeholder="角色" clearable
:data="roleList" placeholder="角色"
:props="roleProps || {label: 'roleName', value: 'id'}" :data="roleList"
@change="handleChange($index, `role_${$index}`)"> show-checkbox
check-strictly
@change="handleChange($index, `role_${$index}`)"
>
</el-tree-select> </el-tree-select>
</template> </template>
<template v-else-if="row.type == 'dept'"> <template v-else-if="row.type == 'dept'">
<el-input v-model="row.text" <el-input
size="default" v-model="row.text"
placeholder="部门" size="default"
readonly placeholder="部门"
@click="handleSelect($index, 'dept-select')"> readonly
@click="handleSelect($index, 'dept-select')"
>
<template #append> <template #append>
<el-button icon="el-icon-plus"></el-button> <el-button icon="el-icon-plus"></el-button>
</template> </template>
</el-input> </el-input>
</template> </template>
<template v-else-if="row.type == 'post'"> <template v-else-if="row.type == 'post'">
<el-tree-select :ref="`post_${$index}`" <el-tree-select
v-model="row.value" :ref="`post_${$index}`"
size="default" v-model="row.value"
multiple size="default"
clearable multiple
placeholder="职位" clearable
:data="postList" placeholder="职位"
:props="postProps || {label: 'postName', value: 'id'}" :data="postList"
@change="handleChange($index, `post_${$index}`)"> show-checkbox
check-strictly
@change="handleChange($index, `post_${$index}`)"
>
</el-tree-select> </el-tree-select>
</template> </template>
<template v-else-if="row.type == 'platform'"> <template v-else-if="row.type == 'platform'">
<el-tree-select :ref="`platform_${$index}`" <el-tree-select
v-model="row.value" :ref="`platform_${$index}`"
size="default" v-model="row.value"
multiple size="default"
clearable multiple
placeholder="平台" clearable
:data="platformList" placeholder="平台"
@change="handleChange($index, `platform_${$index}`)"> :data="platformList"
show-checkbox
check-strictly
@change="handleChange($index, `platform_${$index}`)"
>
</el-tree-select> </el-tree-select>
</template> </template>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<template #footer> <template #footer>
<el-button @click="handleClose" <el-button @click="handleClose" size="default">取消</el-button>
size="default">取消</el-button> <el-button type="primary" @click="handleSubmit" size="default">确定</el-button>
<el-button type="primary"
@click="handleSubmit"
size="default">确定</el-button>
</template> </template>
<nf-user-select ref="user-select" <nf-user-select
check-type="checkbox" ref="user-select"
:user-url="userUrl" check-type="checkbox"
:custom-option="customOption" :user-url="userUrl"
:default-checked="defaultChecked" :custom-option="customOption"
@onConfirm="handleSelectConfirm"></nf-user-select> :default-checked="defaultChecked"
@onConfirm="handleSelectConfirm"
></nf-user-select>
<nf-dept-select ref="dept-select" <nf-dept-select
:url="deptUrl" ref="dept-select"
:custom-option="customOption" :url="deptUrl"
:default-checked="defaultChecked" :custom-option="customOption"
@confirm="handleSelectConfirm"></nf-dept-select> :default-checked="defaultChecked"
@confirm="handleSelectConfirm"
></nf-dept-select>
</el-dialog> </el-dialog>
</template> </template>
<script> <script>
@ -150,36 +168,36 @@ export default {
NfUserSelect, NfDeptSelect NfUserSelect, NfDeptSelect
}, },
computed: { computed: {
userUrl () { userUrl() {
return this.userOption.userUrl return this.userOption.userUrl
}, },
roleUrl () { roleUrl() {
return this.userOption.roleUrl return this.userOption.roleUrl
}, },
deptUrl () { deptUrl() {
return this.userOption.deptUrl return this.userOption.deptUrl
}, },
postUrl () { postUrl() {
return this.userOption.postUrl return this.userOption.postUrl
}, },
customUrl () { customUrl() {
return this.userOption.customUrl return this.userOption.customUrl
}, },
customOption () { customOption() {
return this.userOption.customOption return this.userOption.customOption
}, },
roleProps () { roleProps() {
return this.customOption ? this.customOption.roleProps : null return this.customOption ? this.customOption.roleProps : { label: 'roleName', value: 'id', children: 'children', records: 'data.data' }
}, },
deptProps () { deptProps() {
return this.customOption ? this.customOption.deptProps : null return this.customOption ? this.customOption.deptProps : { label: 'deptName', value: 'id', children: 'children', records: 'data.data' }
}, },
postProps () { postProps() {
return this.customOption ? this.customOption.postProps : null return this.customOption ? this.customOption.postProps : { label: 'postName', value: 'id', children: 'children', records: 'data.data.records' }
} }
}, },
watch: { watch: {
visible (val) { visible(val) {
if (!this.init) { if (!this.init) {
this.getRoleList() this.getRoleList()
// this.getDeptList() // this.getDeptList()
@ -189,13 +207,13 @@ export default {
if (val && this.userOption && this.userOption.data) { if (val && this.userOption && this.userOption.data) {
const data = JSON.parse(JSON.stringify(this.userOption.data)) const data = JSON.parse(JSON.stringify(this.userOption.data))
for (let item of data) { for (let item of data) {
if (['role', 'post'].includes(item.type) && typeof item.value == 'string') item.value = item.value?.split(',') || [] if (['role', 'post', 'platform'].includes(item.type) && typeof item.value == 'string') item.value = item.value?.split(',') || []
} }
this.data = data this.data = data
} }
}, },
}, },
data () { data() {
return { return {
switchAll: false, switchAll: false,
init: false, init: false,
@ -250,51 +268,90 @@ export default {
} }
}, },
methods: { methods: {
handleSelect (index, ref) { handleSelect(index, ref) {
this.selectIndex = index this.selectIndex = index
this.defaultChecked = this.data[index].value this.defaultChecked = this.data[index].value
this.$refs[ref].visible = true this.$refs[ref].visible = true
}, },
handleSelectConfirm (id, name) { handleSelectConfirm(id, name) {
this.data[this.selectIndex].value = id this.data[this.selectIndex].value = id
this.data[this.selectIndex].text = name this.data[this.selectIndex].text = name
}, },
handleTypeChange (index) { handleTypeChange(index) {
const type = this.data[index].type const type = this.data[index].type
this.data[index] = { this.data[index] = {
type, type,
value: ['role', 'post'].includes(type) ? [] : '' value: ['role', 'post', 'platform'].includes(type) ? [] : ''
} }
}, },
handleChange (index, ref) { handleChange(index, ref) {
this.$nextTick(() => { setTimeout(() => {
const text = this.$refs[ref].labelShow.join(',') const text = this.$refs[ref].getCheckedNodes().map(n => n.label).join(',')
if (text) this.data[index].text = text if (text)
this.data[index].text = text
}) })
}, },
getRoleList () { getRoleList() {
this.$axios.get(this.roleUrl).then(res => { this.$axios.get(this.roleUrl).then(res => {
this.roleList = res.data.data const { records } = this.roleProps
const list = this.getAsVal(res, records)
this.handleList(list, this.roleProps)
this.roleList = list
}) })
}, },
getDeptList () { getDeptList() {
this.$axios.get(this.deptUrl).then(res => { this.$axios.get(this.deptUrl).then(res => {
this.deptList = res.data.data const { records } = this.deptProps
const list = this.getAsVal(res, records)
this.handleList(list, this.deptProps)
this.deptList = list
}) })
}, },
getPostList () { getPostList() {
this.$axios.get(this.postUrl, { current: 1, size: 999 }).then(res => { this.$axios.get(this.postUrl, { params: { size: -1 } }).then(res => {
this.postList = res.data.data.records const { records } = this.postProps
const list = this.getAsVal(res, records)
this.handleList(list, this.postProps)
this.postList = list
}) })
}, },
handleSubmit () { handleSubmit() {
this.$emit('submit', this.data.filter(d => d.type && d.value), this.switchAll) let result = this.data.filter(d => d.type && d.value)
result = result.map(item => {
if (['role', 'post', 'platform'].includes(item.type)) {
item.value = item.value.join(',')
}
return item
})
this.$emit('submit', result, this.switchAll)
this.visible = false this.visible = false
}, },
handleClose (done) { handleClose(done) {
this.visible = false this.visible = false
if (done && typeof done == 'function') done() if (done && typeof done == 'function') done()
} },
getAsVal(obj, bind = '') {
let result = this.deepClone(obj)
if (this.validateNull(bind)) return result
bind.split('.').forEach(ele => {
if (!this.validateNull(result[ele])) {
result = result[ele]
} else {
result = ''
}
});
return result
},
handleList(list, props) {
for (let item of list) {
item.label = item[props.label]
item.value = item[props.value]
if (item[props.children]) {
item.children = item[props.children]
this.handleList(item.children, props)
}
}
},
} }
} }
</script> </script>

Write Preview
Loading…
Cancel
Save