简柏林 / thingskit-front · Commits

Commit 3dc604fca28a74b32949d88c936251c3bc6170e6

Authored by fengtao
1 parent 8d9d93a2

wip:联调脚本管理服务端

Inline Side-by-side
Showing 4 changed files with 67 additions and 156 deletions
@@ -10,11 +10,11 @@ @@ -10,11 +10,11 @@
10 > 10 >
11 <a-form-item 11 <a-form-item
12 :label="ifAdd ? '名称' : '输入参数'" 12 :label="ifAdd ? '名称' : '输入参数'"
13 - :name="ifAdd ? 'name' : 'inputParams'" 13 + :name="ifAdd ? 'name' : 'params'"
14 :rules="[{ required: true, message: ifAdd ? '请输入脚本名称' : '请输入参数' }]" 14 :rules="[{ required: true, message: ifAdd ? '请输入脚本名称' : '请输入参数' }]"
15 > 15 >
16 <a-input v-if="ifAdd" v-model:value="scriptForm.name" placeholder="请输入脚本名称" /> 16 <a-input v-if="ifAdd" v-model:value="scriptForm.name" placeholder="请输入脚本名称" />
17 - <a-input v-else v-model:value="scriptForm.inputParams" placeholder="请输入参数" /> 17 + <a-input v-else v-model:value="scriptForm.params" placeholder="请输入参数" />
18 </a-form-item> 18 </a-form-item>
19 <a-form-item 19 <a-form-item
20 label="上报数据类型" 20 label="上报数据类型"
@@ -25,10 +25,13 @@ @@ -25,10 +25,13 @@
25 <a-radio-group v-model:value="scriptForm.reportType" :options="typeOptions" /> 25 <a-radio-group v-model:value="scriptForm.reportType" :options="typeOptions" />
26 </a-space> 26 </a-space>
27 </a-form-item> 27 </a-form-item>
28 - <a-form-item label="脚本内容" name="convertJs"> 28 + <a-form-item label="脚本内容" :name="ifAdd ? 'convertJs' : 'script'">
29 <Card title="脚本内容" :bodyStyle="{ padding: 0, height: '280px' }"> 29 <Card title="脚本内容" :bodyStyle="{ padding: 0, height: '280px' }">
30 <template #extra> 30 <template #extra>
31 <a-button @click="handleFormat" size="small">格式化</a-button> 31 <a-button @click="handleFormat" size="small">格式化</a-button>
  32 + <Tooltip :title="defaultTitle" class="ml-2">
  33 + <QuestionCircleOutlined style="font-size: 1rem" />
  34 + </Tooltip>
32 </template> 35 </template>
33 <div ref="aceRef" class="overflow-hidden"></div> 36 <div ref="aceRef" class="overflow-hidden"></div>
34 </Card> 37 </Card>
@@ -39,21 +42,18 @@ @@ -39,21 +42,18 @@
39 copy 42 copy
40 </Button> 43 </Button>
41 </a-form-item> 44 </a-form-item>
42 - <a-form-item  
43 - :label="ifAdd ? '备注' : '输出参数'"  
44 - :name="ifAdd ? 'description' : 'outputParams'"  
45 - > 45 + <a-form-item :label="ifAdd ? '备注' : '输出参数'" :name="ifAdd ? 'description' : 'output'">
46 <a-textarea 46 <a-textarea
47 - :rows="5" 47 + :rows="3"
48 v-if="ifAdd" 48 v-if="ifAdd"
49 v-model:value="scriptForm.description" 49 v-model:value="scriptForm.description"
50 placeholder="请输入备注" 50 placeholder="请输入备注"
51 /> 51 />
52 <a-textarea 52 <a-textarea
53 - :rows="5" 53 + :rows="3"
54 v-else 54 v-else
55 - v-model:value="scriptForm.outputParams"  
56 - placeholder="请输入输出参数" 55 + v-model:value="scriptForm.output"
  56 + placeholder="输出参数为服务端返回的内容"
