|
@@ -213,7 +213,10 @@
|
|
|
</div>
|
|
|
<template v-for="(d,idx) in a.data">
|
|
|
<div class="flex middle actions-data mt-16" style="position:relative" >
|
|
|
- <t-input class="actions-prop" style="width: 70px;" v-model="d.prop" />
|
|
|
+ <t-tooltip :content="d.prop?(d._label+'('+d.prop+')'):''">
|
|
|
+ <!-- <t-input class="actions-prop" style="width: 70px;" v-model="d.prop" /> -->
|
|
|
+ <div class="actions-prop"> {{ d.label||'请编辑' }}</div>
|
|
|
+ </t-tooltip>
|
|
|
<Edit1Icon style="position:absolute;left:56px;height: 32px;" class="hover" @click="selectDeviceProps(d)"/>
|
|
|
<!-- <t-input style="width: 100px;" v-model="item.value" /> -->
|
|
|
:
|
|
@@ -260,8 +263,32 @@
|
|
|
</ul>
|
|
|
</template>
|
|
|
</t-select-input>
|
|
|
- <t-input v-else class="actions-value" placeholder="输入值" style="width: 82px;" v-model="d.value" @change="valueDChange($event,d)" />
|
|
|
- <close-icon class="hover" @click="delSendData(a.data,idx)"/>
|
|
|
+ <template v-else>
|
|
|
+ <t-switch
|
|
|
+ size="small"
|
|
|
+ class="actions-value"
|
|
|
+ v-if="['switch','bool','boolean'].includes(d.type)"
|
|
|
+ v-model="d.value"
|
|
|
+ />
|
|
|
+ <t-input-number
|
|
|
+ class="actions-value"
|
|
|
+ v-else-if="['integer','number','int','enum','double'].includes(d.type)"
|
|
|
+ v-model.number="d.value"
|
|
|
+ theme="column"
|
|
|
+ />
|
|
|
+ <t-button
|
|
|
+ class="actions-value"
|
|
|
+ v-else-if="['code','struct','array','object'].includes(d.type)"
|
|
|
+ shape="square"
|
|
|
+ variant="outline"
|
|
|
+ style="width: 24px"
|
|
|
+ @click="showCode(d)"
|
|
|
+ >
|
|
|
+ <ellipsis-icon slot="icon" />
|
|
|
+ </t-button>
|
|
|
+ <t-input v-else class="actions-value" placeholder="输入值" style="width: 82px;" v-model="d.value" @change="valueDChange($event,d)" />
|
|
|
+ </template>
|
|
|
+ <close-icon style="position:absolute;right:2px" class="hover" @click="delSendData(a.data,idx)"/>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-for="(item,idx) in a.list">
|
|
@@ -575,6 +602,16 @@
|
|
|
</div>
|
|
|
<PropModal v-model:visible="propModal.visible" @change="getProp" />
|
|
|
<MoreModal v-model:visible="more.visible" @change="getMProp" />
|
|
|
+ <t-dialog
|
|
|
+ v-if="codeDialog.show"
|
|
|
+ :visible="true"
|
|
|
+ header="下发数据"
|
|
|
+ @confirm="codeDialog.show = false"
|
|
|
+ @close="codeDialog.show = false"
|
|
|
+ :width="800"
|
|
|
+ >
|
|
|
+ <CodeEditor v-model="codeDialog.data.value" style="height: 300px" />
|
|
|
+ </t-dialog>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
@@ -583,7 +620,7 @@ import PropModal from '@/views/components/common/PropModal.vue';
|
|
|
import MoreModal from '@/views/components/common/MoreModal.vue';
|
|
|
import CodeEditor from '@/views/components/common/CodeEditor.vue';
|
|
|
import Network from './Network.vue';
|
|
|
-import { CloseIcon, AddCircleIcon, DeleteIcon, CheckIcon, Edit1Icon, LinkIcon} from 'tdesign-icons-vue-next';
|
|
|
+import { CloseIcon, AddCircleIcon, DeleteIcon, CheckIcon, Edit1Icon, LinkIcon, EllipsisIcon} from 'tdesign-icons-vue-next';
|
|
|
import { getPenAnimations, getPenTree ,changeType, getIframeTree} from '@/services/common';
|
|
|
import { deepClone } from '@meta2d/core';
|
|
|
|
|
@@ -1007,10 +1044,25 @@ const selectDeviceProps = (i)=>{
|
|
|
}
|
|
|
|
|
|
const getProp = (e)=>{
|
|
|
- propModal.data.prop = e;
|
|
|
+ propModal.data.prop = e.value;
|
|
|
+ propModal.data.label = e.label;
|
|
|
+ propModal.data._label = e._label
|
|
|
+ propModal.data.type = e.type;
|
|
|
+ propModal.data.class = e.class;
|
|
|
+ propModal.data.token = e.token;
|
|
|
propModal.visible = false;
|
|
|
}
|
|
|
|
|
|
+const codeDialog = reactive({
|
|
|
+ show:false,
|
|
|
+ data:null
|
|
|
+});
|
|
|
+
|
|
|
+const showCode = (d)=>{
|
|
|
+ codeDialog.data = d;
|
|
|
+ codeDialog.show = true;
|
|
|
+}
|
|
|
+
|
|
|
const more = ref({
|
|
|
visible:false,
|
|
|
data:null,
|
|
@@ -1087,9 +1139,14 @@ const themeOptions = [
|
|
|
}
|
|
|
}
|
|
|
.actions-prop{
|
|
|
- :deep(.t-input){
|
|
|
+ /* :deep(.t-input){
|
|
|
width: 70px;
|
|
|
- }
|
|
|
+ } */
|
|
|
+ width: 70px;
|
|
|
+ min-width: 70px;
|
|
|
+ white-space:nowrap;
|
|
|
+ overflow:hidden;
|
|
|
+ text-overflow:ellipsis;
|
|
|
}
|
|
|
.actions-key{
|
|
|
:deep(.t-input){
|
|
@@ -1101,6 +1158,9 @@ const themeOptions = [
|
|
|
width: 82px;
|
|
|
}
|
|
|
}
|
|
|
+ .t-input-number.t-is-controls-right{
|
|
|
+ width: 82px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</style>
|