Jelajahi Sumber

fix:表格样式修改

chenxinlei 2 tahun lalu
induk
melakukan
e7c69677b0

+ 2 - 0
src/main.js

@@ -4,6 +4,8 @@ import store from './store'
 import router from './router'
 import './plugins'
 import '@/layouts/export'
+import './styles/element-style.scss'
+
 /**
  * @author https://gitee.com/chu1204505056/vue-admin-better (不想保留author可删除)
  * @description 生产环境默认都使用mock,如果正式用于生产环境时,记得去掉

+ 17 - 0
src/styles/element-style.scss

@@ -0,0 +1,17 @@
+// 修改表头样式-加边框
+// ::v-deep .el-table__header-wrapper {
+//   border: solid 1px #04c2ed !important;
+//   // box-sizing: border-box;
+// }
+
+.el-table th.el-table__cell > .cell {
+  font-weight: bold;
+}
+
+.table_header_style {
+  background-color: #f2f3f4 !important;
+}
+
+.el-table .cell.el-tooltip {
+  font-size: 12px !important;
+}

+ 3 - 2
src/views/index/index.vue

@@ -33,9 +33,10 @@
     </vab-query-form>
 
     <el-table ref="tableSort" v-loading="listLoading" :data="list" :element-loading-text="elementLoadingText"
-      :height="height" @selection-change="setSelectRows" @sort-change="tableSortChange" show-summary
+      :height="height" @selection-change="setSelectRows" @sort-change="tableSortChange" show-summary 
+      header-cell-class-name="table_header_style" border
       :summary-method="getSummaries">
-      <el-table-column show-overflow-tooltip type="selection" width="65"></el-table-column>
+      <el-table-column show-overflow-tooltip type="selection" width="55" align="center"></el-table-column>
       <el-table-column show-overflow-tooltip label="风场编号" prop="windpower" align="center" sortable>
       </el-table-column>
       <el-table-column show-overflow-tooltip label="工程编号" prop="projectid" align="center" sortable></el-table-column>

+ 4 - 2
src/views/indicators/index.vue

@@ -29,10 +29,11 @@
 			</div>
 		</div>
 		<el-table ref="tableSort" v-loading="listLoading" :data="list" :element-loading-text="elementLoadingText"
+      header-cell-class-name="table_header_style" border
 			:height="height" @selection-change="setSelectRows">
 			<!-- show-summary :summary-method="getSummaries" -->
-			<el-table-column width="65" show-overflow-tooltip type="selection"></el-table-column>
-			<el-table-column width="100" show-overflow-tooltip label="风场编号" prop="stationid" align="center" sortable>
+			<el-table-column width="55" align="center" show-overflow-tooltip type="selection"></el-table-column>
+			<el-table-column show-overflow-tooltip label="风场编号" prop="stationid" align="center" sortable>
 			</el-table-column>
 			<el-table-column show-overflow-tooltip label="风场名称" prop="stationname" align="center" sortable></el-table-column>
 			<el-table-column show-overflow-tooltip label="指标" prop="kay" align="center" sortable>
@@ -231,6 +232,7 @@ export default {
 	flex-direction: row;
 	align-items: center;
 	justify-content: space-between;
+  margin-bottom: 16px;
 }
 
 .left {

+ 3 - 2
src/views/stationConfiguration/area/index.vue

@@ -30,10 +30,11 @@
         </div>
       </div>
       <el-table ref="tableSort" v-loading="listLoading" :data="list" :element-loading-text="elementLoadingText"
+        header-cell-class-name="table_header_style" border
         :height="height" @selection-change="setSelectRows">
-        <el-table-column show-overflow-tooltip type="selection" width="55"></el-table-column>
+        <el-table-column show-overflow-tooltip type="selection" width="55" align="center"></el-table-column>
         <el-table-column width="100" show-overflow-tooltip label="编码" prop="id" align="center" sortable fixed="left"></el-table-column>
-        <el-table-column width="100" show-overflow-tooltip label="公司编号" prop="companyid" align="center" sortable fixed="left"></el-table-column>
+        <el-table-column width="150" show-overflow-tooltip label="公司编号" prop="companyid" align="center" sortable fixed="left"></el-table-column>
         <el-table-column width="100" show-overflow-tooltip label="名称" prop="name" align="center" sortable fixed="left"></el-table-column>
         <el-table-column width="150" show-overflow-tooltip label="别名" prop="aname" align="center" sortable></el-table-column>
         <el-table-column width="150" show-overflow-tooltip label="风电装机容量" prop="windcapacity" align="center" sortable></el-table-column>

+ 2 - 1
src/views/stationConfiguration/company/index.vue

@@ -32,8 +32,9 @@
       </vab-query-form-right-panel>
     </vab-query-form>
     <el-table ref="tableSort" v-loading="listLoading" :data="list" :element-loading-text="elementLoadingText"
+      header-cell-class-name="table_header_style" border
       :height="height" @selection-change="setSelectRows">
-      <el-table-column show-overflow-tooltip type="selection" width="55"></el-table-column>
+      <el-table-column show-overflow-tooltip type="selection" width="55" align="center"></el-table-column>
       <el-table-column show-overflow-tooltip label="编码" prop="id" align="center" sortable fixed="left"></el-table-column>
       <el-table-column width="120" show-overflow-tooltip label="公司名称" prop="name" align="center" sortable fixed="left"></el-table-column>
       <el-table-column width="120" show-overflow-tooltip label="别名" prop="aname" align="center" sortable></el-table-column>

+ 2 - 1
src/views/stationConfiguration/line/index.vue

@@ -25,8 +25,9 @@
       </div>
 
       <el-table ref="tableSort" v-loading="listLoading" :data="list" :element-loading-text="elementLoadingText"
+        header-cell-class-name="table_header_style" border
         :height="height" @selection-change="setSelectRows">
-        <el-table-column show-overflow-tooltip type="selection" width="55"></el-table-column>
+        <el-table-column show-overflow-tooltip type="selection" width="55" align="center"></el-table-column>
         <el-table-column show-overflow-tooltip label="编码" prop="id" align="center" sortable></el-table-column>
         <el-table-column show-overflow-tooltip label="编号" prop="code" align="center" sortable></el-table-column>
         <el-table-column show-overflow-tooltip label="线路名称" prop="name" align="center" sortable></el-table-column>

+ 2 - 1
src/views/stationConfiguration/period/index.vue

@@ -37,8 +37,9 @@
         </div>
       </div>
       <el-table ref="tableSort" v-loading="listLoading" :data="list" :element-loading-text="elementLoadingText"
+        header-cell-class-name="table_header_style" border
         :height="height" @selection-change="setSelectRows">
-        <el-table-column show-overflow-tooltip type="selection" width="40"></el-table-column>
+        <el-table-column show-overflow-tooltip type="selection" width="55" align="center"></el-table-column>
         <el-table-column show-overflow-tooltip label="编码" prop="id" align="center" sortable></el-table-column>
         <el-table-column show-overflow-tooltip label="编号" prop="code" align="center" sortable></el-table-column>
         <el-table-column width="120" show-overflow-tooltip label="工程名称" prop="name" align="center" sortable></el-table-column>

+ 11 - 10
src/views/stationConfiguration/station/index.vue

@@ -31,8 +31,9 @@
         </div>
       </div>
       <el-table ref="tableSort" v-loading="listLoading" :data="list" :element-loading-text="elementLoadingText"
+        header-cell-class-name="table_header_style" border
         :height="height" @selection-change="setSelectRows">
-        <el-table-column show-overflow-tooltip type="selection" width="55" fixed></el-table-column>
+        <el-table-column show-overflow-tooltip type="selection" width="55" align="center" fixed></el-table-column>
         <el-table-column show-overflow-tooltip label="编码" prop="id" align="center" sortable fixed width="100">
         </el-table-column>
         <el-table-column show-overflow-tooltip label="风场名称" prop="name" align="center" sortable fixed width="150">
@@ -41,26 +42,26 @@
         </el-table-column>
         <el-table-column show-overflow-tooltip label="区域编号" prop="regionid" align="center" sortable width="160">
         </el-table-column>
-        <el-table-column show-overflow-tooltip label="风场编码" prop="code" align="center" sortable width="100">
+        <el-table-column show-overflow-tooltip label="风场编码" prop="code" align="center" sortable width="150">
         </el-table-column>
         <el-table-column show-overflow-tooltip label="地址" prop="address" align="center" sortable width="180">
         </el-table-column>
         <el-table-column show-overflow-tooltip label="电话" prop="telephone" align="center" sortable width="120">
         </el-table-column>
-        <el-table-column show-overflow-tooltip label="装机容量" prop="capacity" align="center" sortable width="100">
+        <el-table-column show-overflow-tooltip label="装机容量" prop="capacity" align="center" sortable width="150">
         </el-table-column>
-        <el-table-column show-overflow-tooltip label="容量单位" prop="capacityunit" align="center" sortable width="100">
+        <el-table-column show-overflow-tooltip label="容量单位" prop="capacityunit" align="center" sortable width="150">
         </el-table-column>
-        <el-table-column show-overflow-tooltip label="装机数量" prop="quantity" align="center" sortable width="100">
+        <el-table-column show-overflow-tooltip label="装机数量" prop="quantity" align="center" sortable width="150">
         </el-table-column>
-        <el-table-column show-overflow-tooltip label="地球经度" prop="longitude" align="center" sortable width="100">
+        <el-table-column show-overflow-tooltip label="地球经度" prop="longitude" align="center" sortable width="150">
         </el-table-column>
-        <el-table-column show-overflow-tooltip label="地球纬度" prop="latitude" align="center" sortable width="100">
+        <el-table-column show-overflow-tooltip label="地球纬度" prop="latitude" align="center" sortable width="150">
         </el-table-column>
         <el-table-column show-overflow-tooltip label="图片" prop="photo" align="center" sortable></el-table-column>
-        <el-table-column show-overflow-tooltip label="公司编号" prop="companyid" align="center" sortable width="100">
+        <el-table-column show-overflow-tooltip label="公司编号" prop="companyid" align="center" sortable width="150">
         </el-table-column>
-        <el-table-column show-overflow-tooltip label="系统厂家" prop="systemmanufact" align="center" sortable width="100">
+        <el-table-column show-overflow-tooltip label="系统厂家" prop="systemmanufact" align="center" sortable width="150">
         </el-table-column>
         <el-table-column show-overflow-tooltip label="场长" prop="headfarm" align="center" sortable></el-table-column>
         <el-table-column show-overflow-tooltip label="场长电话" prop="headfarmphone" align="center" sortable width="120">
@@ -68,7 +69,7 @@
         <el-table-column show-overflow-tooltip label="机型" prop="model" align="center" sortable width="120">
         </el-table-column>
         <el-table-column show-overflow-tooltip label="顺序" prop="ordernum" align="center" sortable></el-table-column>
-        <el-table-column show-overflow-tooltip label="海拔高度" prop="height" align="center" sortable width="100">
+        <el-table-column show-overflow-tooltip label="海拔高度" prop="height" align="center" sortable width="150">
         </el-table-column>
         <el-table-column fixed="right" label="操作" width="100">
           <template #default="{ row }">

+ 2 - 1
src/views/stationConfiguration/windterbin/index.vue

@@ -24,8 +24,9 @@
         </div>
       </div>
       <el-table ref="tableSort" v-loading="listLoading" :data="list" :element-loading-text="elementLoadingText"
+        header-cell-class-name="table_header_style" border
         :height="height" @selection-change="setSelectRows">
-        <el-table-column show-overflow-tooltip type="selection"></el-table-column>
+        <el-table-column show-overflow-tooltip type="selection" width="55" align="center"></el-table-column>
         <el-table-column show-overflow-tooltip label="编码" prop="id" align="center" sortable></el-table-column>
         <el-table-column show-overflow-tooltip label="编号" prop="status" align="center" sortable></el-table-column>
         <el-table-column show-overflow-tooltip label="风机名称" prop="name" align="center" sortable></el-table-column>