57 /> 57 />
58 </a-form-item> 58 </a-form-item>
59 </a-form> 59 </a-form>
@@ -62,7 +62,7 @@ @@ -62,7 +62,7 @@
62 <script setup lang="ts"> 62 <script setup lang="ts">
63 import { ref, unref, reactive, onMounted, toRefs } from 'vue'; 63 import { ref, unref, reactive, onMounted, toRefs } from 'vue';
64 import ace from 'ace-builds'; 64 import ace from 'ace-builds';
65 - import { Card, Button } from 'ant-design-vue'; 65 + import { Card, Button, Tooltip } from 'ant-design-vue';
66 import 'ace-builds/src-noconflict/theme-chrome'; // 默认设置的主题 66 import 'ace-builds/src-noconflict/theme-chrome'; // 默认设置的主题
67 import 'ace-builds/src-noconflict/mode-javascript'; // 默认设置的语言模式 67 import 'ace-builds/src-noconflict/mode-javascript'; // 默认设置的语言模式
68 import { beautify } from 'ace-builds/src-noconflict/ext-beautify.js'; 68 import { beautify } from 'ace-builds/src-noconflict/ext-beautify.js';
@@ -70,17 +70,20 @@ @@ -70,17 +70,20 @@
70 import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard'; 70 import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard';
71 import { useMessage } from '/@/hooks/web/useMessage'; 71 import { useMessage } from '/@/hooks/web/useMessage';
72 import { findDictItemByCode } from '/@/api/system/dict'; 72 import { findDictItemByCode } from '/@/api/system/dict';
  73 + import { QuestionCircleOutlined } from '@ant-design/icons-vue';
  74 + import { defaultTitle, defaultScriptContent } from './config.data';
