src/assets/icons/jrdl.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18.274" height="18.283" viewBox="0 0 18.274 18.283">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#2cc1ff"/>
+      <stop offset="1" stop-color="#ccedff"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_58027" data-name="路径 58027" d="M57.285,55.608l-3.052-1.823a.139.139,0,0,0-.211.125v2.236a.148.148,0,0,1-.144.144H51.344a.148.148,0,0,0-.144.144v1.823a.148.148,0,0,0,.144.144h2.534a.148.148,0,0,1,.144.144V60.78a.145.145,0,0,0,.221.125l3.052-1.843a.164.164,0,0,0,.067-.125V55.732A.213.213,0,0,0,57.285,55.608Zm-.144,5.048-1.91,1.18a.164.164,0,0,0-.067.125l.029,2.332a.148.148,0,0,0,.144.144h1.881a.148.148,0,0,0,.144-.144V60.771a.145.145,0,0,0-.221-.115Zm1.3-12.016H55.154a.148.148,0,0,0-.144.144l.048,3.868a.164.164,0,0,0,.067.125l2.015,1.209a.139.139,0,0,0,.211-.125V49.235a.153.153,0,0,1,.115-.144l.979-.173A.139.139,0,0,0,58.436,48.64Zm9.511.1L59.06,50.147a.454.454,0,0,0-.374.451V65.464a.463.463,0,0,0,.537.451l8.714-1.42a.453.453,0,0,0,.374-.441l.163-14.866A.445.445,0,0,0,67.947,48.736Z" transform="translate(-50.7 -48.14)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

src/assets/icons/jssl.svg

@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="15.263" height="18.111" viewBox="0 0 15.263 18.111">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#2cfff1"/>
+      <stop offset="1" stop-color="#ccedff"/>
+    </linearGradient>
+  </defs>
+  <g id="组_16881" data-name="组 16881" transform="translate(-96 -6.4)">
+    <path id="路径_58024" data-name="路径 58024" d="M108.3,16.879h.228V9.589a1.8,1.8,0,0,0-1.823-1.822H105A1.385,1.385,0,0,0,103.632,6.4H100.9a1.385,1.385,0,0,0-1.367,1.367H97.822A1.957,1.957,0,0,0,96,9.589V20.3a1.8,1.8,0,0,0,1.822,1.823h5.809v-.456A4.716,4.716,0,0,1,108.3,16.879Zm-7.4-9.454h2.734a.456.456,0,1,1,0,.911H100.9a.456.456,0,1,1,0-.911Zm-1.253,5.012H105a.456.456,0,0,1,0,.911H99.645a.49.49,0,0,1-.456-.456C99.189,12.551,99.3,12.437,99.645,12.437Zm3.531,5.126H99.645a.456.456,0,1,1,0-.911h3.531a.49.49,0,0,1,.456.456A.417.417,0,0,1,103.176,17.563ZM99.645,15.4a.456.456,0,1,1,0-.911H105a.456.456,0,0,1,0,.911Z" fill="url(#linear-gradient)"/>
+    <path id="路径_58025" data-name="路径 58025" d="M686.395,673.595m-1.595,0A1.595,1.595,0,1,0,686.395,672,1.595,1.595,0,0,0,684.8,673.595Z" transform="translate(-578.321 -653.754)" fill="url(#linear-gradient)"/>
+    <path id="路径_58026" data-name="路径 58026" d="M611.076,857.6A3.118,3.118,0,0,0,608,860.562h6.151A2.9,2.9,0,0,0,611.076,857.6Z" transform="translate(-502.888 -836.05)" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

src/assets/icons/sjcc.svg

@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.403" height="14.06" viewBox="0 0 16.403 14.06">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#2cfff1"/>
+      <stop offset="1" stop-color="#ccedff"/>
+    </linearGradient>
+  </defs>
+  <g id="组_16883" data-name="组 16883" transform="translate(-113.778 -170.667)">
+    <path id="路径_58030" data-name="路径 58030" d="M113.778,625.778h16.4v3.515a1.172,1.172,0,0,1-1.172,1.172H114.95a1.172,1.172,0,0,1-1.172-1.172v-3.515Zm4.1,2.343a.879.879,0,1,1-.879-.879.879.879,0,0,1,.879.879Zm1.172-.586a.586.586,0,0,0,0,1.172h9.373a.586.586,0,0,0,0-1.172h-9.373Z" transform="translate(0 -445.738)" fill="url(#linear-gradient)"/>
+    <path id="路径_58031" data-name="路径 58031" d="M415.3,337.254c.228.115.228.3,0,.415l-2.156.947a1.054,1.054,0,0,1-.784.021l-1.226-.48c-.269-.09-.342-.272-.162-.407a1,1,0,0,1,.812-.082l.837.381,1.85-.794A1.043,1.043,0,0,1,415.3,337.254Z" transform="translate(-290.974 -163.072)" fill="url(#linear-gradient)"/>
+    <path id="路径_58032" data-name="路径 58032" d="M117.655,170.667a.586.586,0,0,0-.524.323l-3.353,7.878h16.4l-3.353-7.878a.586.586,0,0,0-.524-.323Zm7.84,4.1c0,.97-1.574,1.758-3.515,1.758s-3.515-.787-3.515-1.758,1.574-1.758,3.515-1.758,3.515.787,3.515,1.757Z" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

src/assets/icons/xtyx.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18.884" height="17.837" viewBox="0 0 18.884 17.837">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#2cc1ff"/>
+      <stop offset="1" stop-color="#ccedff"/>
+    </linearGradient>
+  </defs>
+  <g id="组_16884" data-name="组 16884" transform="translate(-41.261 -93.273)">
+    <path id="路径_58028" data-name="路径 58028" d="M433.735,418.671l1.79.164s-.522,2.7,2.015,1.393l1.311,1.311s-2.257,1.693.457,2.488l-.29,1.933s-2.5-.281-1.08,2.04l-1.468,1.287s-1.475-2.123-2.289.415h-1.924s.48-2.837-2.008-1.511l-1.11-1.343s1.841-1.925-.615-2.554v-1.475s2.762-.227,1.394-2.257l1.392-1.278S433.136,421.44,433.735,418.671Zm.215,3.449a2.157,2.157,0,1,0,2.156,2.157A2.158,2.158,0,0,0,433.95,422.12Z" transform="translate(-379.164 -318.592)" fill="url(#linear-gradient)"/>
+    <path id="路径_58029" data-name="路径 58029" d="M46.469,93.273l1.792.164s-.524,2.7,2.015,1.394l1.311,1.309s-2.257,1.693.455,2.491l-.288,1.932s-2.5-.282-1.08,2.04l-1.467,1.287s-1.478-2.124-2.29.414H44.993s.481-2.837-2.007-1.51l-1.11-1.344s1.841-1.925-.615-2.555V97.419s2.762-.223,1.394-2.255l1.393-1.278S45.872,96.042,46.469,93.273Zm.217,3.45a2.156,2.156,0,1,0,2.156,2.157A2.157,2.157,0,0,0,46.686,96.723Zm.838,8.011.946.452s-.829,1.369.822,1.169l.453.979s-1.575.47-.254,1.453l-.548,1s-1.309-.657-1,.9l-1.061.406s-.38-1.457-1.335-.235l-1.052-.387s.835-1.454-.793-1.23l-.337-.96s1.394-.677.179-1.518l.3-.808s1.555.434,1.218-.952l1.019-.418S46.64,106.131,47.525,104.734Zm-.577,1.93a1.257,1.257,0,1,0,.743,1.612A1.258,1.258,0,0,0,46.948,106.665Z" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

