From 16422906087fd34cf396b3b3f6d8d575cef7e669 Mon Sep 17 00:00:00 2001
From: wangshuaiswim <shuai-1991@qq.com>
Date: Thu, 9 Mar 2023 16:04:11 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9=E7=89=A9=E6=A8=A1?=
 =?UTF-8?q?=E5=9E=8B=E8=A7=84=E5=88=99=E5=B1=9E=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/FRuleEditor/Debug/index.vue    |  10 +-
 src/components/FRuleEditor/index.vue          |   1 -
 .../Metadata/VirtualRuleParam/index.vue       |   2 +-
 .../Metadata/Base/Edit/ExpandsForm.vue        |   2 +-
 .../device/components/Metadata/Base/index.vue | 110 +++++++++++-------
 5 files changed, 73 insertions(+), 52 deletions(-)

diff --git a/src/components/FRuleEditor/Debug/index.vue b/src/components/FRuleEditor/Debug/index.vue
index 14257edb..1d89dd9a 100644
--- a/src/components/FRuleEditor/Debug/index.vue
+++ b/src/components/FRuleEditor/Debug/index.vue
@@ -135,18 +135,18 @@ const runScript = () => {
   });
 
   if (ws.value) {
-    ws.value.unsubscribe();
+    ws.value.unsubscribe?.();
   }
   if (!props.virtualRule?.script) {
     isBeginning.value = true;
     message.warning('请编辑规则');
     return;
   }