73 75
74 defineEmits(['register']); 76 defineEmits(['register']);
75 - defineProps({ 77 + const props = defineProps({
76 ifAdd: { type: Boolean, default: true }, 78 ifAdd: { type: Boolean, default: true },
77 }); 79 });
78 const scriptForm = reactive({ 80 const scriptForm = reactive({
79 name: '', 81 name: '',
80 description: '', 82 description: '',
81 convertJs: '', 83 convertJs: '',
82 - inputParams: '',  
83 - outputParams: '', 84 + script: '',
  85 + params: '',
  86 + output: '',
84 reportType: 'HEX', 87 reportType: 'HEX',
85 }); 88 });
86 const reportTypeOptions = reactive({ 89 const reportTypeOptions = reactive({
@@ -114,18 +117,7 @@ @@ -114,18 +117,7 @@
114 enableBasicAutocompletion: true, 117 enableBasicAutocompletion: true,
115 enableLiveAutocompletion: true, 118 enableLiveAutocompletion: true,
116 }); 119 });
117 - aceEditor.value.setValue(  
118 - jsScript ??  
119 - `  
120 - var trimSource =source.replaceAll(" ","");  
121 - if(trimSource.length==26 && trimSource.startsWith("020308")){  
122 - var str = "";  
123 - for(var i = 6;i<20;i+=2){  
124 - str += String.fromCharCode(parseInt(trimSource[i]+trimSource[i+1],16));  
125 - }  
126 - }  
127 - `  
128 - ); 120 + aceEditor.value.setValue(jsScript ?? defaultScriptContent);
129 beautify(aceEditor.value.session); 121 beautify(aceEditor.value.session);
130 scriptForm.convertJs = aceEditor.value.getValue(); 122 scriptForm.convertJs = aceEditor.value.getValue();
131 }; 123 };
@@ -144,15 +136,24 @@ @@ -144,15 +136,24 @@
144 const formRef = ref(); 136 const formRef = ref();
145 const getFormData = async () => { 137 const getFormData = async () => {
146 const value = await formRef.value.validateFields(); 138 const value = await formRef.value.validateFields();
147 - scriptForm.convertJs = aceEditor.value.getValue();  
148 - if (scriptForm.convertJs == '') {  
149 - createMessage.error('请编写脚本内容');  
150 - throw '请编写脚本内容'; 139 + if (props.ifAdd) {
  140 + scriptForm.convertJs = aceEditor.value.getValue();
  141 + if (scriptForm.convertJs == '') {
  142 + createMessage.error('请编写脚本内容');
  143 + throw '请编写脚本内容';
  144 + }
  145 + } else {
  146 + scriptForm.script = aceEditor.value.getValue();
  147 + if (scriptForm.script == '') {
  148 + createMessage.error('请编写脚本内容');
  149 + throw '请编写脚本内容';
  150 + }
151 } 151 }
152 if (!value) return; 152 if (!value) return;
153 return { 153 return {
154 ...value, 154 ...value,
155 - ...{ convertJs: scriptForm.convertJs }, 155 + ...{ convertJs: props.ifAdd ? scriptForm.convertJs : null },
  156 + ...{ script: !props.ifAdd ? scriptForm.script : null },
156 }; 157 };
157 }; 158 };
158 const setFormData = (v) => { 159 const setFormData = (v) => {
@@ -163,7 +164,7 @@ @@ -163,7 +164,7 @@
163 handleFormat(); 164 handleFormat();
164 }; 165 };
165 const setScriptContentData = (v) => { 166 const setScriptContentData = (v) => {
166 - aceEditor.value.setValue(v.convertJs); 167 + aceEditor.value.setValue(v);
167 handleFormat(); 168 handleFormat();
168 }; 169 };
169 const resetFormData = () => { 170 const resetFormData = () => {
@@ -171,6 +172,9 @@ @@ -171,6 +172,9 @@
171 Reflect.set(scriptForm, i, ''); 172 Reflect.set(scriptForm, i, '');
172 } 173 }
173 }; 174 };
  175 + const setScriptOutputData = (v) => {
  176 + scriptForm.output = v;
  177 + };