src/assets/icons/yhsl.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18.249" height="16.103" viewBox="0 0 18.249 16.103">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#2cc1ff"/>
+      <stop offset="1" stop-color="#ccedff"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_58022" data-name="路径 58022" d="M9.579,71.168a3.422,3.422,0,0,0,1.357.276,3.776,3.776,0,0,0,0-7.544,3.47,3.47,0,0,0-1.254.234,4.98,4.98,0,0,1-.1,7.034ZM12.59,72.7h-1.3a6.393,6.393,0,0,1,2.874,5.39v.41a.872.872,0,0,1-.135.479c1.865-.044,3.215-.238,3.215-1.089v-.317A4.769,4.769,0,0,0,12.59,72.7ZM6.009,71.444a3.776,3.776,0,0,0,0-7.544,3.776,3.776,0,0,0,0,7.544ZM7.661,72.7h-3A4.768,4.768,0,0,0,0,77.574v.315c0,1.1,2.084,1.1,4.656,1.1h3c2.571,0,4.656-.042,4.656-1.1v-.315A4.765,4.765,0,0,0,7.661,72.7Zm0,0" transform="translate(0.5 -63.4)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

src/assets/icons/zxyh.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18.01" height="18.01" viewBox="0 0 18.01 18.01">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#2cfff1"/>
+      <stop offset="1" stop-color="#ccedff"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_58023" data-name="路径 58023" d="M98.249,95.07a7.09,7.09,0,0,0-4.375,7.273h-8.54A8.507,8.507,0,0,1,98.249,95.07Zm-4.411-1.232a4.253,4.253,0,1,1,4.253-4.253,4.252,4.252,0,0,1-4.253,4.253Zm3.544,2.835h4.961v1.417H97.382ZM95.965,98.8h6.379v1.417H95.965Zm-.709,2.126h7.088v1.417H95.256v-1.417Z" transform="translate(-84.833 -84.833)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

src/views/vent/home/configurable/components/content.vue

@@ -4,75 +4,40 @@
   <div class="content">
     <!-- 背景 -->
     <img v-if="background.show && background.type === 'image'" class="content__background" :src="background.link" />
-    <video
-      v-if="background.show && background.type === 'video' && background.isBoard"
-      class="content__background"
-      width="100%"
-      autoplay
-      loop
-      muted
-      disablepictureinpicture
-      playsinline
-    >
+    <video v-if="background.show && background.type === 'video' && background.isBoard" class="content__background"
+      width="100%" autoplay loop muted disablepictureinpicture playsinline>
       <source :src="background.link" />
       Not Supportted Link Or Browser
     </video>
-    <video
-      v-if="background.show && background.type === 'video' && !background.isBoard"
-      class="content__background_1"
-      width="100%"
-      autoplay
-      loop
-      muted
-      disablepictureinpicture
-      playsinline
-    >
+    <video v-if="background.show && background.type === 'video' && !background.isBoard" class="content__background_1"
+      width="100%" autoplay loop muted disablepictureinpicture playsinline>
       <source :src="background.link" />
       Not Supportted Link Or Browser
     </video>
     <div class="flex w-full h-full" :style="{ flexDirection: layout.direction }">
-      <div v-for="config in layoutConfig" :key="config.name" :style="{ flexBasis: config.basis, overflow: config.overflow ? 'auto' : 'hidden' }">
+      <div v-for="config in layoutConfig" :key="config.name"
+        :style="{ flexBasis: config.basis, overflow: config.overflow ? 'auto' : 'hidden' }">
         <!-- 告示板部分 -->
         <template v-if="config.name === 'board'">
-          <div
-            v-if="config.pageType == 'vent_New'"
-            style="padding-top: 11%"
-            class="content__module content__module1 flex flex-justify-around flex-items-center flex-wrap"
-          >
-            <MiniBoard
-              v-for="item in config.items"
-              :key="item.prop"
-              :label="item.label"
-              :value="item.value"
-              :type="config.type"
-              :layout="config.layout"
-            />
+          <div v-if="config.pageType == 'vent_New'" style="padding-top: 11%"
+            class="content__module content__module1 flex flex-justify-around flex-items-center flex-wrap">
+            <MiniBoard v-for="item in config.items" :key="item.prop" :label="item.label" :value="item.value"
+              :type="config.type" :layout="config.layout" />
           </div>
-          <div v-else-if="config.pageType == 'New_fire'" class="content__module flex flex-justify-around flex-items-center flex-wrap">
-            <MiniBoardNew
-              v-for="item in config.items"
-              :key="item.prop"
-              :label="item.label"
-              :value="item.value"
-              :type="config.type"
-              :layout="config.layout"
-            />
+          <div v-else-if="config.pageType == 'New_fire'"
+            class="content__module flex flex-justify-around flex-items-center flex-wrap">
+            <MiniBoardNew v-for="item in config.items" :key="item.prop" :label="item.label" :value="item.value"
+              :type="config.type" :layout="config.layout" />
           </div>
           <div v-else class="content__module flex flex-justify-around flex-items-center flex-wrap">
-            <MiniBoard
-              v-for="item in config.items"
-              :key="item.prop"
-              :label="item.label"
-              :value="item.value"
-              :unit="item.unit"
-              :type="config.type"
-              :layout="config.layout"
-            />
+            <MiniBoard v-for="item in config.items" :key="item.prop" :label="item.label" :value="item.value"
+              :unit="item.unit" :type="config.type" :layout="config.layout" />
           </div>
         </template>
         <!-- 图表部分，这部分通常需要填充，有告示板、Header等内容需要填充父级 -->
         <template v-if="config.name === 'chart'">
