feat: 样式更换

src/views/family/operate/order/components/ModifyOrder.vue

@@ -2,7 +2,15 @@
   <div class="app-container">
     <el-card shadow="never" v-loading="loading">
       <el-form :model="formData" ref="ruleFormRef" :rules="rules">
-        <el-descriptions title="工单信息修改" :column="3" border>
+        <el-descriptions :column="3" border>
+          <template #title>
+            <div style="display: flex; align-items: center">
+              <el-icon size="15"><Grid /></el-icon>&nbsp;<span
+                style="font-weight: 700; font-size: 14px; line-height: 16px"
+                >工单信息修改</span
+              >
+            </div>
+          </template>
           <template #extra>
             <el-popconfirm
               title="确定修改工单吗?"
@@ -147,7 +155,7 @@ import {
   getModifyForm,
   ModifyForm,
 } from "@/api/order";
-import { InfoFilled } from "@element-plus/icons-vue";
+import { Grid, InfoFilled } from "@element-plus/icons-vue";
 import { FormInstance, FormRules } from "element-plus";
 import ModifyServiceParameter from "@/views/family/operate/order/components/ModifyServiceParameter.vue";
 const loading = ref<boolean>(false);

src/views/family/operate/order/components/OrderInfoEdit.vue

@@ -35,7 +35,15 @@
     </div>
     <el-card shadow="never" v-loading="loading">
       <el-scrollbar height="500">
-        <el-descriptions title="工单信息" :column="3" border>
+        <el-descriptions :column="3" border>
+          <template #title>
+            <div style="display: flex; align-items: center">
+              <el-icon size="15"><Grid /></el-icon>&nbsp;<span
+                style="font-weight: 700; font-size: 14px; line-height: 16px"
+                >工单信息</span
+              >
+            </div>
+          </template>
           <el-descriptions-item
             label="工单序号"
             label-align="left"
@@ -242,12 +250,15 @@
             {{ orderInfo.devAccessType }}
           </el-descriptions-item>
         </el-descriptions>
-        <el-descriptions
+        <el-descriptions :column="3" border style="margin-top: 10px">
-          title="客户信息"
+          <template #title>
-          :column="3"
+            <div style="display: flex; align-items: center">
-          border
+              <el-icon size="15"><Grid /></el-icon>&nbsp;<span
-          style="margin-top: 10px"
+                style="font-weight: 700; font-size: 14px; line-height: 16px"
-        >
+                >客户信息</span
+              >
+            </div>
+          </template>
           <el-descriptions-item
             label="系统管理域"
             label-align="left"
@@ -307,10 +318,13 @@
             {{ orderInfo.dummyFlag }}
           </el-descriptions-item>
         </el-descriptions>
-        <div class="mt-1">
+        <div class="mt-2">
           <div style="display: flex; justify-content: space-between">
-            <div style="font-weight: 700; line-height: 32px; font-size: 14px">
+            <div style="display: flex; align-items: center">
-              工单业务信息列表
+              <el-icon size="15"><Grid /></el-icon>&nbsp;<span
+                style="font-weight: 700; font-size: 14px; line-height: 16px"
+                >工单业务信息列表</span
+              >
             </div>
           </div>
           <div class="any-table">
@@ -357,7 +371,7 @@ import {
   findOrderInfoServicePage,
   updateOrderStatus,
 } from "@/api/order";
-import { InfoFilled } from "@element-plus/icons-vue";
+import { Grid, InfoFilled } from "@element-plus/icons-vue";
 import OrderServiceParameterTable from "@/views/family/operate/order/components/OrderServiceParameterTable.vue";
 import OrderLog from "@/views/family/operate/order/components/OrderLog.vue";
 import BindingDevice from "@/views/family/operate/order/components/BindingDevice.vue";