174 const handleFormat = () => beautify(aceEditor.value.session); 178 const handleFormat = () => beautify(aceEditor.value.session);
175 179
176 defineExpose({ 180 defineExpose({
@@ -179,6 +183,7 @@ @@ -179,6 +183,7 @@
179 resetFormData, 183 resetFormData,
180 setFormData, 184 setFormData,
181 setScriptContentData, 185 setScriptContentData,
  186 + setScriptOutputData,
182 }); 187 });
183 </script> 188 </script>
184 <style lang="less" scoped> 189 <style lang="less" scoped>
@@ -60,7 +60,7 @@ @@ -60,7 +60,7 @@
60 converScriptRef.value?.setFormData(data.record); 60 converScriptRef.value?.setFormData(data.record);
61 } 61 }
62 if (unref(isTitle) == 'test') { 62 if (unref(isTitle) == 'test') {
63 - converScriptRef.value?.setScriptContentData(data.record); 63 + converScriptRef.value?.setScriptContentData('');
64 } 64 }
65 setModalProps({ title, showOkBtn: true, showCancelBtn: true, okText }); 65 setModalProps({ title, showOkBtn: true, showCancelBtn: true, okText });
66 if (!unref(isUpdate)) { 66 if (!unref(isUpdate)) {
@@ -73,14 +73,17 @@ @@ -73,14 +73,17 @@
73 }); 73 });
74 74
75 const handleSubmit = async () => { 75 const handleSubmit = async () => {
76 - setModalProps({ loading: true }); 76 + setModalProps({ confirmLoading: true });
77 try { 77 try {
78 const val = await converScriptRef.value?.getFormData(); 78 const val = await converScriptRef.value?.getFormData();
79 const tempObj = { 79 const tempObj = {
80 ...editData.data, 80 ...editData.data,
81 ...val, 81 ...val,
82 }; 82 };
83 - (await isText.value) == 'test' ? testScriptManage(val) : createOrEditScriptManage(tempObj); 83 + const res: any =
  84 + isText.value == 'test'
  85 + ? await testScriptManage(val)
  86 + : await createOrEditScriptManage(tempObj);
84 createMessage.success( 87 createMessage.success(
85 unref(isTitle) == 'edit' 88 unref(isTitle) == 'edit'
86 ? '编辑转换脚本成功' 89 ? '编辑转换脚本成功'
@@ -88,11 +91,18 @@ @@ -88,11 +91,18 @@
88 ? '新增转换脚本成功' 91 ? '新增转换脚本成功'
89 : '测试转换脚本成功' 92 : '测试转换脚本成功'
90 ); 93 );
91 - closeModal(); 94 + if (unref(isTitle) == 'add' || unref(isTitle) == 'edit') {
  95 + setTimeout(() => {
  96 + closeModal();
  97 + }, 10);
  98 + } else {
  99 + if (res) {
  100 + converScriptRef.value?.setScriptOutputData(res?.output);
  101 + }
  102 + }
92 emits('success'); 103 emits('success');
93 - } catch {  
94 } finally { 104 } finally {
95 - setModalProps({ loading: false }); 105 + setModalProps({ confirmLoading: false });
96 } 106 }
97 }; 107 };
98 const handleCancel = (flag) => { 108 const handleCancel = (flag) => {
@@ -2,7 +2,6 @@ import { BasicColumn, FormSchema } from '/@/components/Table'; @@ -2,7 +2,6 @@ import { BasicColumn, FormSchema } from '/@/components/Table';
2 import moment from 'moment'; 2 import moment from 'moment';
3 import { h } from 'vue'; 3 import { h } from 'vue';
4 import { Tag } from 'ant-design-vue'; 4 import { Tag } from 'ant-design-vue';
5 -import { findDictItemByCode } from '/@/api/system/dict';  
6 5
7 // 表格配置 6 // 表格配置
8 export const columns: BasicColumn[] = [ 7 export const columns: BasicColumn[] = [
@@ -43,7 +42,7 @@ export const columns: BasicColumn[] = [ @@ -43,7 +42,7 @@ export const columns: BasicColumn[] = [
43 // 查询配置 42 // 查询配置
44 export const searchFormSchema: FormSchema[] = [ 43 export const searchFormSchema: FormSchema[] = [
45 { 44 {
46 - field: 'reportConfigName', 45 + field: 'name',
47 label: '脚本名称', 46 label: '脚本名称',
48 component: 'Input', 47 component: 'Input',
49 colProps: { span: 6 }, 48 colProps: { span: 6 },
@@ -65,117 +64,14 @@ export const searchFormSchema: FormSchema[] = [ @@ -65,117 +64,14 @@ export const searchFormSchema: FormSchema[] = [
65 }, 64 },
66 ]; 65 ];
67 66
68 -// 新增编辑配置  
69 -export const formSchema: FormSchema[] = [  
70 - {  
71 - field: 'name',  
72 - label: '',  
73 - required: true,  
74 - component: 'Input',  
75 - slot: 'scriptName',  
76 - colProps: { span: 24 },  
77 - },  
78 - {  
79 - field: 'scriptContent',  
80 - label: '脚本内容',  
81 - required: true,  
82 - component: 'Input',  
83 - slot: 'scriptContent',  
84 - colProps: { span: 24 },  
85 - },  
86 - {  
87 - field: 'unit',  
88 - label: '上报数据类型',  
89 - component: 'ApiSelect',  
90 - colProps: {  
91 - span: 23,  
92 - },  
93 - defaultValue: 'HEX',  
94 - componentProps: {  
95 - placeholder: '请上报数据类型',  
96 - api: findDictItemByCode,  
97 - params: {  
98 - dictCode: 'report_data_type',  
99 - },  
100 - labelField: 'itemText',  
101 - valueField: 'itemValue',  
102 - },  
103 - },  
104 - {  
105 - field: 'remark',  
106 - label: '',  
107 - required: true,  
108 - component: 'Input',  
109 - slot: 'scriptRemark',  
110 - colProps: { span: 24 },  
111 - },  
112 -]; 67 +export const defaultTitle = '格式：' + 'out.msg= "hello"+params;';
113 68
114 -export const mockData: any = async () => {  
115 - const res = await [  
116 - {  
117 - reportConfigName: '风机转换',  
118 - organizationName: 1,  
119 - dataType: 'function',  
120 - executeWay: '风机转换脚本使用js',  
121 - executeTime: '2022-10-20 10:24:22',  
122 - },  
123 - {  
124 - reportConfigName: '水电转换',  
125 - organizationName: 1,  
126 - dataType: 'function',  
127 - executeWay: '水电转换脚本使用js',  
128 - executeTime: '2022-10-20 10:24:22',  
129 - },  
130 - {  
131 - reportConfigName: '摄像头转换',  
132 - organizationName: 1,  
133 - dataType: 'function',  
134 - executeWay: '摄像头转换脚本使用js',  
135 - executeTime: '2022-10-20 10:24:22',  
136 - },  
137 - {  
138 - reportConfigName: '变压器转换',  
139 - organizationName: 1,  
140 - dataType: 'function',  
141 - executeWay: '变压器转换脚本使用js',  
142 - executeTime: '2022-10-20 10:24:22',  
143 - },  
144 - {  
145 - reportConfigName: '设备状态转换',  
146 - organizationName: 1,  
147 - dataType: 'function',  
148 - executeWay: '设备状态转换脚本使用js',  
149 - executeTime: '2022-10-20 10:24:22',  
150 - },  
151 - {  
152 - reportConfigName: '电流转换',  
153 - organizationName: 1,  
154 - dataType: 'function',  
155 - executeWay: '电流转换脚本使用js',  
156 - executeTime: '2022-10-20 10:24:22',  
157 - },  
158 - {  
159 - reportConfigName: '电压转换',  
160 - organizationName: 1,  
161 - dataType: 'function',  
162 - executeWay: '电压转换脚本使用js',  
163 - executeTime: '2022-10-20 10:24:22',  
164 - },  
165 - {  
166 - reportConfigName: '传感器转换',  
167 - organizationName: 1,  
168 - dataType: 'function',  
169 - executeWay: '传感器转换脚本使用js',  
170 - executeTime: '2022-10-20 10:24:22',  
171 - },  
172 - {  
173 - reportConfigName: '物模型转换',  
174 - organizationName: 1,  
175 - dataType: 'function',  
176 - executeWay: '物模型转换脚本使用js',  
177 - executeTime: '2022-10-20 10:24:22',  
178 - },  
179 - ];  
180 - return res;  
181 -}; 69 +export const defaultScriptContent = `
  70 +var trimSource =source.replaceAll(" ","");
  71 +if(trimSource.length==26 && trimSource.startsWith("020308")){
  72 + var str = "";
  73 + for(var i = 6;i<20;i+=2){
  74 + str += String.fromCharCode(parseInt(trimSource[i]+trimSource[i+1],16));
  75 + }
  76 +}
  77 + `;
@@ -26,8 +26,8 @@ @@ -26,8 +26,8 @@
26 :actions="[ 26 :actions="[
27 { 27 {
28 label: '测试', 28 label: '测试',
29 - icon: 'clarity:note-edit-line',  
30 - auth: '', 29 + icon: 'ant-design:font-size-outlined',
  30 + auth: 'api:yt:js:test',
31 onClick: handleBindTest.bind(null, record), 31 onClick: handleBindTest.bind(null, record),
32 }, 32 },
33 { 33 {