-          <CustomChart v-if="config.pageType == 'New_dust'" class="content__module_dust" :chart-config="config.config" :chart-data="config.data" />
+          <CustomChart v-if="config.pageType == 'New_dust'" class="content__module_dust" :chart-config="config.config"
+            :chart-data="config.data" />
           <CustomChart v-else class="content__module" :chart-config="config.config" :chart-data="config.data" />
         </template>
         <!-- 通常列表部分 -->
@@ -96,7 +61,8 @@
         </template>
         <!-- 复杂列表部分 -->
         <template v-if="config.name === 'gallery_list'">
-          <GalleryList class="content__module" :type="config.type" :list-config="config.items" :gallery-config="config.galleryItems" />
+          <GalleryList class="content__module" :type="config.type" :list-config="config.items"
+            :gallery-config="config.galleryItems" />
         </template>
         <!-- 复杂列表部分 -->
         <template v-if="config.name === 'complex_list'">
@@ -104,28 +70,22 @@
         </template>
         <!-- 表格部分，这部分通常是占一整个模块的 -->
         <template v-if="config.name === 'table'">
-          <CustomTable
-            class="content__module text-center overflow-auto"
-            :type="config.type"
-            :columns="config.columns"
-            :auto-scroll="config.autoScroll"
-            :data="config.data"
-          />
+          <CustomTable class="content__module text-center overflow-auto" :type="config.type" :columns="config.columns"
+            :auto-scroll="config.autoScroll" :data="config.data" />
         </template>
         <template v-if="config.name === 'tabs'">
-          <CustomTabs class="content__module" :type="config.type" :tab-config="config.items" :overflow="config.overflow" />
+          <CustomTabs class="content__module" :type="config.type" :tab-config="config.items"
+            :overflow="config.overflow" />
         </template>
         <template v-if="config.name === 'blast_delta'">
-          <BlastDelta
-            v-if="config.pageType === 'New_fire'"
-            class="content__moduleFire"
-            :pos-monitor="config.data"
-            :canvasSize="{ width: 250, height: 200 }"
-          />
-          <BlastDelta v-else class="content__module" :pos-monitor="config.data" :canvasSize="{ width: 250, height: 200 }" />
+          <BlastDelta v-if="config.pageType === 'New_fire'" class="content__moduleFire" :pos-monitor="config.data"
+            :canvasSize="{ width: 250, height: 200 }" />
+          <BlastDelta v-else class="content__module" :pos-monitor="config.data"
+            :canvasSize="{ width: 250, height: 200 }" />
         </template>
         <template v-if="config.name === 'qh_curve'">
-          <QHCurve class="content__module" :mainfan="config.data" :fan1-prop="config.config.fan1Prop" :fan2-prop="config.config.fan2Prop" />
+          <QHCurve class="content__module" :mainfan="config.data" :fan1-prop="config.config.fan1Prop"
+            :fan2-prop="config.config.fan2Prop" />
         </template>
         <template v-if="config.name === 'ai_chat'">
           <AIChat class="content__module" />
@@ -138,13 +98,8 @@
           <SelectCs :devicedata="config.data" :config="config.config" />
         </template>
         <template v-if="config.name === 'measure_detail'">
-          <MeasureDetail
-            class="content__module"
-            :show-title="false"
-            :composite-data="config.data"
-            :topconfig="config.config.topconfig"
-            :btnconfig="config.config.btnconfig"
-          />
+          <MeasureDetail class="content__module" :show-title="false" :composite-data="config.data"
+            :topconfig="config.config.topconfig" :btnconfig="config.config.btnconfig" />
         </template>
         <template v-if="config.name === 'partition'">
           <Partition class="content__module" :type="config.type" :label="config.label" :icon="config.icon" />
@@ -156,7 +111,8 @@
           <RadioLabel class="content__module" :type="config.config.type" :config="config.config" />
         </template>
         <template v-if="config.name === 'button_list'">
-          <ButtonList class="content__module" :type="config.config.type" :config="config.config" :buttonList="config.config.buttonList" />
+          <ButtonList class="content__module" :type="config.config.type" :config="config.config"
+            :buttonList="config.config.buttonList" />
         </template>
         <template v-if="config.name === 'card_list'">
           <cardList class="content__module" :cardData="config.data" />
@@ -187,7 +143,8 @@
           <gasDeviceStatusControl class="content__module" :option="config.config.option" :statusData="config.data" />
         </template>
         <template v-else-if="config.name === 'board_gas'">
-          <gasBoard class="content__module" :option="config.config.option" :type="config.config.type" :listData="config.data" />
+          <gasBoard class="content__module" :option="config.config.option" :type="config.config.type"
+            :listData="config.data" />
         </template>
         <template v-else-if="config.name === 'gas_inject_card'">
           <gasInjectCard class="content__module" :option="config.config.option" />
@@ -199,7 +156,8 @@
           <cameraModal class="content__module" :deviceId="config.data" />
         </template>
         <template v-if="config.name === 'gallery_new'">
-          <CustomGalleryNew class="content__module" :type="config.config.type" :option="config.config.items" :galleryData="config.data" />
+          <CustomGalleryNew class="content__module" :type="config.config.type" :option="config.config.items"
+            :galleryData="config.data" />
         </template>
         <template v-if="config.name === 'card_new'">
           <ImageCardNew :option="config.config.items" :cardData="config.data"></ImageCardNew>
@@ -225,24 +183,33 @@
         <template v-if="config.name === 'mixed_warn'">
           <MixedWarn></MixedWarn>
         </template>
-        <template v-if="config.name === 'rule_table'">
-          <RuleTable></RuleTable>
-        </template>
-        <template v-if="config.name === 'link_log'">
-          <LinkLog></LinkLog>
-        </template>
-        <template v-if="config.name === 'rule_num'">
-          <RuleNum></RuleNum>
-        </template>
-        <template v-if="config.name === 'link_edit'">
-          <LinkRuleEdit></LinkRuleEdit>
-        </template>
         <template v-if="config.name === 'rule_list'">
           <RuleList></RuleList>
         </template>
         <template v-if="config.name === 'echart_bar_new'">
           <EchartBarNew></EchartBarNew>
         </template>
+        <template v-if="config.name === 'user_list'">
+          <UserList></UserList>
+        </template>
+        <template v-if="config.name === 'log_audit'">
+          <LogAudit></LogAudit>
+        </template>
+        <template v-if="config.name === 'user_edit'">
+          <UserEdit></UserEdit>
+        </template>
+        <template v-if="config.name === 'permission_info'">
+          <PermissionManager></PermissionManager>
+        </template>
+        <template v-if="config.name === 'permission_set'">
+          <PermissionSet></PermissionSet>
+        </template>
+        <template v-if="config.name === 'statistic_day'">
+          <StatisticDay></StatisticDay>
+        </template>
+        <template v-if="config.name === 'system_view'">
+          <SystemView></SystemView>
+        </template>
       </div>
     </div>
   </div>
