123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275 |
- <template>
- <a-card :bordered="false">
- <!--流程申请选择-->
- <a-input-search
- style="margin-bottom: 10px;margin-right:10px;width: 200px"
- v-model="searchProcessKey"
- placeholder="输入流程名称"
- @search="onSearchProcess"
- />
- <a-button @click="onSearchProcess(searchProcessKey)" type="primary">查询</a-button>
- <a-button @click="onSearchProcess('')">重置</a-button>
- <a-button @click="handleToApplyList" type="primary" style="float: right;">前往我的申请列表</a-button>
- <a-empty description="无流程可供选择" v-if="activeKeyAll.length==0" />
- <div v-else>
- <a-collapse v-model="activeKey">
- <a-collapse-panel
- v-for="(value, index) in activeKeyAll"
- :header="filterDictText(dictOptions,value)||'未分类'"
- :key="value"
- >
- <a-list :grid="{ gutter: 10,column:4}" :dataSource="processDataMap[value]">
- <a-list-item slot="renderItem" slot-scope="item">
- <a-card>
- <div slot="title">
- <a-row>
- <a-col span="12" :title="item.name">{{item.name}}</a-col>
- <a-col span="12" style="text-align: right;">
- <a href="javascript:void (0)" @click="chooseProcess(item)">发起申请</a>
- </a-col>
- </a-row>
- </div>
- <b>版本:</b>
- v.{{item.version}}
- <br />
- <b>说明:</b>
- {{item.description}}
- </a-card>
- </a-list-item>
- </a-list>
- </a-collapse-panel>
- </a-collapse>
- </div>
- <!--流程表单-->
- <a-modal :title="lcModa.title" v-model="lcModa.visible" :maskClosable="false" width="80%">
- <!-- <component
- :disabled="lcModa.disabled"
- v-if="lcModa.visible"
- :is="lcModa.formComponent"
- :processData="lcModa.processData"
- :isNew="lcModa.isNew"
- @afterSubmit="afterSub"
- @close="lcModa.visible=false,lcModa.disabled = false"
- ></component>-->
- <template slot="footer">
- <a-button @click="lcModa.visible=false">关闭</a-button>
- <a-button key="back" @click="close">重置</a-button>
- <a-button key="submit" type="primary" @click="handleOkAll" :loading="loadingElse">提交</a-button>
- </template>
- <k-form-build v-if="lcModa.visible" :defaultValue="defaultValue" :value="jsonData" ref="kfb" />
- </a-modal>
- </a-card>
- </template>
- <script>
- import { activitiMixin } from '@/views/activiti/mixins/activitiMixin'
- import JEllipsis from '@/components/jeecg/JEllipsis'
- import JTreeSelect from '@/components/jeecg/JTreeSelect'
- import { initDictOptions, filterDictText } from '@/components/dict/JDictSelectUtil'
- import historicDetail from '@/views/activiti/historicDetail'
- import { deleteAction, getAction, downFile,postAction } from '@/api/manage'
- export default {
- name: 'applyHome',
- mixins: [activitiMixin],
- components: {
- JEllipsis,
- JTreeSelect,
- historicDetail,
- },
- data() {
- return {
- loadingElse: false,
- typeList: [
- 'input',
- 'textarea',
- 'number',
- 'select',
- 'checkbox',
- 'radio',
- 'date',
- 'time',
- 'rate',
- 'slider',
- 'uploadFile',
- 'uploadImg',
- 'switch',
- 'button',
- 'text',
- 'card',
- 'grid',
- 'table',
- ], //"alert","html", "divider",
- description: '所有',
- dictOptions: [],
- url: {
- getProcessDataList: '/activiti_process/listData',
- getFirstNode: '/actProcessIns/getFirstNode',
- applyBusiness: '/actBusiness/apply',
- },
- // 查询条件
- queryParam: {
- createTimeRange: [],
- keyWord: '',
- },
- // 表头
- labelCol: {
- xs: {
- span: 4,
- },
- sm: {
- span: 4,
- },
- },
- wrapperCol: {
- xs: {
- span: 20,
- },
- sm: {
- span: 20,
- },
- },
- processModalVisible: null,
- activeKeyAll: [],
- activeKey: [],
- processDataMap: {},
- searchProcessKey: null,
- addApplyLoading: false,
- lcModa: {
- title: '',
- disabled: false,
- visible: false,
- formComponent: null,
- isNew: false,
- },
- jsonData: {},
- defaultValue: {},
- }
- },
- computed: {},
- mounted() {
- this.initDictConfig()
- this.getProcessList()
- },
- methods: {
- handleOkAll() {
- this.loadingElse = true
- var that = this
- this.$refs.kfb
- .getData()
- .then((values) => {
- console.log('验证通过', values,this.lcModa.processData)
- var formData = {}
- formData.tableId = this.lcModa.processData.customTableId
- formData.procDefId = this.lcModa.processData.id
- formData.procDeTitle = this.lcModa.processData.name
- formData.formText = JSON.stringify(values)
- postAction('/actBusiness/add', formData)
- .then((res) => {
- if (res.success) {
- that.lcModa.visible=false
- that.$message.success('保存成功!')
- that.loadingElse = false
- } else {
- that.$message.error(res.message)
- that.loadingElse = false
- }
- })
- .finally(() => {
- that.loadingElse = false
- })
- })
- },
- close() {
- this.$refs.kfb.reset()
- },
- saveJson(json) {
- console.log(json)
- },
- initDictConfig() {
- //初始化字典 - 流程分类
- initDictOptions('bpm_process_type').then((res) => {
- if (res.success) {
- this.dictOptions = res.result
- }
- })
- },
- filterDictText(dictOptions, text) {
- if (dictOptions instanceof Array) {
- for (let dictItem of dictOptions) {
- if (text === dictItem.value) {
- return dictItem.text
- }
- }
- }
- return text || text == 'null' ? '' : text
- },
- /*加载流程列表*/
- getProcessList() {
- this.addApplyLoading = true
- this.getAction(this.url.getProcessDataList, {
- status: 1,
- roles: true,
- })
- .then((res) => {
- this.activeKeyAll = []
- if (res.success) {
- var result = res.result || []
- if (result.length > 0) {
- let searchProcessKey = this.searchProcessKey
- if (searchProcessKey) {
- //过滤条件
- result = _.filter(result, function (o) {
- return o.name.indexOf(searchProcessKey) > -1
- })
- }
- this.processDataMap = _.groupBy(result, 'categoryId')
- for (const categoryId in this.processDataMap) {
- this.activeKeyAll.push(categoryId)
- }
- this.activeKey = this.activeKeyAll
- }
- this.processModalVisible = true
- } else {
- this.$message.warning(res.message)
- }
- })
- .finally(() => (this.addApplyLoading = false))
- },
- onSearchProcess(value) {
- this.searchProcessKey = value
- this.getProcessList()
- },
- chooseProcess(v) {
- getAction('/ctop/actCustomForm/queryById', { id: v.customTableId }).then((res) => {
- if (res.success) {
- this.jsonData = JSON.parse(res.result.text)
- } else {
- this.$message.warning('该流程信息未配置表单,请联系开发人员!')
- return
- }
- })
- this.loadingElse = false
- // this.lcModa.formComponent = this.getFormComponent(v.routeName).component
- this.lcModa.title = '发起流程:' + v.name
- this.lcModa.isNew = true
- this.lcModa.processData = v
- this.lcModa.visible = true
- console.log('发起', v)
- },
- /*提交成功申请后*/
- afterSub(formData) {
- this.lcModa.visible = false
- this.$message('请前往我的申请列表提交审批!')
- },
- /*前往我的申请页面*/
- handleToApplyList() {
- this.$router.push({
- path: '/activiti/applyList',
- })
- },
- },
- }
- </script>
- <style scoped>
- @import '~@assets/less/common.less';
- </style>
|