xm
2024-06-14 722af26bc6fec32bb289b1df51a9016a4935610f
提交 | 用户 | 时间
722af2 1 <template>
X 2   <div style="margin-top: 16px">
3     <el-form-item label="脚本格式">
4       <el-input v-model="scriptTaskForm.scriptFormat" clearable @input="updateElementTask()" @change="updateElementTask()" />
5     </el-form-item>
6     <el-form-item label="脚本类型">
7       <el-select v-model="scriptTaskForm.scriptType">
8         <el-option label="内联脚本" value="inline" />
9         <el-option label="外部资源" value="external" />
10       </el-select>
11     </el-form-item>
12     <el-form-item label="脚本" v-show="scriptTaskForm.scriptType === 'inline'">
13       <el-input
14         v-model="scriptTaskForm.script"
15         type="textarea"
16         resize="vertical"
17         :autosize="{ minRows: 2, maxRows: 4 }"
18         clearable
19         @input="updateElementTask()"
20         @change="updateElementTask()"
21       />
22     </el-form-item>
23     <el-form-item label="资源地址" v-show="scriptTaskForm.scriptType === 'external'">
24       <el-input v-model="scriptTaskForm.resource" clearable @input="updateElementTask()" @change="updateElementTask()" />
25     </el-form-item>
26     <el-form-item label="结果变量">
27       <el-input v-model="scriptTaskForm.resultVariable" clearable @input="updateElementTask()" @change="updateElementTask()" />
28     </el-form-item>
29   </div>
30 </template>
31
32 <script>
33 export default {
34   name: "ScriptTask",
35   props: {
36     id: String,
37     type: String
38   },
39   data() {
40     return {
41       defaultTaskForm: {
42         scriptFormat: "",
43         script: "",
44         resource: "",
45         resultVariable: ""
46       },
47       scriptTaskForm: {}
48     };
49   },
50   watch: {
51     id: {
52       immediate: true,
53       handler() {
54         this.bpmnElement = window.bpmnInstances.bpmnElement;
55         this.$nextTick(() => this.resetTaskForm());
56       }
57     }
58   },
59   methods: {
60     resetTaskForm() {
61       for (let key in this.defaultTaskForm) {
62         let value = this.bpmnElement?.businessObject[key] || this.defaultTaskForm[key];
63         this.$set(this.scriptTaskForm, key, value);
64       }
65       this.$set(this.scriptTaskForm, "scriptType", this.scriptTaskForm.script ? "inline" : "external");
66     },
67     updateElementTask() {
68       let taskAttr = Object.create(null);
69       taskAttr.scriptFormat = this.scriptTaskForm.scriptFormat || null;
70       taskAttr.resultVariable = this.scriptTaskForm.resultVariable || null;
71       if (this.scriptTaskForm.scriptType === "inline") {
72         taskAttr.script = this.scriptTaskForm.script || null;
73         taskAttr.resource = null;
74       } else {
75         taskAttr.resource = this.scriptTaskForm.resource || null;
76         taskAttr.script = null;
77       }
78       window.bpmnInstances.modeling.updateProperties(this.bpmnElement, taskAttr);
79     }
80   },
81   beforeDestroy() {
82     this.bpmnElement = null;
83   }
84 };
85 </script>