From f11f5e1729a81eeffa50eab78ca58358abb129f1 Mon Sep 17 00:00:00 2001
From: xieyonghong <18010623010@163.com>
Date: Tue, 28 Mar 2023 13:34:16 +0800
Subject: [PATCH] fix: bug#11013

---
 .../iot-card/CardManagement/BindDevice.vue    | 232 ++++++++++--------
 yarn.lock                                     |   4 +-
 2 files changed, 125 insertions(+), 111 deletions(-)

diff --git a/src/views/iot-card/CardManagement/BindDevice.vue b/src/views/iot-card/CardManagement/BindDevice.vue
index a0a8c3b5..75197e35 100644
--- a/src/views/iot-card/CardManagement/BindDevice.vue
+++ b/src/views/iot-card/CardManagement/BindDevice.vue
@@ -1,132 +1,146 @@
 <!-- 绑定设备 -->
 <template>
-    <j-modal :maskClosable="false" width="1100px" :visible="true" title="选择设备" okText="确定" cancelText="取消" @ok="handleOk"
-        @cancel="handleCancel" :confirmLoading="btnLoading">
-        <div style="margin-top: 10px">
-            <pro-search :columns="columns" target="iot-card-bind-device" @search="handleSearch" type="simple" />
-            <j-pro-table ref="bindDeviceRef" :columns="columns" :request="queryUnbounded" model="TABLE" :defaultParams="{
-                sorts: [{ name: 'createTime', order: 'desc' }],
-            }" :rowSelection="{
-    type: 'radio',
-    selectedRowKeys: _selectedRowKeys,
-    onSelect: onSelectChange,
-}" @cancelSelect="cancelSelect" :params="params">
-                <template #registryTime="slotProps">
-                    {{
-                        slotProps.registryTime
-                        ? moment(slotProps.registryTime).format(
-                            'YYYY-MM-DD HH:mm:ss',
-                        )
-                        : ''
-                    }}
-                </template>
-                <template #state="slotProps">
-                    <j-badge :text="slotProps.state.text" :status="statusMap.get(slotProps.state.value)" />
-                </template>
-            </j-pro-table>
-        </div>
-    </j-modal>
+  <j-modal :maskClosable='false' width='1100px' :visible='true' title='选择设备' okText='确定' cancelText='取消' @ok='handleOk'
+           @cancel='handleCancel' :confirmLoading='btnLoading'>
+    <div style='margin-top: 10px'>
+      <pro-search :columns='columns' target='iot-card-bind-device' @search='handleSearch' type='simple' />
+      <j-pro-table
+        ref='bindDeviceRef'
+        :columns='columns'
+        :request='queryUnbounded'
+        model='TABLE'
+        :defaultParams="{
+                    pageSize: 10,
+                    sorts: [{ name: 'createTime', order: 'desc' }],
+                }"
+        :pagination="{
+                    showSizeChanger: true,
+                    pageSizeOptions: ['10', '20', '50', '100'],
+                }"
+        :rowSelection="{
+          type: 'radio',
+          selectedRowKeys: _selectedRowKeys,
+          onSelect: onSelectChange,
+      }"
+        @cancelSelect='cancelSelect'
+        :params='params'
+      >
+        <template #registryTime='slotProps'>
+          {{
+            slotProps.registryTime
+              ? moment(slotProps.registryTime).format(
+                'YYYY-MM-DD HH:mm:ss'
+              )
+              : ''
+          }}
+        </template>
+        <template #state='slotProps'>
+          <j-badge :text='slotProps.state.text' :status='statusMap.get(slotProps.state.value)' />
+        </template>
+      </j-pro-table>
+    </div>
+  </j-modal>
 </template>
 
-<script setup lang="ts">
-import { queryUnbounded, bind } from '@/api/iot-card/cardManagement';
-import moment from 'moment';
-import { message } from 'jetlinks-ui-components';
+<script setup lang='ts'>
+import { queryUnbounded, bind } from '@/api/iot-card/cardManagement'
+import moment from 'moment'
+import { message } from 'jetlinks-ui-components'
 
-const emit = defineEmits(['change']);
+const emit = defineEmits(['change'])
 
 const props = defineProps({
-    cardId: {
-        type: String,
-    },
-});
+  cardId: {
+    type: String
+  }
+})
 
-const bindDeviceRef = ref<Record<string, any>>({});
-const params = ref<Record<string, any>>({});
-const _selectedRowKeys = ref<string[]>([]);
-const btnLoading = ref<boolean>(false);
+const bindDeviceRef = ref<Record<string, any>>({})
+const params = ref<Record<string, any>>({})
+const _selectedRowKeys = ref<string[]>([])
+const btnLoading = ref<boolean>(false)
 