@@ -458,4 +472,7 @@ onMounted(() => {
 :deep(.el-scrollbar__thumb) {
   display: none;
 }
+:deep(.el-card__body) {
+  padding: 10px 5px;
+}
 </style>

src/views/family/operate/remote-operation/components/OperateTabs.vue

@@ -1,17 +1,19 @@
 <template>
-  <div style="margin-top: 10px">
+  <div>
-    <el-tabs type="border-card">
+    <el-card shadow="never">
-      <el-tab-pane label="设备状态信息">
+      <el-tabs type="border-card">
-        <device-status :dev-id="devId" :type-and-ver-id="prop.typeAndVerId" />
+        <el-tab-pane label="设备状态信息">
-      </el-tab-pane>
+          <device-status :dev-id="devId" :type-and-ver-id="prop.typeAndVerId" />
-      <el-tab-pane
+        </el-tab-pane>
-        :label="item.servName"
+        <el-tab-pane
-        v-for="item in tabs"
+          :label="item.servName"
-        :key="item.servId"
+          v-for="item in tabs"
-      >
+          :key="item.servId"
-        <device-service :dev-id="prop.devId" :service="item" />
+        >
-      </el-tab-pane>
+          <device-service :dev-id="prop.devId" :service="item" />
-    </el-tabs>
+        </el-tab-pane>
+      </el-tabs>
+    </el-card>
   </div>
 </template>
 

src/views/family/operate/remote-operation/components/RemoteOperateInfo.vue

@@ -29,7 +29,7 @@
               title="确定解绑逻辑ID吗?"
             >
               <template #reference>
-                <el-button type="primary">解绑逻辑ID</el-button>
+                <el-button type="primary" class="mr-1">解绑逻辑ID</el-button>
               </template>
             </el-popconfirm>
           </template>
@@ -381,7 +381,7 @@ onMounted(() => {
 });
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 :deep(.my-label) {
   background: var(--el-color-white) !important;
 }
@@ -393,4 +393,7 @@ onMounted(() => {
 :deep(.el-divider--vertical) {
   height: 2.2em !important;
 }
+:deep(.el-card__body) {
+  padding: 10px 5px;
+}
 </style>

src/views/resources/device-type/components/DeviceTypeToVer.vue

@@ -386,6 +386,9 @@ onMounted(() => {
 :deep(.my-label) {
   background: var(--el-color-white) !important;
 }
+:deep(.el-card__body) {
+  padding: 10px 5px;
+}
 </style>
 <style>
 .el-descriptions__content.el-descriptions__cell.is-bordered-content {

src/views/resources/device-type/components/DeviceTypeVersionEdit.vue

@@ -758,6 +758,9 @@ onMounted(() => {
 :deep(.el-scrollbar__thumb) {
   display: none;
 }
+:deep(.el-card__body) {
+  padding: 10px 5px;
+}
 </style>
 <style>
 .el-descriptions__content.el-descriptions__cell.is-bordered-content {

src/views/resources/file-list/index.vue

@@ -3,7 +3,11 @@
     <el-row>
       <!-- 文件树 -->
       <el-col :lg="6" :xs="24" class="mb-[12px]">
-        <folder-tree v-model="queryParams.fileType" @node-click="handleQuery" />
+        <folder-tree
+          style="margin-left: 5px"
+          v-model="queryParams.fileType"
+          @node-click="handleQuery"
+        />
       </el-col>
       <!-- 用户列表 -->
       <el-col :lg="18" :xs="24" class="ml--8">

src/views/resources/operate-type/components/AddOperateType.vue

@@ -245,6 +245,6 @@ const submit = async () => {
   background: var(--el-color-white) !important;
 }
 :deep(.el-card__body) {
-  padding: 10px 0 0 0;
+  padding: 10px 5px;
 }
 </style>

src/views/resources/service/components/BusinessForm.vue

@@ -405,7 +405,7 @@ onMounted(() => {
   background: var(--el-color-white) !important;
 }
 :deep(.el-card__body) {
-  padding: 10px 0 0 0;
+  padding: 10px 5px;
 }
 </style>
 

src/views/resources/tr069/components/Tr069Tree.vue

@@ -203,4 +203,7 @@ onMounted(() => {
   margin-top: 10px;
   border: 1px solid var(--el-border-color-dark);
 }
+:deep(.el-card__body) {
+  padding: 10px 5px;
+}
 </style>