diff --git a/src/views/account/Center/bind/index.vue b/src/views/account/Center/bind/index.vue
index d6151e09..bb0e4e52 100644
--- a/src/views/account/Center/bind/index.vue
+++ b/src/views/account/Center/bind/index.vue
@@ -35,10 +35,11 @@
             <div class='info-body'>
               <img
                 :src="
-                                    iconMap.get(
-                                        bindUser?.applicationProvider,
-                                    ) || getImage('/apply/internal-standalone.png')
-                                "
+                bindUser?.avatar ||
+                    iconMap.get(
+                        bindUser?.applicationProvider,
+                    ) || getImage('/apply/internal-standalone.png')
+                "
               />
               <p>账号：{{ bindUser?.result?.userId || '-' }}</p>
               <p>用户名：{{ bindUser?.result?.name || '-' }}</p>
@@ -62,7 +63,7 @@
               :src="getImage('/bind/Vector.png')"
             />
             <img
-              :src='iconMap.get(bindUser?.applicationProvider)'
+              :src='bindUser?.avatar || iconMap.get(bindUser?.applicationProvider)'
             />
           </div>
           <div class='desc'>
diff --git a/src/views/account/Center/components/BindThirdAccount/index.vue b/src/views/account/Center/components/BindThirdAccount/index.vue
index 71e8859c..1e440fa5 100644
--- a/src/views/account/Center/components/BindThirdAccount/index.vue
+++ b/src/views/account/Center/components/BindThirdAccount/index.vue
@@ -128,10 +128,13 @@ onMounted(() => {
         }
 
         .content-item-right {
-            button:hover {
-                background-color: @primary-color;
-                color: #fff;
+            :deep(button) {
+                &:hover {
+                    background-color: @primary-color;
+                    color: #fff;
+                }
             }
+            
         }
     }
 }
