实时视图-样式修改

src/components/ColumnSet/index.vue

@@ -1,11 +1,12 @@
 <template>
   <el-button
     v-bind="$attrs"
-    :icon="Tools"
     color="#ac014d"
     class="column-set-button"
     @click="dialogShow"
-  />
+  >
+    <i class="icon-setting" />
+  </el-button>
   <Dialog
     :flag="dialogFlag"
     width="1080px"
@@ -56,7 +57,6 @@
 </template>
 
 <script setup lang="ts">
-import { Tools } from '@element-plus/icons-vue'
 import Dialog from '@/components/dialog/index.vue'
 import { PropType } from 'vue'
 import { CommonTableColumn, tableColumnGroup } from '~/common'
@@ -201,6 +201,12 @@ watch(needShowColumns, defaultColumns => {
   height: 30px;
   border-radius: 4px;
   font-size: 14px;
+  .icon-setting {
+    width: 30px;
+    height: 30px;
+    background: url('@/assets/baggage/ic_setting_18.png') center center
+      no-repeat;
+  }
 }
 
 .dialog-content {

src/components/search/index.vue

@@ -2,7 +2,7 @@
   <div class="search">
     <div class="flex">
       <el-input class="search-input" @clear="clear" clearable v-model="input" size="default" :placeholder="placeholder" :prefix-icon="Search" />
-      <el-button class="search-button" size="default" @click="search" type="primary">搜索</el-button>
+      <el-button color="#ac014d" class="search-button" size="default" @click="search" >搜索</el-button>
     </div>
   </div>
 </template>

src/styles/index.scss

@@ -9,7 +9,7 @@
   font-weight: normal;
   font-style: normal;
 }
-*{
+* {
   font-family: DIN, Microsoft YaHei;
 }
 
@@ -183,3 +183,8 @@
 .r16 {
   margin-right: 16px;
 }
+.icon-export {
+  width: 30px;
+  height: 30px;
+  background: url('@/assets/baggage/ic_derive_18.png') center center no-repeat;
+}

src/views/realTime/components/CountBox/index.vue

@@ -107,11 +107,11 @@ watch(numberItems, items => {
       text-orientation: upright;
       overflow: hidden;
       & > .number-list {
-        font-family: DIN,Microsoft YaHei;
+        font-family: DIN, Microsoft YaHei;
         font-style: normal;
         position: absolute;
-        top: 8px;
-        left: 50%;
+        top: 7px;
+        left: 14px;
         transform: translate(-50%, 0%);
         transition: transform 1s ease-in-out;
         letter-spacing: 10px;

src/views/realTime/components/FlightView/index.vue

@@ -49,10 +49,11 @@
         /> -->
         <el-button
           class="button-sqaure"
-          :icon="Download"
           color="#ac014d"
-          @click="downloadHandler"
-        />
+          @click="exportHandler"
+        >
+          <i class="icon-export" />
+        </el-button>
         <ColumnSet
           class="button-sqaure"
           :table-columns="waybillTableColumns"
@@ -81,7 +82,7 @@
 </template>
 <script setup lang="ts">
 import Search from '@/components/search/index.vue'
-import { CaretRight, Download, Refresh } from '@element-plus/icons-vue'
+import { CaretRight } from '@element-plus/icons-vue'
 import ContainerWaybillDialog from './ContainerWaybillDialog.vue'
 import SimpleTable from '@/components/SimpleTable/index.vue'
 // import CommonSwitch from '../../components/CommonSwitch/index.vue'
@@ -209,7 +210,7 @@ const { columnChecked } = useTableColumnSet(waybillTableColumns)
 const waybillTableRef = ref<InstanceType<typeof SimpleTable> | null>(null)
 const { exportToExcel } = useTableExport()
 //点击下载按钮
-const downloadHandler = () => {
+const exportHandler = () => {
   const table = waybillTableRef.value!.table!
   exportToExcel({ table })
 }
@@ -264,6 +265,7 @@ const { cellClickHandler: flightWaybillCellClickHandler } = useTableCellClick(
       display: flex;
       flex-direction: column;
       .air-line {
+        height: 22px;
         font-size: 18px;
         font-weight: bold;
         color: #ffffff;

src/views/realTime/components/GoodsView/index.vue

@@ -17,10 +17,11 @@
         <Search @clear="clear" @search="search" />
         <el-button
           class="button-sqaure"
-          :icon="Download"
           color="#ac014d"
-          @click="downloadHandler"
-        />
+          @click="exportHandler"
+        >
+          <i class="icon-export" />
+        </el-button>
         <ColumnSet
           class="button-sqaure"
           :table-columns="tableColumns"
@@ -82,7 +83,6 @@
 </template>
 
 <script setup lang="ts">
-import { Download } from '@element-plus/icons-vue'
 import Search from '@/components/search/index.vue'
 import Steps from '@/components/steps/index.vue'
 import ColumnSet from '@/components/ColumnSet/index.vue'
@@ -163,7 +163,7 @@ const clear = () => {}
 
 const tableRef = ref<InstanceType<typeof SimpleTable> | null>(null)
 const { exportToExcel } = useTableExport()
-const downloadHandler = () => {
+const exportHandler = () => {
   const table = tableRef.value!.table!
   exportToExcel({ table })
 }

src/views/realTime/components/WaybillView/index.vue

@@ -28,10 +28,11 @@
         <Search @clear="clear" @search="search" />
         <el-button
           class="button-sqaure"
-          :icon="Download"
           color="#ac014d"
-          @click="downloadHandler"
-        />
+          @click="exportHandler"
+        >
+          <i class="icon-export" />
+        </el-button>
         <ColumnSet
           class="button-sqaure"
           :table-columns="tableColumns"
@@ -96,7 +97,6 @@
 </template>
 
 <script setup lang="ts">
-import { Download } from '@element-plus/icons-vue'
 import Search from '@/components/search/index.vue'
 import Steps from '@/components/steps/index.vue'
 import ColumnSet from '@/components/ColumnSet/index.vue'
@@ -262,7 +262,7 @@ const clear = () => {}
 
 const tableRef = ref<InstanceType<typeof SimpleTable> | null>(null)
 const { exportToExcel } = useTableExport()
-const downloadHandler = () => {
+const exportHandler = () => {
   const table = tableRef.value!.table!
   exportToExcel({ table })
 }
@@ -310,7 +310,7 @@ const { cellClickHandler } = useTableCellClick(`${props.name}Goods`)
       color: #519f6b;
     }
     .el-button {
-      background-color: #d5327b;
+      // background-color: #d5327b;
       border: none;
     }
     .button-sqaure {
@@ -320,7 +320,7 @@ const { cellClickHandler } = useTableCellClick(`${props.name}Goods`)
       font-size: 16px;
       margin-left: 24px;
       &:first-of-type {
-        margin-left: 35px;
+        margin-left: 19px;
       }
     }
   }