@@ -283,33 +250,36 @@ import RadioLabel from './preset/radioLabel.vue';
 import ButtonList from './preset/buttonList.vue';
 import cardList from './preset/cardList.vue';
 import generalList from './preset/generalList.vue';
-import upDown from './preset/upDown.vue';
-import gasInjectChart from './preset/gasInjectChart.vue';
-import gasInjectList from './preset/gasInjectList.vue';
-import gasZyChart from './preset/gasZyChart.vue';
-import gasZyList from './preset/gasZyList.vue';
-import gasWarnChart from './preset/gasWarnChart.vue';
-import gasWarnList from './preset/gasWarnList.vue';
-import gasDeviceStatusControl from './preset/gasDeviceStatusControl.vue';
-import gasBoard from './preset/gasBoard.vue';
-import gasInjectCard from './preset/gasInjectCard.vue';
-import cameraModal from './preset/cameraModal.vue';
-import echartLine from './preset/echartLine.vue';
-import CustomGalleryNew from './preset/CustomGalleryNew.vue';
-import ImageCardNew from './preset/ImageCardNew.vue';
-import BtnListNew from './preset/BtnListNew.vue';
-import OperateNew from './preset/OperateNew.vue';
-import LongList from '../../../../../../LongList.vue';
-import LongList1 from './preset/LongList1.vue';
-import LongList2 from './preset/LongList2.vue';
-import SearchTable from './preset/SearchTable.vue';
-import RuleTable from './preset/ruleTable.vue';
-import MixedWarn from './preset/MixedWarn.vue';
-import LinkLog from './preset/linkLog.vue';
-import RuleNum from './preset/ruleNum.vue';
-import LinkRuleEdit from './preset/linkRuleEdit.vue';
-import RuleList from './preset/RuleList.vue';
-import EchartBarNew from './preset/EchartBarNew.vue';
+import upDown from './preset/upDown.vue'
+import gasInjectChart from './preset/gasInjectChart.vue'
+import gasInjectList from './preset/gasInjectList.vue'
+import gasZyChart from './preset/gasZyChart.vue'
+import gasZyList from './preset/gasZyList.vue'
+import gasWarnChart from './preset/gasWarnChart.vue'
+import gasWarnList from './preset/gasWarnList.vue'
+import gasDeviceStatusControl from './preset/gasDeviceStatusControl.vue'
+import gasBoard from './preset/gasBoard.vue'
+import gasInjectCard from './preset/gasInjectCard.vue'
+import cameraModal from './preset/cameraModal.vue'
+import echartLine from './preset/echartLine.vue'
+import CustomGalleryNew from './preset/CustomGalleryNew.vue'
+import ImageCardNew from './preset/ImageCardNew.vue'
+import BtnListNew from './preset/BtnListNew.vue'
+import OperateNew from './preset/OperateNew.vue'
+import LongList from './preset/LongList.vue'
+import LongList1 from './preset/LongList1.vue'
+import LongList2 from './preset/LongList2.vue'
+import SearchTable from './preset/SearchTable.vue'
+import MixedWarn from './preset/MixedWarn.vue'
+import RuleList from './preset/RuleList.vue'
+import EchartBarNew from './preset/EchartBarNew.vue'
+import UserList from './preset/UserList.vue'
+import LogAudit from './preset/LogAudit.vue'
+import UserEdit from './preset/UserEdit.vue'
+import PermissionManager from './preset/PermissionManager.vue'
+import PermissionSet from './preset/PermissionSet.vue'
+import StatisticDay from './preset/StatisticDay.vue'
+import SystemView from './preset/SystemView.vue'
 // import FIreWarn from './preset/FIreWarn.vue';
 // import FIreControl from './preset/FIreControl.vue';
 

src/views/vent/home/configurable/components/preset/LogAudit.vue

@@ -0,0 +1,207 @@
+<template>
+  <div class="log-audit">
+    <div class="list-title">
+      <div class="title-l">日志审计</div>
+      <div class="title-r">
+        <div :class="activeIndex == index ? 'basic-btn-active' : 'basic-btn'" v-for="(item, index) in btnList"
+          :key="index" @click="handleClick(item, index)">{{
+            item.label }}</div>
+      </div>
+    </div>
+    <div class="list-content">
+      <div class="content-title">
+        <div class="title-item" v-for="(item, index) in titleList" :key="index">{{ item.label }}</div>
+      </div>
+      <div class="table-content">
+        <div class="content-item" v-for="(item, index) in tableData" :key="index">
+          <div class="item-text">{{ item.id }}</div>
+          <div class="item-text">{{ item.address }}
+          </div>
+          <div class="item-text item-text1">{{ item.grade }}</div>
+          <div class="item-text item-text2">{{ item.status }}</div>
+          <div class="item-text">
+            <span class="text-look">确认</span>
+            <span class="text-look">详情</span>
+          </div>
+        </div>
+      </div>
+
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+let activeIndex = ref(0)
+let btnList = ref<any[]>([
+  { label: '全部', value: '1' },
+  { label: '登录日志', value: '2' },
+  { label: '操作日志', value: '3' },
+  { label: '报警日志', value: '4' },
+])
+let titleList = ref<any[]>([
+  { label: '时间', value: '1' },
+  { label: '用户名', value: '2' },
+  { label: '操作类型', value: '3' },
+  { label: '操作内容', value: '4' },
+  { label: 'IP地址', value: '5' },
+  { label: '结果', value: '5' },
+  { label: '详情', value: '5' },
+])
+let tableData = ref<any[]>([
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+])
+
+//menu选项切换
+function handleClick(item, index) {
+  activeIndex.value = index
+}
+</script>
+
+<style lang="less" scoped>
+@import '/@/design/theme.less';
+
+@{theme-deepblue} {
+  .log-audit {}
+}
+
+.log-audit {
+  --image-box-bg: url('@/assets/images/home-container/configurable/hsq/2-5.png');
+  --image-box-bg1: url('@/assets/images/home-container/configurable/hsq/2-6.png');
+  --image-box-bg2: url('@/assets/images/home-container/configurable/hsq/2-24.png');
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 15px;
+  box-sizing: border-box;
+
+  .list-title {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    height: 30px;
+    line-height: 22px;
+    margin-bottom: 10px;
+  }
+
+  .title-l {
+    width: 177px;
+    height: 100%;
+    color: #01fefc;
+    font-weight: bolder;
+    padding-left: 16px;
+    background: var(--image-box-bg) no-repeat;
+    background-size: 100% 100%;
+  }
+
+  .title-r {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 290px;
+    height: 28px;
+  }
+
+  .basic-btn {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 68px;
+    height: 100%;
+    background-color: rgba(24, 95, 142, .8);
+    // border: 1px solid #2499db;
+    cursor: pointer;
+  }
+
+  .basic-btn-active {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 68px;
+    height: 100%;
+    background-color: rgba(24, 95, 142, .8);
+    border: 2px solid #2499db;
+    cursor: pointer;
+  }
+
+  .list-content {
+    height: calc(100% - 40px);
+  }
+
+  .content-title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 34px;
+    background: var(--image-box-bg2) no-repeat;
+    background-size: 100% 100%;
+    margin-bottom: 6px;
+  }
+
+  .title-item {
+    display: flex;
+    flex: 1;
+    justify-content: center;
+    align-items: center;
+    color: #01fefc;
+  }
+
+  .table-content {
+    height: calc(100% - 40px);
+    overflow-y: auto;
+  }
+
+  .content-item {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 36px;
+
+    &:nth-child(odd) {
+      background-color: #0e3455;
+    }
+
+    &:nth-child(even) {
+      background-color: #114268;
+    }
+  }
+
+  .item-text {
+    display: flex;
+    flex: 1;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .item-text1 {
+    color: #fc002a;
+  }
+
+  .item-text2 {
+    color: orange;
+  }
+
+  .text-look {
+    padding: 0px 3px;
+    margin: 0px 2px;
+    border-radius: 2px;
+    background-color: #2484bc;
+    cursor: pointer;
+  }
+}
+</style>