-  ws.value = getWebSocket(`virtual-property-debug-${ruleEditorStore.state.property}-${new Date().getTime()}`,
+  ws.value = getWebSocket(`virtual-property-debug-${props.id}-${new Date().getTime()}`,
   '/virtual-property-debug',
   {
     virtualId: `${virtualIdRef.value}-virtual-id`,
-    property: ruleEditorStore.state.property,
+    property: props.id,
     virtualRule: {
       ...props.virtualRule,
     },
@@ -163,7 +163,7 @@ const beginAction = () => {
 const stopAction = () => {
   isBeginning.value = true;
   if (ws.value) {
-    ws.value.unsubscribe();
+    ws.value.unsubscribe?.();
   }
 }
 const clearAction = () => {
@@ -172,7 +172,7 @@ const clearAction = () => {
 
 onUnmounted(() => {
   if (ws.value) {
-    ws.value.unsubscribe();
+    ws.value.unsubscribe?.();
   }
 })
 </script>
diff --git a/src/components/FRuleEditor/index.vue b/src/components/FRuleEditor/index.vue
index 70cb6fe4..bd12a913 100644
--- a/src/components/FRuleEditor/index.vue
+++ b/src/components/FRuleEditor/index.vue
@@ -1,6 +1,5 @@
 <template>
   <Editor key="simple" @change="change" v-model:value="_value" :id="id" />
-  {{ _value }}
   <Advance v-if="ruleEditorStore.state.model === 'advance'" v-model:value="_value" :model="ruleEditorStore.state.model"
     :virtualRule="virtualRule" :id="id" @change="change" />
 </template>
diff --git a/src/components/Metadata/VirtualRuleParam/index.vue b/src/components/Metadata/VirtualRuleParam/index.vue
index b8a712f9..5452a0e5 100644
--- a/src/components/Metadata/VirtualRuleParam/index.vue
+++ b/src/components/Metadata/VirtualRuleParam/index.vue
@@ -1,6 +1,6 @@
 <template>
   <j-form-item :name="name.concat(['script'])">
-    <f-rule-editor v-model:value="value.script" :id="id"></f-rule-editor>
+    <f-rule-editor v-model:value="value.script" :id="id" :virtualRule="value"></f-rule-editor>
   </j-form-item>
   <template v-if="showWindow">
     <j-form-item label="规则配置" :name="name.concat(['isVirtualRule'])">
diff --git a/src/views/device/components/Metadata/Base/Edit/ExpandsForm.vue b/src/views/device/components/Metadata/Base/Edit/ExpandsForm.vue
index 9193eaf2..2259d44e 100644
--- a/src/views/device/components/Metadata/Base/Edit/ExpandsForm.vue
+++ b/src/views/device/components/Metadata/Base/Edit/ExpandsForm.vue
@@ -86,7 +86,7 @@ const metadataStore = useMetadataStore()
 
 onMounted(() => {
   if (props.type === 'product' || !props.value?.source) {
-    emit('update:value', { ...props.value, source: 'device' })
+    emit('update:value', { source: 'device', ...props.value })
   }
 })
 
diff --git a/src/views/device/components/Metadata/Base/index.vue b/src/views/device/components/Metadata/Base/index.vue
index 115ba9cb..35948645 100644
--- a/src/views/device/components/Metadata/Base/index.vue
+++ b/src/views/device/components/Metadata/Base/index.vue
@@ -1,9 +1,9 @@
 <template>
-  <j-pro-table :loading="loading" :data-source="data" size="small" :columns="columns" row-key="id" model="TABLE">
-    <template #headerTitle>
+  <div class="table-header">
+    <div>
       <j-input-search v-model:value="searchValue" placeholder="请输入名称" @search="handleSearch"></j-input-search>
-    </template>
-    <template #rightExtraRender>
+    </div>
+    <div>
       <PermissionButton type="primary" :uhas-permission="`${permission}:update`" key="add" @click="handleAddClick"
         :disabled="operateLimits('add', type)" :tooltip="{
           title: operateLimits('add', type) ? '当前的存储方式不支持新增' : '新增',
@@ -14,45 +14,52 @@
         新增
       </PermissionButton>
       <Edit v-if="metadataStore.model.edit" :type="target" :tabs="type" @refresh="refreshMetadata"></Edit>
+    </div>
+  </div>
+  <a-table :loading="loading" :data-source="data" :columns="columns" row-key="id" model="TABLE" size="small"
+    :pagination="pagination">
+    <template #bodyCell="{ column, record }">
+      <template v-if="column.dataIndex === 'level'">
+        {{ levelMap[record.expands?.level] || '-' }}
+      </template>
+      <template v-if="column.dataIndex === 'async'">
+        {{ record.async ? '是' : '否' }}
+      </template>
+      <template v-if="column.dataIndex === 'valueType'">
+        {{ record.valueType?.type }}
+      </template>
+      <template v-if="column.dataIndex === 'source'">
+        {{ sourceMap[record.expands?.source] }}
+      </template>
+      <template v-if="column.dataIndex === 'type'">
+        <j-tag v-for="item in (record.expands?.type || [])" :key="item">
+          {{ expandsType[item] }}
+        </j-tag>
+      </template>
+      <template v-if="column.dataIndex === 'action'">
+        <j-space>
+          <PermissionButton :uhas-permission="`${permission}:update`" type="link" key="edit" style="padding: 0"
+            :udisabled="operateLimits('updata', type)" @click="handleEditClick(record)" :tooltip="{
+              title: operateLimits('updata', type) ? '当前的存储方式不支持编辑' : '编辑',
+            }">
+            <AIcon type="EditOutlined" />
+          </PermissionButton>
+          <PermissionButton :uhas-permission="`${permission}:delete`" type="link" key="delete" style="padding: 0"
+            :pop-confirm="{
+              title: '确认删除？', onConfirm: async () => {
+                await removeItem(record);
+              },
+            }"
+            :tooltip="{
+              title: '删除',
+            }"
+          >
+            <AIcon type="DeleteOutlined" />
+          </PermissionButton>
+        </j-space>
+      </template>
     </template>
-    <template #level="slotProps">
-      {{ levelMap[slotProps.expands?.level] || '-' }}
-    </template>
-    <template #async="slotProps">
-      {{ slotProps.async ? '是' : '否' }}
-    </template>
-    <template #valueType="slotProps">
-      {{ slotProps.valueType?.type }}
-    </template>
-    <template #source="slotProps">
-      {{ sourceMap[slotProps.expands?.source] }}
-    </template>
-    <template #type="slotProps">
-      <j-tag v-for="item in (slotProps.expands?.type || [])" :key="item">
-        {{ expandsType[item] }}
-      </j-tag>
-    </template>
-    <template #action="slotProps">
-      <j-space>
-        <PermissionButton :uhas-permission="`${permission}:update`" type="link" key="edit" style="padding: 0"
-          :udisabled="operateLimits('updata', type)" @click="handleEditClick(slotProps)" :tooltip="{
-            title: operateLimits('updata', type) ? '当前的存储方式不支持编辑' : '编辑',
-          }">
-          <AIcon type="EditOutlined" />
-        </PermissionButton>
-        <PermissionButton :uhas-permission="`${permission}:delete`" type="link" key="delete" style="padding: 0"
-          :pop-confirm="{
-            title: '确认删除？', onConfirm: async () => {
-              await removeItem(slotProps);
-            },
-          }" :tooltip="{
-            title: '删除',
-          }">
-          <Aicon type="DeleteOutlined" />
-        </PermissionButton>
-      </j-space>
-    </template>
-  </j-pro-table>
+  </a-table>
 </template>
 <script setup lang="ts" name="BaseMetadata">
 import type { MetadataItem, MetadataType } from '@/views/device/Product/typings'
@@ -61,7 +68,7 @@ import { useInstanceStore } from '@/store/instance'
 import { useProductStore } from '@/store/product'
 import { useMetadataStore } from '@/store/metadata'
 import PermissionButton from '@/components/PermissionButton/index.vue'
-import { message } from 'ant-design-vue/es'
+import { TablePaginationConfig, message } from 'ant-design-vue/es'
 import { SystemConst } from '@/utils/consts'
 import { Store } from 'jetlinks-store'
 import { asyncUpdateMetadata, removeMetadata } from '../metadata'
@@ -106,6 +113,15 @@ const actions = [
     scopedSlots: true,
   },
 ];
+const pagination = {
+  showTotal: (num: number, range: number[]) => {
+    return `第 ${range[0]} - ${range[1]} 条/总共 ${num} 条`;
+  },
+  showSizeChanger: true,
+  showQuickJumper: false,
+  defaultPageSize: 10,
+  size: 'small',
+} as TablePaginationConfig
 const columns = computed(() => MetadataMapping.get(type)!.concat(actions))
 const items = computed(() => JSON.parse((target === 'product' ? productStore.current?.metadata : instanceStore.current.metadata) || '{}') as MetadataItem[])
 const searchValue = ref<string>()
@@ -196,4 +212,10 @@ const removeItem = async (record: MetadataItem) => {
   }
 };
 </script>
-<style scoped lang="less"></style>
\ No newline at end of file
+<style scoped lang="less">
+.table-header {
+  display: flex;
+  justify-content: space-between;
+  padding: 16px 0;
+}
+</style>
\ No newline at end of file