-const statusMap = new Map();
-statusMap.set('online', 'processing');
-statusMap.set('offline', 'error');
-statusMap.set('notActive', 'warning');
+const statusMap = new Map()
+statusMap.set('online', 'processing')
+statusMap.set('offline', 'error')
+statusMap.set('notActive', 'warning')
 
 const columns = [
-    {
-        title: 'ID',
-        dataIndex: 'id',
-        key: 'id',
-        ellipsis: true,
-        fixed: 'left',
-        search: {
-            type: 'string',
-        },
-    },
-    {
-        title: '设备名称',
-        dataIndex: 'name',
-        key: 'name',
-        ellipsis: true,
-        search: {
-            type: 'string',
-        },
-    },
-    {
-        title: '注册时间',
-        dataIndex: 'registryTime',
-        key: 'registryTime',
-        scopedSlots: true,
-        search: {
-            type: 'date',
-        },
-        // sorter: true,
-    },
-    {
-        title: '状态',
-        dataIndex: 'state',
-        key: 'state',
-        scopedSlots: true,
-        search: {
-            type: 'select',
-            options: [
-                { label: '禁用', value: 'notActive' },
-                { label: '离线', value: 'offline' },
-                { label: '在线', value: 'online' },
-            ],
-        },
-        // filterMultiple: false,
-    },
-];
+  {
+    title: 'ID',
+    dataIndex: 'id',
+    key: 'id',
+    ellipsis: true,
+    fixed: 'left',
+    search: {
+      type: 'string'
+    }
+  },
+  {
+    title: '设备名称',
+    dataIndex: 'name',
+    key: 'name',
+    ellipsis: true,
+    search: {
+      type: 'string'
+    }
+  },
+  {
+    title: '注册时间',
+    dataIndex: 'registryTime',
+    key: 'registryTime',
+    scopedSlots: true,
+    search: {
+      type: 'date'
+    }
+    // sorter: true,
+  },
+  {
+    title: '状态',
+    dataIndex: 'state',
+    key: 'state',
+    scopedSlots: true,
+    search: {
+      type: 'select',
+      options: [
+        { label: '禁用', value: 'notActive' },
+        { label: '离线', value: 'offline' },
+        { label: '在线', value: 'online' }
+      ]
+    }
+    // filterMultiple: false,
+  }
+]
 
 const handleSearch = (e: any) => {
-    params.value = e;
-};
+  params.value = e
+}
 
 const onSelectChange = (record: any) => {
-    _selectedRowKeys.value = [record.id];
-};
+  _selectedRowKeys.value = [record.id]
+}
 
 const cancelSelect = () => {
-    _selectedRowKeys.value = [];
-};
+  _selectedRowKeys.value = []
+}
 
 const handleOk = () => {
-    btnLoading.value = true;
-    bind(props.cardId, _selectedRowKeys.value[0])
-        .then((resp: any) => {
-            if (resp.status === 200) {
-                message.success('操作成功')
-                emit('change', true);
-            }
-        })
-        .finally(() => {
-            btnLoading.value = false;
-        });
-};
+  btnLoading.value = true
+  bind(props.cardId, _selectedRowKeys.value[0])
+    .then((resp: any) => {
+      if (resp.status === 200) {
+        message.success('操作成功')
+        emit('change', true)
+      }
+    })
+    .finally(() => {
+      btnLoading.value = false
+    })
+}
 
 const handleCancel = () => {
-    emit('change', false);
-};
+  emit('change', false)
+}
 </script>
 
-<style scoped lang="less"></style>
+<style scoped lang='less'></style>
diff --git a/yarn.lock b/yarn.lock
index 1a3e9019..12ea964d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3700,8 +3700,8 @@ jetlinks-store@^0.0.3:
 
 jetlinks-ui-components@^1.0.5:
   version "1.0.5"
-  resolved "http://47.108.170.157:9013/jetlinks-ui-components/-/jetlinks-ui-components-1.0.5.tgz#531a7cd5cc4069dc299f0efcc92411a4eee369e7"
-  integrity sha512-7VHsz5lVG9PlFkHoJvEown4QARuVuasR+jDa9NNQ+pJSHAtHAeiIO1bpVTQKfE5WCyhCKPnN8yIerJLLzmQ1fA==
+  resolved "http://47.108.170.157:9013/jetlinks-ui-components/-/jetlinks-ui-components-1.0.5.tgz#031a300df4df31a353d738cacee8b4ff630ae2d0"
+  integrity sha512-SfucQ7LzlE13VdyZsDhrhzwF9Le/NOke5F6UY3bNN1OJiRD/bZMJecGQxWBQGv567lKcV60SOPCMT8ExiZxUgw==
   dependencies:
     "@vueuse/core" "^9.12.0"
     ant-design-vue "^3.2.15"