src/views/vent/home/configurable/components/preset/LongList1.vue

@@ -137,7 +137,7 @@
 
 <script setup lang="ts">
 import { reactive, ref } from 'vue'
-import basicBorder from '../BasicBorder.vue'
+import basicBorder from '../basicBorder.vue'
 import { SvgIcon } from '/@/components/Icon';
 
 let deviceModel = ref('CAM-001')

src/views/vent/home/configurable/components/preset/PermissionManager.vue

@@ -0,0 +1,123 @@
+<template>
+  <div class="permission-manager">
+    <div class="list-title">角色权限管理</div>
+    <div class="list-content">
+      <div class="per-box" v-for="(item, index) in perList" :key="index">
+        <div class="box-label">{{ item.label }}</div>
+        <div class="box-value">{{ item.value }}</div>
+      </div>
+    </div>
+
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+let perList = ref<any[]>([
+  { label: '超级管理员（全部权限）', value: '1' },
+  { label: '安全主管（报警处理+设备管理）', value: '2' },
+  { label: '值班员（监控+报警确认）', value: '2' },
+  { label: '设备维护（设备管理+配置）', value: '2' },
+  { label: '访客（仅查看）', value: '2' },
+])
+</script>
+
+<style lang="less" scoped>
+@import '/@/design/theme.less';
+
+@{theme-deepblue} {
+  .permission-manager {}
+}
+
+.permission-manager {
+  --image-box-bg: url('@/assets/images/home-container/configurable/hsq/5-8.png');
+  --image-box-bg1: url('@/assets/images/home-container/configurable/hsq/5-11.png');
+  --image-box-bg2: url('@/assets/images/home-container/configurable/hsq/5-12.png');
+  --image-box-bg3: url('@/assets/images/home-container/configurable/hsq/5-9.png');
+  --image-box-bg4: url('@/assets/images/home-container/configurable/hsq/5-10.png');
+  --image-box-bg5: url('@/assets/images/home-container/configurable/hsq/2-5.png');
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 15px;
+  box-sizing: border-box;
+
+  .list-title {
+    width: 177px;
+    height: 30px;
+    line-height: 22px;
+    padding-left: 16px;
+    color: #01fefc;
+    font-weight: bolder;
+    background: var(--image-box-bg5) no-repeat;
+    background-size: 100% 100%;
+    margin-bottom: 5px;
+  }
+
+  .list-content {
+    width: 100%;
+    height: calc(100% - 35px);
+  }
+
+  .per-box {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 40px;
+    padding: 0px 40px;
+    margin-bottom: 10px;
+
+    &:nth-child(1) {
+      background: var(--image-box-bg) no-repeat;
+      background-size: 100% 100%;
+
+      .box-value {
+        color: #fc002a;
+      }
+    }
+
+    &:nth-child(2) {
+      background: var(--image-box-bg1) no-repeat;
+      background-size: 100% 100%;
+
+      .box-value {
+        color: orange;
+      }
+    }
+
+    &:nth-child(3) {
+      background: var(--image-box-bg2) no-repeat;
+      background-size: 100% 100%;
+
+      .box-value {
+        color: #2bb3fb;
+      }
+    }
+
+    &:nth-child(4) {
+      background: var(--image-box-bg3) no-repeat;
+      background-size: 100% 100%;
+
+      .box-value {
+        color: #2cff96;
+      }
+    }
+
+    &:nth-child(5) {
+      background: var(--image-box-bg4) no-repeat;
+      background-size: 100% 100%;
+
+      .box-value {
+        color: #ffce2c;
+      }
+    }
+  }
+
+  .box-value {
+    font-size: 12px;
+    font-family: 'douyuFont';
+
+  }
+}
+</style>

src/views/vent/home/configurable/components/preset/PermissionSet.vue