diff --git a/src/views/account/Center/components/RoleShow/index.vue b/src/views/account/Center/components/RoleShow/index.vue
new file mode 100644
index 00000000..e61a08ea
--- /dev/null
+++ b/src/views/account/Center/components/RoleShow/index.vue
@@ -0,0 +1,81 @@
+<template>
+    <ResizeObserver @resize="onResize">
+        <div class="tag-box" ref="box">
+            <div v-for="(item, i) in value" :key="item.id" ref="tags">
+                <div v-if="i != _index" class="tag">
+                    {{ item.name }}
+                </div>
+                <div
+                    v-else
+                    class="tag-ellipsis"
+                    :style="
+                        i === _index
+                            ? {
+                                  width: `${offWidth}px`,
+                              }
+                            : {}
+                    "
+                >
+                    {{ item.name }}
+                </div>
+            </div>
+        </div>
+    </ResizeObserver>
+</template>
+
+<script lang="ts" setup>
+import { default as ResizeObserver } from 'ant-design-vue/lib/vc-resize-observer';
+const props = defineProps({
+    value: {
+        type: Array,
+        default: () => [],
+    },
+});
+
+const tags = ref<any>([]);
+const box = ref<any>(null);
+const _index = ref<number>(-1);
+const offWidth = ref<number>(0);
+
+const onResize = ({ width }: { width: number }) => {
+    let total = 0;
+    for (let i = 0; i < tags.value.length; i++) {
+        const item = tags.value[i];
+        total += item?.scrollWidth || 0;
+        const val = item?.offsetWidth - (total - width);
+        if (total >= width) {
+            _index.value = i;
+            offWidth.value = val;
+            break;
+        }
+    }
+};
+</script>
+
+<style lang="less" scoped>
+.tag-box {
+    margin-top: 15px;
+    display: flex;
+    width: 100%;
+    overflow: hidden;
+
+    .tag {
+        background-color: #f7f8fa;
+        border-radius: 32px;
+        margin-right: 8px;
+        padding: 0 14px;
+        color: #333333;
+        white-space: nowrap;
+    }
+    .tag-ellipsis {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        background-color: #f7f8fa;
+        border-radius: 32px;
+        margin-right: 8px;
+        padding: 0 14px;
+        color: #333333;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/account/Center/index.vue b/src/views/account/Center/index.vue
index 9e545cb0..e5b03f32 100644
--- a/src/views/account/Center/index.vue
+++ b/src/views/account/Center/index.vue
@@ -16,25 +16,12 @@
                     </div>
                     <div class="person-header-item-info-right">
                         <div class="person-header-item-info-right-top">
-                            Hi, {{ user.userInfos?.name }}
+                            <j-ellipsis>
+                                Hi, {{ user.userInfos?.name }}
+                            </j-ellipsis>
                         </div>
                         <div class="person-header-item-info-right-info">
-                            <!-- <div class="tag-box">
-                                <div
-                                    v-for="i in user.userInfos?.orgList || []"
-                                    :key="i?.id"
-                                    class="tag"
-                                    >{{ i?.name }}</div
-                                >
-                            </div> -->
-                            <div class="tag-box">
-                                <div
-                                    v-for="i in user.userInfos?.roleList || []"
-                                    :key="i?.id"
-                                    class="tag"
-                                    ><j-ellipsis>{{ i?.name }}</j-ellipsis></div
-                                >
-                            </div>
+                            <RoleShow :value="user.userInfos?.roleList || []" />
                         </div>
                     </div>
                 </div>
@@ -105,6 +92,7 @@ import {
     USER_CENTER_MENU_CODE,
 } from '@/utils/consts';
 import { usePermissionStore } from '@/store/permission';
+import RoleShow from './components/RoleShow/index.vue';
 
 const imageTypes = reactive([
     'image/jpeg',
@@ -204,6 +192,7 @@ onUnmounted(() => {
             height: 100%;
             .person-header-item-info {
                 display: flex;
+                width: calc(100% - 380px);
                 .person-header-item-info-left {
                     margin-right: 30px;
                 }
@@ -211,25 +200,16 @@ onUnmounted(() => {
                 .person-header-item-info-right {
                     display: flex;
                     flex-direction: column;
+                    width: calc(100% - 126px);
                     .person-header-item-info-right-top {
                         display: flex;
                         font-size: 26px;
                         color: #1d2129;
                         font-weight: 500;
+                        width: 100%;
                     }
                     .person-header-item-info-right-info {
-                        .tag-box {
-                            margin-top: 15px;
-                            display: flex;
-
-                            .tag {
-                                background-color: #F7F8FA;
-                                border-radius: 32px;
-                                margin-right: 8px;
-                                padding: 0 14px;
-                                color: #333333;
-                            }
-                        }
+                        width: 100%;
                     }
                 }
             }
diff --git a/src/views/device/Instance/Detail/MetadataMap/index.vue b/src/views/device/Instance/Detail/MetadataMap/index.vue
index 477f7a25..26aa1d71 100644
--- a/src/views/device/Instance/Detail/MetadataMap/index.vue
+++ b/src/views/device/Instance/Detail/MetadataMap/index.vue
@@ -7,94 +7,103 @@
                 allowClear
                 @search="search"
             />
-            <j-table
-                :columns="columns"
-                :data-source="dataSource"
-                :pagination="false"
-                :rowSelection="{
-                    selectedRowKeys: selectedKeys,
-                    hideSelectAll: true,
-                    columnWidth: 0,
-                }"
-                rowKey="id"
-            >
-                <template #headerCell="{ column }">
-                    <template v-if="column.dataIndex === 'original'">
-                        <div
-                            style="
-                                width: 100%;
-                                display: flex;
-                                justify-content: space-between;
-                                align-items: center;
-                            "
-                        >
-                            <span>
-                                目标属性<j-tooltip
-                                    title="协议包中物模型下的属性"
+            <div class="box">
+                <j-scrollbar height="100%">
+                    <j-table
+                        :columns="columns"
+                        :data-source="dataSource"
+                        :pagination="false"
+                        :rowSelection="{
+                            selectedRowKeys: selectedKeys,
+                            hideSelectAll: true,
+                            columnWidth: 0,
+                        }"
+                        rowKey="id"
+                        :customRow="customRow"
+                    >
+                        <template #headerCell="{ column }">
+                            <template v-if="column.dataIndex === 'original'">
+                                <div
+                                    style="
+                                        width: 100%;
+                                        display: flex;
+                                        justify-content: space-between;
+                                        align-items: center;
+                                    "
                                 >
-                                    <AIcon
-                                        style="margin-left: 10px"
-                                        type="QuestionCircleOutlined"
-                                    />
-                                </j-tooltip>
-                            </span>
-                            <j-tag
-                                v-if="filterValue !== undefined"
-                                color="#87d068"
-                                closable
-                                @close="onClose"
-                                ><AIcon type="ArrowUpOutlined" /><span>{{
-                                    filterValue ? '已映射' : '未映射'
-                                }}</span></j-tag
-                            >
-                            <j-dropdown v-else>
-                                <AIcon type="FilterOutlined" />
-                                <template #overlay>
-                                    <j-menu @click="onFilter">
-                                        <j-menu-item :key="true"
-                                            >置顶已映射数据</j-menu-item
+                                    <span>
+                                        目标属性<j-tooltip
+                                            title="协议包中物模型下的属性"
                                         >
-                                        <j-menu-item :key="false"
-                                            >置顶未映射数据</j-menu-item
-                                        >
-                                    </j-menu>
-                                </template>
-                            </j-dropdown>
-                        </div>
-                    </template>
-                </template>
-                <template #bodyCell="{ column, text, record }">
-                    <template v-if="column.dataIndex === 'name'">
-                        <span class="metadata-title">
-                            <j-ellipsis>
-                                {{ text }} ({{ record.id }})
-                            </j-ellipsis>
-                        </span>
-                    </template>
-                    <template v-if="column.dataIndex === 'original'">
-                        <j-select
-                            v-model:value="record.original"
-                            style="width: 100%"
-                            allowClear
-                            @change="(id) => onChange(record, id)"
-                            placeholder="请选择"
-                        >
-                            <j-select-option
-                                v-for="(item, index) in targetOptions"
-                                :key="index + '_' + item.id"
-                                :value="item.value"
-                                :disabled="
-                                    selectedOriginalKeys.includes(item.id)
-                                "
+                                            <AIcon
+                                                style="margin-left: 10px"
+                                                type="QuestionCircleOutlined"
+                                            />
+                                        </j-tooltip>
+                                    </span>
+                                    <j-tag
+                                        v-if="filterValue !== undefined"
+                                        color="#87d068"
+                                        closable
+                                        @close="onClose"
+                                        ><AIcon
+                                            type="ArrowUpOutlined"
+                                        /><span>{{
+                                            filterValue ? '已映射' : '未映射'
+                                        }}</span></j-tag
+                                    >
+                                    <j-dropdown v-else>
+                                        <AIcon type="FilterOutlined" />
+                                        <template #overlay>
+                                            <j-menu @click="onFilter">
+                                                <j-menu-item :key="true"
+                                                    >置顶已映射数据</j-menu-item
+                                                >
+                                                <j-menu-item :key="false"
+                                                    >置顶未映射数据</j-menu-item
+                                                >
+                                            </j-menu>
+                                        </template>
+                                    </j-dropdown>
+                                </div>
+                            </template>
+                        </template>
+                        <template #bodyCell="{ column, text, record }">
+                            <template v-if="column.dataIndex === 'name'">
+                                <span class="metadata-title" ref="title">
+                                    <j-ellipsis>
+                                        {{ text }} ({{ record.id }})
+                                    </j-ellipsis>
+                                </span>
+                            </template>
+                            <template v-if="column.dataIndex === 'original'">
+                                <j-select
+                                    v-model:value="record.original"
+                                    style="width: 100%"
+                                    allowClear
+                                    @change="(id) => onChange(record, id)"
+                                    placeholder="请选择"
                                 >
-                                {{ item.label }} ({{
-                                    item.id
-                                }})</j-select-option
-                            >
-                        </j-select>
-                    </template>
-                </template>
-            </j-table>
+                                    <j-select-option
+                                        v-for="(item, index) in targetOptions"
+                                        :key="index + '_' + item.id"
+                                        :value="item.value"
+                                        :disabled="
+                                            selectedOriginalKeys.includes(
+                                                item.id,
+                                            )
+                                        "
+                                    >
+                                        {{ item.label }} ({{
+                                            item.id
+                                        }})</j-select-option
+                                    >
+                                </j-select>
+                            </template>
+                        </template>
+                    </j-table>
+                </j-scrollbar>
+            </div>
         </div>
         <div class="right">
             <j-scrollbar>
@@ -140,6 +149,8 @@ const targetOptions = ref<any[]>([]);
 const filterValue = ref<boolean | undefined>(undefined);
 const originalData = ref([]);
 
+const _value = ref<any>(undefined);
+
 const columns = [
     {
         title: '序号',
@@ -198,13 +209,22 @@ const getMetadataMapData = () => {
     });
 };
 
+const customRow = (record: any) => {
+    return {
+        id: record.id,
+        class: _value.value === record.name ? 'metadata-search-row' : '',
+    };
+};
+
 const search = (value: string) => {
     if (value) {
-        dataSource.value = dataSourceCache.value.filter((item: any) => {
-            return !!item.name?.includes(value);
+        const _item: any = dataSourceCache.value.find((item: any) => {
+            return value === item.name;
         });
+        _value.value = _item.name;
+        document.getElementById(_item?.id)?.scrollIntoView(); // 滚动到可视区域
     } else {
-        dataSource.value = dataSourceCache.value;
+        _value.value = undefined;
     }
 };
 
@@ -276,7 +296,7 @@ const onChange = async (value: any, id: string) => {
 };
 
 const onFilter = ({ key }: any) => {
-    originalData.value = dataSource.value
+    originalData.value = dataSource.value;
     const _dataSource = cloneDeep(dataSource.value).sort((a: any, b: any) => {
         if (!key) {
             return (a.original ? 1 : -1) - (b.original ? 1 : -1);
@@ -301,14 +321,24 @@ onMounted(() => {
 
 <style scoped lang='less'>
 .metadata-map {
-    // position: relative;
     min-height: 100%;
     display: flex;
     gap: 24px;
 
     .left {
-        // margin-right: 44px;
         flex: 1;
+        height: 100%;
+
+        .box {
+            height: calc(100vh - 388px);
+            overflow: hidden;
+
+            :deep(.metadata-search-row) {
+                td {
+                    background: #ffff80 !important;
+                }
+            }
+        }
     }
 
     .right {
diff --git a/src/views/device/Product/Detail/MetadataMap/index.vue b/src/views/device/Product/Detail/MetadataMap/index.vue
index f9c5003c..db12a089 100644
--- a/src/views/device/Product/Detail/MetadataMap/index.vue
+++ b/src/views/device/Product/Detail/MetadataMap/index.vue
@@ -1,137 +1,152 @@
 <template>
-  <div class='metadata-map'>
-    <div class='left'>
-      <j-input-search
-        style='width: 350px;margin-bottom:24px;'
-        placeholder='搜索平台属性名称'
-        allowClear
-        @search='search'
-      />
-      <j-table
-        :columns="columns"
-        :data-source="dataSource"
-        :pagination='false'
-        :rowSelection='{
-          selectedRowKeys: selectedKeys,
-          hideSelectAll: true,
-          columnWidth: 0
-        }'
-        rowKey='id'
-      >
-        <template #headerCell="{ column }">
-          <template v-if="column.dataIndex === 'plugin'">
-              <div
-                  style="
-                      width: 100%;
-                      display: flex;
-                      justify-content: space-between;
-                      align-items: center;
-                  "
-              >
-                <span>
-                    目标属性<j-tooltip title="插件中物模型下的属性">
-                        <AIcon
-                            style="margin-left: 10px"
-                            type="QuestionCircleOutlined"
-                        />
-                    </j-tooltip>
-                </span>
-                <j-tag
-                    v-if="filterValue !== undefined"
-                    color="#87d068"
-                    closable
-                    @close="onClose"
-                    ><AIcon type="ArrowUpOutlined" /><span>{{
-                        filterValue ? '已映射' : '未映射'
-                    }}</span></j-tag
-                >
-                <j-dropdown v-else>
-                    <AIcon type="FilterOutlined" />
-                    <template #overlay>
-                        <j-menu @click="onFilter">
-                            <j-menu-item :key="true"
-                                >置顶已映射数据</j-menu-item
-                            >
-                            <j-menu-item :key="false"
-                                >置顶未映射数据</j-menu-item
-                            >
-                        </j-menu>
-                    </template>
-                </j-dropdown>
-              </div>
-          </template>
-        </template>
-        <template #bodyCell="{ column, text, record }">
-          <template v-if='column.dataIndex === "name"'>
-            <span class='metadata-title'>
-              <j-ellipsis>
-                {{ text }} ({{ record.id }})
-              </j-ellipsis>
-            </span>
-          </template>
-          <template v-if='column.dataIndex === "plugin"'>
-            <j-select
-              v-model:value='record.plugin'
-              style='width: 100%'
-              allowClear
-              @change='(id) => pluginChange(record, id)'
-            >
-              <j-select-option
-                v-for='(item, index) in pluginOptions'
-                :key='index + "_" + item.id'
-                :value='item.value'
-                :disabled='selectedPluginKeys.includes(item.id)'
-              ><j-tooltip :title="selectedPluginKeys.includes(item.id) ? '该属性已绑定平台属性' : ''">
-                      {{ item.label }} ({{
-                          item.id
-                      }})
-                  </j-tooltip></j-select-option>
-            </j-select>
-          </template>
-        </template>
-      </j-table>
+    <div class="metadata-map">
+        <div class="left">
+            <j-input-search
+                style="width: 350px; margin-bottom: 24px"
+                placeholder="搜索平台属性名称"
+                allowClear
+                @search="search"
+            />
+            <div class="box">
+                <j-scrollbar height="100%">
+                    <j-table
+                        :columns="columns"
+                        :data-source="dataSource"
+                        :pagination="false"
+                        :rowSelection="{
+                            selectedRowKeys: selectedKeys,
+                            hideSelectAll: true,
+                            columnWidth: 0,
+                        }"
+                        rowKey="id"
+                        :customRow="customRow"
+                    >
+                        <template #headerCell="{ column }">
+                            <template v-if="column.dataIndex === 'plugin'">
+                                <div
+                                    style="
+                                        width: 100%;
+                                        display: flex;
+                                        justify-content: space-between;
+                                        align-items: center;
+                                    "
+                                >
+                                    <span>
+                                        目标属性<j-tooltip
+                                            title="插件中物模型下的属性"
+                                        >
+                                            <AIcon
+                                                style="margin-left: 10px"
+                                                type="QuestionCircleOutlined"
+                                            />
+                                        </j-tooltip>
+                                    </span>
+                                    <j-tag
+                                        v-if="filterValue !== undefined"
+                                        color="#87d068"
+                                        closable
+                                        @close="onClose"
+                                        ><AIcon
+                                            type="ArrowUpOutlined"
+                                        /><span>{{
+                                            filterValue ? '已映射' : '未映射'
+                                        }}</span></j-tag
+                                    >
+                                    <j-dropdown v-else>
+                                        <AIcon type="FilterOutlined" />
+                                        <template #overlay>
+                                            <j-menu @click="onFilter">
+                                                <j-menu-item :key="true"
+                                                    >置顶已映射数据</j-menu-item
+                                                >
+                                                <j-menu-item :key="false"
+                                                    >置顶未映射数据</j-menu-item
+                                                >
+                                            </j-menu>
+                                        </template>
+                                    </j-dropdown>
+                                </div>
+                            </template>
+                        </template>
+                        <template #bodyCell="{ column, text, record }">
+                            <template v-if="column.dataIndex === 'name'">
+                                <span class="metadata-title">
+                                    <j-ellipsis>
+                                        {{ text }} ({{ record.id }})
+                                    </j-ellipsis>
+                                </span>
+                            </template>
+                            <template v-if="column.dataIndex === 'plugin'">
+                                <j-select
+                                    v-model:value="record.plugin"
+                                    style="width: 100%"
+                                    allowClear
+                                    @change="(id) => pluginChange(record, id)"
+                                >
+                                    <j-select-option
+                                        v-for="(item, index) in pluginOptions"
+                                        :key="index + '_' + item.id"
+                                        :value="item.value"
+                                        :disabled="
+                                            selectedPluginKeys.includes(item.id)
+                                        "
+                                        ><j-tooltip
+                                            :title="
+                                                selectedPluginKeys.includes(
+                                                    item.id,
+                                                )
+                                                    ? '该属性已绑定平台属性'
+                                                    : ''
+                                            "
+                                        >
+                                            {{ item.label }} ({{ item.id }})
+                                        </j-tooltip></j-select-option
+                                    >
+                                </j-select>
+                            </template>
+                        </template>
+                    </j-table>
+                </j-scrollbar>
+            </div>
+        </div>
+        <div class="right">
+            <j-scrollbar>
+                <div class="title">功能说明</div>
+                <p>
+                    该功能用于将插件中的
+                    <b>物模型属性标识</b>与
+                    <b>平台物模型属性标识</b
+                    >进行映射,当两方属性标识不一致时，可在当前页面直接修改映射管理，系统将以映射后的物模型属性进行数据处理。
+                </p>
+                <p>
+                    未完成映射的属性标识“目标属性”列数据为空，代表该属性值来源以在平台配置的来源为准。
+                </p>
+                <p>
+                    数据条背景亮起代表<b>标识一致</b>或<b>已完成映射</b>的属性。
+                </p>
+                <div class="title">功能图示</div>
+                <div>
+                    <img :src="getImage('/device/matadataMap.png')" />
+                </div>
+            </j-scrollbar>
+        </div>
     </div>
-    <div class='right'>
-      <j-scrollbar>
-        <div class='title'>
-          功能说明
-        </div>
-        <p>
-          该功能用于将插件中的
-          <b>物模型属性标识</b>与
-          <b>平台物模型属性标识</b>进行映射,当两方属性标识不一致时，可在当前页面直接修改映射管理，系统将以映射后的物模型属性进行数据处理。
-        </p>
-        <p>
-          未完成映射的属性标识“目标属性”列数据为空，代表该属性值来源以在平台配置的来源为准。
-        </p>
-        <p>
-          数据条背景亮起代表<b>标识一致</b>或<b>已完成映射</b>的属性。
-        </p>
-        <div class='title'>
-          功能图示
-        </div>
-        <div>
-          <img :src='getImage("/device/matadataMap.png")' />
-        </div>
-      </j-scrollbar>
-    </div>
-  </div>
 </template>
 
 <script setup lang='ts' name='MetadataMap'>
-import { storeToRefs } from 'pinia'
+import { storeToRefs } from 'pinia';
 import { useProductStore } from '@/store/product';
-import { detail as queryPluginAccessDetail } from '@/api/link/accessConfig'
-import { getPluginData, getProductByPluginId } from '@/api/link/plugin'
-import { getImage, onlyMessage } from '@/utils/comm'
-import { getMetadataMapById, metadataMapById } from '@/api/device/instance'
+import { detail as queryPluginAccessDetail } from '@/api/link/accessConfig';
+import { getPluginData, getProductByPluginId } from '@/api/link/plugin';
+import { getImage, onlyMessage } from '@/utils/comm';
+import { getMetadataMapById, metadataMapById } from '@/api/device/instance';
 import { cloneDeep } from 'lodash-es';
 
 const productStore = useProductStore();
-const { current: productDetail } = storeToRefs(productStore)
-const dataSourceCache = ref([])
-const dataSource = ref([])
-const pluginOptions = ref<any[]>([])
+const { current: productDetail } = storeToRefs(productStore);
+const dataSourceCache = ref([]);
+const dataSource = ref([]);
+const pluginOptions = ref<any[]>([]);
 
 const filterValue = ref<boolean | undefined>(undefined);
 const originalData = ref([]);
@@ -141,66 +156,103 @@ const originalData = ref([]);
 // }
 
 const columns = [
-  {
-    title: '序号',
-    dataIndex: 'index',
-    width: 100
-  },
-  {
-    title: '平台属性',
-    dataIndex: 'name',
-  },
-  {
-    title: '目标属性',
-    dataIndex: 'plugin',
-    width: 250,
-    // sorter: tableFilter
-  }
-]
+    {
+        title: '序号',
+        dataIndex: 'index',
+        width: 100,
+    },
+    {
+        title: '平台属性',
+        dataIndex: 'name',
+    },
+    {
+        title: '目标属性',
+        dataIndex: 'plugin',
+        width: 250,
+        // sorter: tableFilter
+    },
+];
+
+const _value = ref<any>(undefined);
 
 const selectedKeys = computed(() => {
-  return dataSource.value?.filter(item => !!item?.plugin).map(item => item.id) || []
-})
+    return (
+        dataSource.value
+            ?.filter((item) => !!item?.plugin)
+            .map((item) => item.id) || []
+    );
+});
 
 const selectedPluginKeys = computed(() => {
-  return dataSource.value?.filter(item => !!item?.plugin).map(item => item.plugin) || []
-})
+    return (
+        dataSource.value
+            ?.filter((item) => !!item?.plugin)
+            .map((item) => item.plugin) || []
+    );
+});
 
 const getMetadataMapData = () => {
-  return new Promise(resolve => {
-    getMetadataMapById('product', productDetail.value?.id).then(res => {
-      if (res.success) {
-        resolve(res.result?.filter(item => item.customMapping)?.map(item => {
-          return {
-            id: item.metadataId,
-            pluginId: item.originalId
-          }
-        }) || [])
-      }
-    })
-  })
-}
+    return new Promise((resolve) => {
+        getMetadataMapById('product', productDetail.value?.id).then((res) => {
+            if (res.success) {
+                resolve(
+                    res.result
+                        ?.filter((item) => item.customMapping)
+                        ?.map((item) => {
+                            return {
+                                id: item.metadataId,
+                                pluginId: item.originalId,
+                            };
+                        }) || [],
+                );
+            }
+        });
+    });
+};
+
+// const search = (value: string) => {
+//   if (value) {
+//     dataSource.value = dataSourceCache.value.filter((item: any) => {
+//       return !!item.name?.includes(value)
+//     })
+//   } else {
+//     dataSource.value = dataSourceCache.value
+//   }
+// }
+
+const customRow = (record: any) => {
+    return {
+        id: record.id,
+        class: _value.value === record.name ? 'metadata-search-row' : '',
+    };
+};
 
 const search = (value: string) => {
-  if (value) {
-    dataSource.value = dataSourceCache.value.filter((item: any) => {
-      return !!item.name?.includes(value)
-    })
-  } else {
-    dataSource.value = dataSourceCache.value
-  }
-}
+    if (value) {
+        const _item: any = dataSourceCache.value.find((item: any) => {
+            return value === item.name;
+        });
+        _value.value = _item.name;
+        document.getElementById(_item?.id)?.scrollIntoView(); // 滚动到可视区域
+    } else {
+        _value.value = undefined;
+    }
+};
 
 const getDefaultMetadata = async () => {
-  const metadata = JSON.parse(productDetail.value?.metadata || '{}')
-  const properties = metadata.properties
-  const pluginMetadata = await getPluginMetadata()
-  const pluginProperties = pluginMetadata?.properties || []
-  const metadataMap: any = await getMetadataMapData()
-  pluginOptions.value = pluginProperties.map(item => ({...item, label: item.name, value: item.id}))
+    const metadata = JSON.parse(productDetail.value?.metadata || '{}');
+    const properties = metadata.properties;
+    const pluginMetadata = await getPluginMetadata();
+    const pluginProperties = pluginMetadata?.properties || [];
+    const metadataMap: any = await getMetadataMapData();
+    pluginOptions.value = pluginProperties.map((item) => ({
+        ...item,
+        label: item.name,
+        value: item.id,
+    }));
 
-  // const concatProperties = [ ...pluginProperties.map(item => ({ id: item.id, pluginId: item.id})), ...metadataMap]
-  const concatProperties = [...metadataMap];
+    // const concatProperties = [ ...pluginProperties.map(item => ({ id: item.id, pluginId: item.id})), ...metadataMap]
+    const concatProperties = [...metadataMap];
     const arr = concatProperties.map((item) => item.id);
     const _arr = concatProperties.map((item) => item.pluginId);
 
@@ -211,50 +263,65 @@ const getDefaultMetadata = async () => {
         }
     });
 
-  dataSource.value = properties?.map((item: any, index: number) => {
-    const _m = concatProperties.find(p => p.id === item.id)
-    return {
-      index: index + 1,
-      id: item.id, // 产品物模型id
-      name: item.name,
-      type: item.valueType?.type,
-      plugin: _m?.pluginId, // 插件物模型id
-    }
-  }) || []
-  dataSourceCache.value = dataSource.value
-}
+    dataSource.value =
+        properties?.map((item: any, index: number) => {
+            const _m = concatProperties.find((p) => p.id === item.id);
+            return {
+                index: index + 1,
+                id: item.id, // 产品物模型id
+                name: item.name,
+                type: item.valueType?.type,
+                plugin: _m?.pluginId, // 插件物模型id
+            };
+        }) || [];
+    dataSourceCache.value = dataSource.value;
+};
 
-const getPluginMetadata = (): Promise<{ properties: any[]}> => {
-  return new Promise(resolve => {
-    queryPluginAccessDetail(productDetail.value?.accessId!).then(async res => {
-      if (res.success) {
-        const _channelId = (res.result as any)!.channelId
-        const pluginRes = await getPluginData('product', productDetail.value?.accessId || '', productDetail.value?.id).catch(() => ({ success: false, result: {}}))
-        const resp = await getProductByPluginId(_channelId).catch(() => ({ success: false, result: []}))
-        if (resp.success) {
-          const _item = (resp.result as any[])?.find((item: any) => item.id === (pluginRes?.result as any)?.externalId)
+const getPluginMetadata = (): Promise<{ properties: any[] }> => {
+    return new Promise((resolve) => {
+        queryPluginAccessDetail(productDetail.value?.accessId!).then(
+            async (res) => {
+                if (res.success) {
+                    const _channelId = (res.result as any)!.channelId;
+                    const pluginRes = await getPluginData(
+                        'product',
+                        productDetail.value?.accessId || '',
+                        productDetail.value?.id,
+                    ).catch(() => ({ success: false, result: {} }));
+                    const resp = await getProductByPluginId(_channelId).catch(
+                        () => ({ success: false, result: [] }),
+                    );
+                    if (resp.success) {
+                        const _item = (resp.result as any[])?.find(
+                            (item: any) =>
+                                item.id ===
+                                (pluginRes?.result as any)?.externalId,
+                        );
 
-          resolve(_item ? _item.metadata : { properties: [] })
-        }
-      }
-      resolve({ properties: [] })
-    })
-  })
-}
+                        resolve(_item ? _item.metadata : { properties: [] });
+                    }
+                }
+                resolve({ properties: [] });
+            },
+        );
+    });
+};
 
 const pluginChange = async (value: any, id: string) => {
-  const res = await metadataMapById('product', productDetail.value?.id, [{
-    metadataType: 'property',
-    metadataId: value.id,
-    originalId: id
-  }])
-  if (res.success) {
-    onlyMessage('操作成功')
-  }
-}
+    const res = await metadataMapById('product', productDetail.value?.id, [
+        {
+            metadataType: 'property',
+            metadataId: value.id,
+            originalId: id,
+        },
+    ]);
+    if (res.success) {
+        onlyMessage('操作成功');
+    }
+};
 
 const onFilter = ({ key }: any) => {
-    originalData.value = dataSource.value
+    originalData.value = dataSource.value;
     const _dataSource = cloneDeep(dataSource.value).sort((a: any, b: any) => {
         if (!key) {
             return (a.plugin ? 1 : -1) - (b.plugin ? 1 : -1);
@@ -273,54 +340,64 @@ const onClose = () => {
 };
 
 onMounted(() => {
-  getDefaultMetadata()
-})
-
+    getDefaultMetadata();
+});
 </script>
 
 <style scoped lang='less'>
 .metadata-map {
-  // position: relative;
-  min-height: 100%;
-  display: flex;
-  gap: 24px;
-
-  .left {
-    // margin-right: 44px;
-    flex: 1;
-  }
-
-  .right {
-    // position: absolute;
-    border: 1px solid rgba(0, 0, 0, 0.08);
+    // position: relative;
     min-height: 100%;
-    min-width: 410px;
-    width: 33.33333%;
-    // top: 0;
-    // right: 0;
-    padding: 16px;
+    display: flex;
+    gap: 24px;
 
-    .title {
-      margin-bottom: 16px;
-      color: rgba(#000, .85);
-      font-weight: bold;
+    .left {
+        // margin-right: 44px;
+        flex: 1;
 
-      p {
-        initial-letter: 28px;
+        .box {
+            height: calc(100vh - 392px);
+            overflow: hidden;
+
+            :deep(.metadata-search-row) {
+                td {
+                    background: #ffff80 !important;
+                }
+            }
+        }
+    }
+
+    .right {
+        // position: absolute;
+        border: 1px solid rgba(0, 0, 0, 0.08);
+        min-height: 100%;
+        min-width: 410px;
+        width: 33.33333%;
+        // top: 0;
+        // right: 0;
+        padding: 16px;
+
+        .title {
+            margin-bottom: 16px;
+            color: rgba(#000, 0.85);
+            font-weight: bold;
+
+            p {
+                initial-letter: 28px;
+                color: #666666;
+            }
+        }
+    }
+
+    .metadata-title {
         color: #666666;
-      }
     }
-  }
 
-  .metadata-title {
-    color: #666666;
-  }
-
-  :deep(.ant-table-selection-column) {
-    padding: 0;
-    label {
-      display: none;
+    :deep(.ant-table-selection-column) {
+        padding: 0;
+        label {
+            display: none;
+        }
     }
-  }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/notice/Config/Detail/index.vue b/src/views/notice/Config/Detail/index.vue
index 93d1ea9f..68eb715b 100644
--- a/src/views/notice/Config/Detail/index.vue
+++ b/src/views/notice/Config/Detail/index.vue
@@ -429,7 +429,12 @@ const formRules = ref({
     'configuration.host': [{ required: true, message: '请输入服务器地址', trigger: 'blur' }],
     'configuration.sender': [
         { required: true, message: '请输入发件人', trigger: 'blur' },
-        { max: 64, message: '最多可输入64个字符' },
+        // { max: 64, message: '最多可输入64个字符' },
+        {
+            pattern:
+                /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,
+            message: '请输入正确的邮箱',
+        },
     ],
     'configuration.username': [
         { required: true, message: '请输入用户名', trigger: 'blur' },
diff --git a/src/views/system/NoticeRule/components/Role/index.vue b/src/views/system/NoticeRule/components/Role/index.vue
index d4d54e85..fe175d79 100644
--- a/src/views/system/NoticeRule/components/Role/index.vue
+++ b/src/views/system/NoticeRule/components/Role/index.vue
@@ -71,7 +71,7 @@ const props = defineProps({
     },
     gridColumn: {
         type: Number,
-        default: 2
+        default: 3
     }
 });