@@ -0,0 +1,47 @@
+<template>
+  <div class="permission-set">
+    <basicBorder title="安全主管【权限配置】" color-v="orange" :width-v="174">
+      <a-checkbox-group v-model:value="value" name="checkboxgroup" :options="plainOptions" />
+    </basicBorder>
+
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import basicBorder from '../basicBorder.vue'
+
+let value = ref<any[]>([])
+let plainOptions = ref<any[]>([
+  { label: '一张图查看', value: '1' },
+  { label: '报警确认处理', value: '2' },
+  { label: '报警解除', value: '3' },
+  { label: '视频调取查看', value: '4' },
+  { label: '设备状态查看', value: '5' },
+  { label: '设备参数配置', value: '6' },
+  { label: '设备重启', value: '7' },
+  { label: '联动规则编辑', value: '8' },
+  { label: '联动规则查看', value: '9' },
+  { label: '联动日志查看', value: '10' },
+  { label: '用户管理', value: '11' },
+  { label: '角色权限管理', value: '12' },
+])
+</script>
+
+<style lang="less" scoped>
+.permission-set {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 15px;
+  box-sizing: border-box;
+ 
+}
+:deep(.zxm-checkbox-group-item){
+    width: 50% !important;
+    margin: 0px 0px 15px 0px !important;
+    padding: 0px 15px !important;
+      background: linear-gradient(to right, #134c77, transparent) !important;
+      color: #fff !important;
+  }
+</style>

src/views/vent/home/configurable/components/preset/SearchTable.vue

@@ -178,4 +178,7 @@ let tableData = ref<any[]>([
 .zxm-input-sm {
   padding: 0px 20px;
 }
+::-webkit-scrollbar{
+    display: none;
+  }
 </style>

src/views/vent/home/configurable/components/preset/StatisticDay.vue

@@ -0,0 +1,79 @@
+<template>
+  <div class="statistic-day">
+    <div class="list-title">今日登录统计</div>
+     <div class="list-content">
+        <basicBorder title="最近登录">
+          <div class="basic-box">
+            <div class="box-item" v-for="(item,index) in list" :key="index">
+              <span style="margin-right: 10px;">{{ `${item.label} : ` }}</span>
+              <span>{{ item.value }}</span>
+            </div>
+          </div>
+        </basicBorder>
+     </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import basicBorder from '../basicBorder.vue'
+
+let list=ref<any[]>([
+  {label:'名称',value:'14:15:33 192.168.1.42'},
+  {label:'名称',value:'14:15:33 192.168.1.42'},
+  {label:'名称',value:'14:15:33 192.168.1.42'},
+  {label:'名称',value:'14:15:33 192.168.1.42'},
+  {label:'名称',value:'14:15:33 192.168.1.42'},
+  {label:'名称',value:'14:15:33 192.168.1.42'},
+])
+</script>
+
+<style lang="less" scoped>
+@import '/@/design/theme.less';
+
+@{theme-deepblue} {
+  .statistic-day {}
+}
+
+.statistic-day {
+  --image-box-bg: url('@/assets/images/home-container/configurable/hsq/2-5.png');
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 15px;
+  box-sizing: border-box;
+
+  .list-title {
+    width: 177px;
+    height: 30px;
+    line-height: 22px;
+    padding-left: 16px;
+    color: #01fefc;
+    font-weight: bolder;
+    background: var(--image-box-bg) no-repeat;
+    background-size: 100% 100%;
+    margin-bottom: 5px;
+  }
+   .list-content {
+    width: 100%;
+    height: calc(100% - 35px);
+  }
+  .basic-box{
+    height: 100%;
+    overflow-y: auto;
+  }
+  .box-item{
+    display: flex;
+    // justify-content: space-between;
+    align-items: center;
+    height: 26px;
+    margin-bottom: 6px;
+    padding: 0px 10px;
+    box-sizing: border-box;
+     background: linear-gradient(to right, #134c77, transparent);
+  }
+   ::-webkit-scrollbar {
+    display: none;
+  }
+}
+</style>

src/views/vent/home/configurable/components/preset/SystemView.vue

@@ -0,0 +1,122 @@
+<template>
+  <div class="system-view">
+    <div class="list-title">系统概览</div>
+    <div class="list-content">
+      <div class="basic-box" v-for="(item, index) in List" :key="index">
+        <SvgIcon class="icon-style" size="18" :name="item.icon" />
+        <span class="text-label">{{ item.label }}</span>
+        <span class="text-value">{{ item.value }}</span>
+      </div>
+    </div>
+
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { SvgIcon } from '/@/components/Icon';
+
+let List = ref<any[]>([
+  { label: '用户总数', value: '10', icon: 'yhsl' },
+  { label: '在线用户', value: '7', icon: 'zxyh' },
+  { label: '角色数量', value: '2', icon: 'jssl' },
+  { label: '今日登录', value: '2', icon: 'jrdl' },
+  { label: '系统运行', value: '10', icon: 'xtyx' },
+  { label: '数据储存', value: '7', icon: 'sjcc' },
+])
+
+</script>
+
+<style lang="less" scoped>
+@import '/@/design/theme.less';
+
+@{theme-deepblue} {
+  .system-view {}
+}
+
+.system-view {
+  --image-box-bg: url('@/assets/images/home-container/configurable/hsq/2-16.png');
+  --image-box-bg1: url('@/assets/images/home-container/configurable/hsq/2-17.png');
+  --image-box-bg2: url('@/assets/images/home-container/configurable/hsq/2-5.png');
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 15px;
+  box-sizing: border-box;
+
+  .list-title {
+    width: 177px;
+    height: 30px;
+    line-height: 22px;
+    padding-left: 16px;
+    color: #01fefc;
+    font-weight: bolder;
+    background: var(--image-box-bg2) no-repeat;
+    background-size: 100% 100%;
+    margin-bottom: 5px;
+  }
+
+  .list-content {
+    display: flex;
+    flex-wrap: wrap;
+    width: 100%;
+    height: calc(100% - 35px);
+  }
+
+  .basic-box {
+    position: relative;
+    width: calc(50% - 10px);
+    height: 37px;
+    margin: 0px 5px;
+    display: flex;
+    align-items: center;
+
+    &:nth-child(1) {
+      background: var(--image-box-bg) no-repeat center;
+      background-size: 100% auto;
+    }
+
+    &:nth-child(2) {
+      background: var(--image-box-bg1) no-repeat center;
+      background-size: 100% auto;
+    }
+
+    &:nth-child(3) {
+      background: var(--image-box-bg1) no-repeat center;
+      background-size: 100% auto;
+    }
+
+    &:nth-child(4) {
+      background: var(--image-box-bg) no-repeat center;
+      background-size: 100% auto;
+    }
+
+    &:nth-child(5) {
+      background: var(--image-box-bg) no-repeat center;
+      background-size: 100% auto;
+    }
+
+    &:nth-child(6) {
+      background: var(--image-box-bg1) no-repeat center;
+      background-size: 100% auto;
+    }
+  }
+
+  .icon-style {
+    position: absolute;
+    left: 7px;
+  }
+
+  .text-label {
+    position: absolute;
+    left: 42px;
+  }
+
+  .text-value {
+    position: absolute;
+    right: 18px;
+    font-family: 'douyuFont';
+    font-size: 12px;
+  }
+}
+</style>

src/views/vent/home/configurable/components/preset/UserEdit.vue

@@ -0,0 +1,202 @@
+<template>
+  <div class="user_edit">
+    <div class="list-title">
+      <span>编辑用户</span>
+      <span style="margin-left: 5px;">{{ userName }}</span>
+    </div>
+    <div class="list-content">
+      <div class="basic-info">
+        <div class="info-item">
+          <div class="item-basic">
+            <div class="item-label">用户名 : </div>
+            <a-input class="item-input" v-model:value="editData.username" placeholder="请输入" size="small" />
+          </div>
+          <div class="item-basic">
+            <div class="item-label">用户角色 : </div>
+            <a-input class="item-input" v-model:value="editData.userJs" placeholder="请输入" size="small" />
+          </div>
+        </div>
+        <div class="info-item">
+          <div class="item-basic">
+            <div class="item-label">真实姓名 : </div>
+            <a-input class="item-input" v-model:value="editData.name" placeholder="请输入" size="small" />
+          </div>
+          <div class="item-basic">
+            <div class="item-label">登录密码 : </div>
+            <a-input class="item-input" v-model:value="editData.pass" placeholder="请输入" size="small" />
+          </div>
+        </div>
+        <div class="info-item">
+          <div class="item-basic">
+            <div class="item-label">所属部门 : </div>
+            <a-input class="item-input" v-model:value="editData.ssbm" placeholder="请输入" size="small" />
+          </div>
+          <div class="item-basic">
+            <div class="item-label">确认密码 : </div>
+            <a-input class="item-input" v-model:value="editData.passqr" placeholder="请输入" size="small" />
+          </div>
+        </div>
+        <div class="info-item">
+          <div class="item-basic">
+            <div class="item-label">联系电话 : </div>
+            <a-input class="item-input" v-model:value="editData.phone" placeholder="请输入" size="small" />
+          </div>
+          <div class="item-basic">
+            <div class="item-label">电子邮箱 : </div>
+            <a-input class="item-input" v-model:value="editData.email" placeholder="请输入" size="small" />
+          </div>
+        </div>
+        <div class="info-item">
+          <div class="item-basic1">
+            <div class="item-label1">账号状态 : </div>
+            <a-radio-group v-model:value="editData.status">
+              <a-radio :value="1">正常启用</a-radio>
+              <a-radio :value="0">禁用</a-radio>
+            </a-radio-group>
+          </div>
+        </div>
+      </div>
+      <div class="btn-box">
+        <div class="baisc-btn">取消</div>
+        <div class="baisc-btn">
+          <div class="btn-item">保存</div>
+        </div>
+      </div>
+
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { reactive, ref } from 'vue'
+import basicBorder from '../BasicBorder.vue'
+
+let userName = ref('xxx')
+let editData = reactive({
+  username: '',
+  userJs: '',
+  name: '',
+  pass: '',
+  ssbm: '',
+  passqr: '',
+  phone: '',
+  email: '',
+  status: 1,
+})
+</script>
+
+<style lang="less" scoped>
+@import '/@/design/theme.less';
+
+@{theme-deepblue} {
+  .user_edit {}
+}
+
+.user_edit {
+  --image-box-bg: url('@/assets/images/home-container/configurable/hsq/5-7.png');
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 15px;
+  box-sizing: border-box;
+
+  .list-title {
+    width: 177px;
+    height: 30px;
+    line-height: 22px;
+    padding-left: 16px;
+    color: orange;
+    font-weight: bolder;
+    background: var(--image-box-bg) no-repeat;
+    background-size: 100% 100%;
+    margin-bottom: 15px;
+  }
+
+  .list-content {
+    width: 100%;
+    height: calc(100% - 45px);
+  }
+
+  .basic-info {
+    height: 100%;
+  }
+
+  .info-item {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 32px;
+    margin-bottom: 10px;
+    padding: 0px 10px;
+    box-sizing: border-box;
+  }
+
+  .item-basic {
+    display: flex;
+    width: 48%;
+    justify-content: space-between;
+    align-items: center;
+    background: linear-gradient(to right, #134c77, transparent);
+  }
+
+  .item-basic1 {
+    display: flex;
+    width: 48%;
+    align-items: center;
+    background: linear-gradient(to right, #134c77, transparent);
+  }
+
+  .item-label {
+    width: 130px;
+    text-align: right;
+    margin-right: 5px;
+  }
+
+  .item-label1 {
+    width: 86px;
+    text-align: right;
+    margin-right: 5px;
+  }
+
+  .zxm-input {
+    background-color: transparent;
+    border: 1px solid #2792c2;
+    color: #fff;
+  }
+
+  .btn-box {
+    width: 190px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    position: absolute;
+    right: 16px;
+    bottom: 18px;
+  }
+
+  .baisc-btn {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 85px;
+    height: 30px;
+    border: 1px solid #01fefc;
+    border-radius: 4px;
+    padding: 3px;
+    cursor: pointer;
+  }
+
+  .btn-item {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(32, 166, 169);
+  }
+
+  ::-webkit-scrollbar {
+    display: none;
+  }
+}
+</style>

src/views/vent/home/configurable/components/preset/UserList.vue

@@ -0,0 +1,229 @@
+<template>
+  <div class="user-list">
+    <div class="list-title">
+      <div class="title-l">用户列表</div>
+      <div class="title-r">
+        <div class="basic-btn">新增用户</div>
+      </div>
+    </div>
+    <div class="list-content">
+      <div class="search-area">
+        <a-input v-model:value="searchData" placeholder="搜索" size="small" />
+        <div class="search-btn">
+          <div class="basic-btn">筛选</div>
+        </div>
+      </div>
+      <div class="content-area">
+        <div class="content-title">
+          <div class="title-item" v-for="(item, index) in titleList" :key="index">{{ item.label }}</div>
+        </div>
+        <div class="table-content">
+          <div class="content-item" v-for="(item, index) in tableData" :key="index">
+            <div class="item-text">{{ item.id}}</div>
+            <div class="item-text">{{ item.address }}
+            </div>
+            <div class="item-text item-text1">{{ item.grade }}</div>
+            <div class="item-text item-text2">{{ item.status }}</div>
+            <div class="item-text">
+              <span class="text-look">确认</span>
+              <span class="text-look">详情</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+
+let searchData = ref('')
+let titleList = ref<any[]>([
+  { label: 'ID', value: '1' },
+  { label: '用户名', value: '2' },
+  { label: '姓名', value: '3' },
+  { label: '角色', value: '4' },
+  { label: '部门', value: '5' },
+  { label: '电话', value: '5' },
+  { label: '状态', value: '5' },
+  { label: '操作', value: '5' },
+])
+let tableData = ref<any[]>([
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+  // { time: '14:31:22', address: '采掘场A区', grade: '一级', status: '未处理', },
+])
+</script>
+
+<style lang="less" scoped>
+@import '/@/design/theme.less';
+
+@{theme-deepblue} {
+  .user-list {}
+}
+
+.user-list {
+  --image-box-bg: url('@/assets/images/home-container/configurable/hsq/2-5.png');
+  --image-box-bg1: url('@/assets/images/home-container/configurable/hsq/2-6.png');
+  --image-box-bg2: url('@/assets/images/home-container/configurable/hsq/2-24.png');
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 15px;
+  box-sizing: border-box;
+
+  .list-title {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    height: 30px;
+    line-height: 22px;
+    margin-bottom: 10px;
+  }
+
+  .title-l {
+    width: 177px;
+    height: 100%;
+    color: #01fefc;
+    font-weight: bolder;
+    padding-left: 16px;
+    background: var(--image-box-bg) no-repeat;
+    background-size: 100% 100%;
+  }
+
+  .title-r {
+    width: 85px;
+    height: 30px;
+    border: 1px solid #01fefc;
+    border-radius: 4px;
+    padding: 3px;
+    cursor: pointer;
+    // margin-right: 16px;
+  }
+
+  .basic-btn {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(32, 166, 169);
+  }
+
+  .list-content {
+    height: calc(100% - 40px);
+  }
+
+  .search-area {
+    height: 42px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 5px;
+  }
+
+  .search-btn {
+    width: 85px;
+    height: 30px;
+    border: 1px solid #01fefc;
+    border-radius: 4px;
+    padding: 3px;
+    cursor: pointer;
+  }
+
+  .content-area {
+    height: calc(100% - 47px);
+  }
+
+  .content-title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 34px;
+    background: var(--image-box-bg2) no-repeat;
+    background-size: 100% 100%;
+    margin-bottom: 6px;
+  }
+
+  .title-item {
+    display: flex;
+    flex: 1;
+    justify-content: center;
+    align-items: center;
+    color: #01fefc;
+  }
+
+  .table-content {
+    height: calc(100% - 40px);
+    overflow-y: auto;
+  }
+
+  .content-item {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 36px;
+
+    &:nth-child(odd) {
+      background-color: #0e3455;
+    }
+
+    &:nth-child(even) {
+      background-color: #114268;
+    }
+  }
+
+  .item-text {
+    display: flex;
+    flex: 1;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .item-text1 {
+    color: #fc002a;
+  }
+
+  .item-text2 {
+    color: orange;
+  }
+
+  .text-look {
+    padding: 0px 3px;
+    margin: 0px 2px;
+    border-radius: 2px;
+    background-color: #2484bc;
+    cursor: pointer;
+  }
+
+  .zxm-input {
+    height: 42px;
+    color: #fff;
+    background-color: transparent;
+    border: none;
+    background: var(--image-box-bg1) no-repeat;
+    background-size: 100% 100%;
+  }
+
+  .zxm-input-sm {
+    padding: 0px 20px;
+  }
+
+  ::-webkit-scrollbar {
+    display: none;
+  }
+}
+</style>

src/views/vent/home/configurable/configurable.data.ts

@@ -1124,7 +1124,7 @@ export const testConfigSystem: Config[] = [
         direction: 'column',
         items: [
           {
-            name: '',
+            name: 'user_list',
             basis: '100%',
           },
         ],
@@ -1176,7 +1176,7 @@ export const testConfigSystem: Config[] = [
         direction: 'column',
         items: [
           {
-            name: '',
+            name: 'user_edit',
             basis: '100%',
           },
         ],
@@ -1228,8 +1228,12 @@ export const testConfigSystem: Config[] = [
         direction: 'column',
         items: [
           {
-            name: '',
-            basis: '100%',
+            name: 'permission_info',
+            basis: '50%',
+          },
+          {
+            name: 'permission_set',
+            basis: '50%',
           },
         ],
       },
@@ -1244,6 +1248,9 @@ export const testConfigSystem: Config[] = [
         {
           readFrom: '',
         },
+        {
+          readFrom: '',
+        },
       ],
       to: '/micro-vent-3dModal/dashboard/analysis?type=tunMonitor&deviceType=fanmain',
     },
@@ -1280,7 +1287,7 @@ export const testConfigSystem: Config[] = [
         direction: 'column',
         items: [
           {
-            name: '',
+            name: 'log_audit',
             basis: '100%',
           },
         ],
@@ -1296,6 +1303,7 @@ export const testConfigSystem: Config[] = [
         {
           readFrom: '',
         },
+
       ],
       to: '/micro-vent-3dModal/dashboard/analysis?type=tunMonitor&deviceType=fanmain',
     },
@@ -1329,17 +1337,36 @@ export const testConfigSystem: Config[] = [
         link: '',
       },
       layout: {
-        direction: 'column',
+        direction: 'row',
         items: [
           {
-            name: '',
-            basis: '100%',
+            name: 'statistic_day',
+            basis: '50%',
+          },
+          {
+            name: 'chart',
+            basis: '50%',
           },
         ],
       },
       board: [],
       list: [],
-      chart: [],
+      chart: [
+        {
+          type: 'bar_cylinder_wide',
+          readFrom: '',
+          grid: {
+            top: 55,
+            left: 20,
+            bottom:35,
+            right: 50,
+          },
+          legend: { show: false },
+          xAxis: [{ show: true }],
+          yAxis: [{ show: true, name: '', position: 'left' }],
+          series: [{ readFrom: 'areaTemptureData', xprop: 'x', yprop: 'y', label: '温度' }],
+        },
+      ],
       table: [],
       gallery: [],
       complex_list: [],
@@ -1384,7 +1411,7 @@ export const testConfigSystem: Config[] = [
         direction: 'column',
         items: [
           {
-            name: '',
+            name: 'system_view',
             basis: '100%',
           },
         ],

src/views/vent/home/configurable/gasInjection.vue

@@ -15,13 +15,14 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 import { useInitConfigs, useInitPage } from './hooks/useInit';
-import navMenu from './components/navMenu.vue';
-import fireMonitor from './fireMonitor.vue';
-import deviceManger from './deviceManger.vue';
-import warnMonitor from './warnMonitor.vue';
-import systemManger from './systemManger.vue';
-import linkConfiguration from './linkConfiguration.vue';
-const { mainTitle, data, updateData } = useInitPage('红沙泉露天煤矿系统');
+import navMenu from './components/navMenu.vue'
+import fireMonitor from './fireMonitor.vue'
+import deviceManger from './deviceManger.vue'
+import warnMonitor from './warnMonitor.vue'
+import systemManger from './systemManger.vue'
+import largeScreen from './largeScreen.vue'
+
+const { mainTitle, data, updateData } = useInitPage('红纱泉露天煤矿系统');
 //当前激活界面
 const activeComponente = ref<any>(fireMonitor);
 
@@ -44,6 +45,7 @@ function changeMenu(param) {
       activeComponente.value = systemManger;
       break;
     case 'dpzs':
+        activeComponente.value = largeScreen
       break;
   }
 }

src/views/vent/home/configurable/largeScreen.vue

@@ -0,0 +1,19 @@
+<template>
+  <div>
+
+  </div>
+</template>
+
+<script>
+export default {
+  setup () {
+    
+
+    return {}
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>