feat: 增加prettier样式格式&统一风格

.prettierignore

@@ -0,0 +1,2 @@
+package.json
+package-lock.json

.prettierrc

@@ -0,0 +1,9 @@
+{
+  "printWidth": 140,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "trailingComma": "es5",
+  "bracketSpacing": true,
+  "semi": true,
+  "arrowParens": "avoid"
+}

.vscode/settings.json

@@ -0,0 +1,21 @@
+{
+  "editor.tabSize": 2,
+  "editor.formatOnSave": true, // 保存时自动格式化
+  "editor.defaultFormatter": "esbenp.prettier-vscode", // 设置默认格式化工具为 prettier
+  // 针对特定的语言进行单独配置
+  "[javascript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode" // 设置 javascript 的默认格式化工具
+  },
+  "[vue]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode" // 使用 vetur 格式化 vue 文件
+  },
+  // Vetur 配置
+  "vetur.format.defaultFormatter.html": "js-beautify-html", // 格式化 Vue 中的 template
+  "vetur.format.options.tabSize": 2,
+  "vetur.format.defaultFormatterOptions": {
+    "js-beautify-html": {
+      "wrap_attributes": "auto", // auto、force-aligned、aligned-multiple、force-expand-multiline
+      "wrap_line_length": 100 // 长度超过多少开始折行
+    }
+  }
+}

src/views/modules/load-data/components/add-or-update.vue

@@ -1,81 +1,20 @@
 <template>
-  <!-- 添加或修改参数配置对话框 -->
-  <el-dialog
-    title="明细"
-    :visible.sync="open"
-    append-to-body
-    width="700px"
-    destroy-on-close
-  >
-    <el-descriptions labelStyle="width: 160px;" title="" column="2" border>
-      <el-descriptions-item label="变电站名称">{{
-        ruleForm.subNm
-      }}</el-descriptions-item>
-      <el-descriptions-item label="归属县旗">{{
-        ruleForm.compNm
-      }}</el-descriptions-item>
-      <el-descriptions-item label="电压等级">{{
-        ruleForm.voltageLevel
-      }}</el-descriptions-item>
-      <el-descriptions-item label="主变台数">{{
-        ruleForm.mainNum
-      }}</el-descriptions-item>
-      <el-descriptions-item label="主变容量(MVA)">{{
-        ruleForm.mainCapacity
-      }}</el-descriptions-item>
-      <el-descriptions-item label="采集日期">{{
-        ruleForm.dataDate
-      }}</el-descriptions-item>
-      <el-descriptions-item label="当日温度(℃)">{{
-        ruleForm.temperature
-      }}</el-descriptions-item>
-      <el-descriptions-item label="最大负荷(MW)">{{
-        ruleForm.peakLoad
-      }}</el-descriptions-item>
-      <el-descriptions-item label="基础负荷(MW)">{{
-        ruleForm.baseLoad
-      }}</el-descriptions-item>
-      <el-descriptions-item label="电采暖负荷(MW)">{{
-        ruleForm.electricHeatingLoad
-      }}</el-descriptions-item>
-      <el-descriptions-item label="用户数">{{
-        ruleForm.usersNum
-      }}</el-descriptions-item>
-      <el-descriptions-item label="平房区用户数">{{
-        ruleForm.pingfangUsers
-      }}</el-descriptions-item>
-       <el-descriptions-item span="2" label="平房区已接入电采暖容量(MWA)">{{
-        ruleForm.pingfangElectricHeatingCapacity
-      }}</el-descriptions-item>
-    </el-descriptions>
-    <el-form ref="ruleForm" :model="ruleForm" label-width="120px" v-if="false">
+  <div class="addEdit-block">
+    <el-form class="add-update-preview" ref="ruleForm" :model="ruleForm" label-width="180px">
       <el-row>
         <el-col :span="12">
           <el-form-item label="变电站名称" prop="subNm">
-            <el-input
-              v-model="ruleForm.subNm"
-              placeholder="请输入变电站名称"
-              :disabled="type == 'view'"
-            ></el-input>
+            <el-input v-model="ruleForm.subNm" placeholder="请输入变电站名称" :readonly="type == 'view'"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="归属县旗" prop="compNm">
-            <el-input
-              v-model="ruleForm.compNm"
-              placeholder="请输入归属县旗名称"
-              :disabled="type == 'view'"
-            ></el-input>
+            <el-input v-model="ruleForm.compNm" placeholder="请输入归属县旗名称" :readonly="type == 'view'"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="电压等级" prop="voltageLevel">
-            <el-input
-              type="number"
-              v-model="ruleForm.voltageLevel"
-              placeholder="请输入电压等级"
-              :disabled="type == 'view'"
-            />
+            <el-input type="number" v-model="ruleForm.voltageLevel" placeholder="请输入电压等级" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
@@ -85,7 +24,7 @@
               style="width: 100%"
               v-model="ruleForm.mainNum"
               placeholder="请输入主变台数"
-              :disabled="type == 'view'"
+              :readonly="type == 'view'"
             />
           </el-form-item>
         </el-col>
@@ -96,114 +35,97 @@
               style="width: 100%"
               v-model="ruleForm.mainCapacity"
               placeholder="请输入主变容量"
-              :disabled="type == 'view'"
+              :readonly="type == 'view'"
             />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="采集日期" prop="dataDate">
-            <el-input v-model="ruleForm.dataDate" :disabled="type == 'view'" />
+            <el-input v-model="ruleForm.dataDate" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="当日温度(℃)" prop="temperature">
-            <el-input
-              v-model="ruleForm.temperature"
-              :disabled="type == 'view'"
-            />
+            <el-input v-model="ruleForm.temperature" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="最大负荷(MW)" prop="peakLoad">
-            <el-input v-model="ruleForm.peakLoad" :disabled="type == 'view'" />
+            <el-input v-model="ruleForm.peakLoad" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="基础负荷(MW)" prop="baseLoad">
-            <el-input v-model="ruleForm.baseLoad" :disabled="type == 'view'" />
+            <el-input v-model="ruleForm.baseLoad" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="电采暖负荷(MW)" prop="electricHeatingLoad">
-            <el-input
-              v-model="ruleForm.electricHeatingLoad"
-              :disabled="type == 'view'"
-            />
+            <el-input v-model="ruleForm.electricHeatingLoad" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="电采暖负荷(MW)" prop="electricHeatingLoad">
-            <el-input
-              v-model="ruleForm.electricHeatingLoad"
-              :disabled="type == 'view'"
-            />
+            <el-input v-model="ruleForm.electricHeatingLoad" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用户数" prop="usersNum">
-            <el-input v-model="ruleForm.usersNum" :disabled="type == 'view'" />
+            <el-input v-model="ruleForm.usersNum" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="平房区用户数" prop="pingfangUsers">
-            <el-input
-              v-model="ruleForm.pingfangUsers"
-              :disabled="type == 'view'"
-            />
+            <el-input v-model="ruleForm.pingfangUsers" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item
-            label="平房区接入电暖用户数"
-            prop="electricHeatingUsers"
-          >
-            <el-input
-              v-model="ruleForm.electricHeatingUsers"
-              :disabled="type == 'view'"
-            />
+          <el-form-item label="平房区接入电暖用户数" prop="electricHeatingUsers">
+            <el-input v-model="ruleForm.electricHeatingUsers" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item
-            label="平房区已接入电采暖容量(MWA)"
-            prop="pingfangElectricHeatingCapacity"
-          >
-            <el-input
-              v-model="ruleForm.pingfangElectricHeatingCapacity"
-              :disabled="type == 'view'"
-            />
+          <el-form-item label="平房区已接入电采暖容量(MWA)" prop="pingfangElectricHeatingCapacity">
+            <el-input v-model="ruleForm.pingfangElectricHeatingCapacity" :readonly="type == 'view'" />
           </el-form-item>
         </el-col>
       </el-row>
+      <el-form-item class="btn">
+        <el-button class="btn3" v-if="type != 'view'" type="success" @click="onSubmit">
+          <span class="icon iconfont icon-xihuan"></span>
+          提交
+        </el-button>
+        <el-button class="btn4" v-if="type != 'view'" type="success" @click="back()">
+          <span class="icon iconfont icon-xihuan"></span>
+          取消
+        </el-button>
+        <el-button class="btn5" v-if="type == 'view'" type="success" @click="back()">
+          <span class="icon iconfont icon-xihuan"></span>
+          返回
+        </el-button>
+      </el-form-item>
     </el-form>
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button @click="cancel">关 闭</el-button>
-      </div>
-    </template>
-  </el-dialog>
+  </div>
 </template>
 <script>
 export default {
   data() {
     return {
-      type: "view", // add, edit, view
-      open: false,
+      type: 'view', // add, edit, view
       ruleForm: {},
     };
   },
-  props: ["parent"],
+  props: ['parent'],
   methods: {
     openDialog(id, type) {
       this.type = type;
-      this.open = true;
       this.resetForm();
       if (id) this.info(id);
     },
     info(id) {
       this.$http({
         url: `subLoad/detail/${id}`,
-        method: "get",
+        method: 'get',
       }).then(({ data }) => {
         if (data && data.code === 0) {
           this.ruleForm = data.data;
@@ -216,8 +138,8 @@ export default {
       this.ruleForm = {};
     },
     // 返回
-    cancel() {
-      this.open = false;
+    back() {
+      this.parent.addOrUpdateOrDetailFlag = false;
       this.resetForm();
     },
   },
@@ -294,7 +216,7 @@ export default {
   min-width: 50%;
   height: 40px;
 }
-.add-update-preview .el-input ::v-deep .el-input__inner[readonly="readonly"] {
+.add-update-preview .el-input ::v-deep .el-input__inner[readonly='readonly'] {
   border: 0px solid #ccc;
   cursor: not-allowed;
   border-radius: 0px;
@@ -376,10 +298,7 @@ export default {
   font-size: 15px;
   height: 40px;
 }
-.add-update-preview
-  .el-date-editor
-  ::v-deep
-  .el-input__inner[readonly="readonly"] {
+.add-update-preview .el-date-editor ::v-deep .el-input__inner[readonly='readonly'] {
   border: 0;
   cursor: not-allowed;
   border-radius: 0px;
@@ -522,10 +441,7 @@ export default {
   min-height: 150px;
   height: auto;
 }
-.add-update-preview
-  .el-textarea
-  ::v-deep
-  .el-textarea__inner[readonly="readonly"] {
+.add-update-preview .el-textarea ::v-deep .el-textarea__inner[readonly='readonly'] {
   border: 0;
   cursor: not-allowed;
   border-radius: 0px;

src/views/modules/load-data/components/stationLoadList.vue

@@ -45,12 +45,7 @@
             class="item-label"
             >变电站名称</label
           >
-          <el-input
-            v-model="searchForm.subName"
-            placeholder="变电站名称"
-            @keydown.enter.native="search()"
-            clearable
-          ></el-input>
+          <el-input v-model="searchForm.subName" placeholder="变电站名称" @keydown.enter.native="search()" clearable></el-input>
         </div>
         <div
           :style="{
@@ -73,19 +68,8 @@
             class="item-label"
             >归属县旗</label
           >
-          <el-select
-            style="width: 100%"
-            v-model="searchForm.compNm"
-            placeholder="归属县旗名称"
-            @keydown.enter.native="search()"
-            clearable
-          >
-            <el-option
-              v-for="item in compList"
-              :key="item.value"
-              :label="item.label"
-              :value="item.label"
-            />
+          <el-select style="width: 100%" v-model="searchForm.compNm" placeholder="归属县旗名称" @keydown.enter.native="search()" clearable>
+            <el-option v-for="item in compList" :key="item.value" :label="item.label" :value="item.label" />
           </el-select>
         </div>
 
@@ -114,12 +98,7 @@
           display: 'flex',
         }"
       >
-        <el-button
-          class="del"
-          :disabled="dataListSelections.length ? false : true"
-          type="danger"
-          @click="deleteHandler()"
-        >
+        <el-button class="del" :disabled="dataListSelections.length ? false : true" type="danger" @click="deleteHandler()">
           <span
             class="icon iconfont icon-xihuan"
             :style="{
@@ -175,135 +154,50 @@
         v-loading="dataListLoading"
         @selection-change="selectionChangeHandler"
       >
-        <el-table-column
-          :resizable="true"
-          type="selection"
-          align="center"
-          width="50"
-        ></el-table-column>
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          label="序号"
-          type="index"
-          width="50"
-        />
-
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="subNm"
-          label="变电站名称"
-        >
+        <el-table-column :resizable="true" type="selection" align="center" width="50"></el-table-column>
+        <el-table-column :resizable="true" :sortable="true" label="序号" type="index" width="50" />
+
+        <el-table-column :resizable="true" :sortable="true" prop="subNm" label="变电站名称">
           <template slot-scope="scope">
             {{ scope.row.subNm }}
           </template>
         </el-table-column>
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="compNm"
-          label="归属旗县"
-        >
+        <el-table-column :resizable="true" :sortable="true" prop="compNm" label="归属旗县">
           <template slot-scope="scope">
             {{ scope.row.compNm }}
           </template>
         </el-table-column>
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="voltageLevel"
-          label="电压等级"
-        >
+        <el-table-column :resizable="true" :sortable="true" prop="voltageLevel" label="电压等级">
           <template slot-scope="scope">
             {{ scope.row.voltageLevel }}
           </template>
         </el-table-column>
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="mainNum"
-          label="主变台数"
-        >
+        <el-table-column :resizable="true" :sortable="true" prop="mainNum" label="主变台数">
           <template slot-scope="scope">
             {{ scope.row.mainNum }}
           </template>
         </el-table-column>
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="mainCapacity"
-          label="主变容量(MVA)"
-        >
+        <el-table-column :resizable="true" :sortable="true" prop="mainCapacity" label="主变容量(MVA)">
           <template slot-scope="scope">
             {{ scope.row.mainCapacity }}
           </template>
         </el-table-column>
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="dataDate"
-          label="采集日期"
-        />
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="temperature"
-          label="当日温度(℃)"
-        >
+        <el-table-column :resizable="true" :sortable="true" prop="dataDate" label="采集日期" />
+        <el-table-column :resizable="true" :sortable="true" prop="temperature" label="当日温度(℃)">
           <template slot-scope="scope">
             {{ scope.row.temperature }}
           </template>
         </el-table-column>
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="peakLoad"
-          label="最大负荷(MW)"
-        />
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="baseLoad"
-          label="基础负荷(MW)"
-        />
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="electricHeatingLoad"
-          label="电采暖负荷(MW)"
-        />
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="usersNum"
-          label="用户数"
-        />
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="pingfangUsers"
-          label="平房区用户数"
-        />
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="electricHeatingUsers"
-          label="平房区接入电暖用户数"
-        />
-        <el-table-column
-          :resizable="true"
-          :sortable="true"
-          prop="pingfangElectricHeatingCapacity"
-          label="平房区已接入电采暖容量(MWA)"
-        />
+        <el-table-column :resizable="true" :sortable="true" prop="peakLoad" label="最大负荷(MW)" />
+        <el-table-column :resizable="true" :sortable="true" prop="baseLoad" label="基础负荷(MW)" />
+        <el-table-column :resizable="true" :sortable="true" prop="electricHeatingLoad" label="电采暖负荷(MW)" />
+        <el-table-column :resizable="true" :sortable="true" prop="usersNum" label="用户数" />
+        <el-table-column :resizable="true" :sortable="true" prop="pingfangUsers" label="平房区用户数" />
+        <el-table-column :resizable="true" :sortable="true" prop="electricHeatingUsers" label="平房区接入电暖用户数" />
+        <el-table-column :resizable="true" :sortable="true" prop="pingfangElectricHeatingCapacity" label="平房区已接入电采暖容量(MWA)" />
         <el-table-column width="120" label="操作">
           <template slot-scope="scope">
-            <el-button
-              class="view"
-              type="success"
-              @click="addOrUpdateHandler(scope.row.id, 'view')"
-            >
+            <el-button class="view" type="success" @click="addOrUpdateHandler(scope.row.id, 'view')">
               <span
                 class="icon iconfont icon-xihuan"
                 :style="{
@@ -316,11 +210,7 @@
               ></span>
               明细
             </el-button>
-            <el-button
-              class="del"
-              type="primary"
-              @click="deleteHandler(scope.row.id)"
-            >
+            <el-button class="del" type="primary" @click="deleteHandler(scope.row.id)">
               <span
                 class="icon iconfont icon-xihuan"
                 :style="{
@@ -371,8 +261,8 @@
 </template>
 
 <script>
-import AddOrUpdate from "./add-or-update.vue";
-import uploadModal from "./uploadModal.vue";
+import AddOrUpdate from './add-or-update.vue';
+import uploadModal from './uploadModal.vue';
 export default {
   components: {
     AddOrUpdate,
@@ -381,8 +271,8 @@ export default {
   data() {
     return {
       searchForm: {
-        subNm: "",
-        compNm: "",
+        subNm: '',
+        compNm: '',
       },
       dataList: [],
       pageIndex: 1,
@@ -390,7 +280,7 @@ export default {
       totalPage: 0,
       dataListLoading: false,
       dataListSelections: [],
-      layouts: ["prev", "pager", "next", "sizes"],
+      layouts: ['prev', 'pager', 'next', 'sizes'],
       compList: [],
     };
   },
@@ -398,17 +288,16 @@ export default {
     this.getCompList();
     this.getDataList();
   },
-  mounted() {},
   methods: {
     // 获取公司列表
     async getCompList() {
       this.compList = [];
       const { data } = await this.$http({
         url: `/company/lists`,
-        method: "get",
+        method: 'get',
       });
       if (data && data.code === 0) {
-        this.compList = data.data.map((item) => ({
+        this.compList = data.data.map(item => ({
           label: item.compName,
           value: String(item.id),
         }));
@@ -427,18 +316,18 @@ export default {
       let params = {
         page: this.pageIndex,
         limit: this.pageSize,
-        sort: "id",
-        order: "desc",
+        sort: 'id',
+        order: 'desc',
       };
-      if (this.searchForm.subNm != "" && this.searchForm.subNm != undefined) {
-        params["subNm"] = "%" + this.searchForm.subNm + "%";
+      if (this.searchForm.subNm != '' && this.searchForm.subNm != undefined) {
+        params['subNm'] = '%' + this.searchForm.subNm + '%';
       }
-      if (this.searchForm.compNm != "" && this.searchForm.compNm != undefined) {
-        params["compNm"] = "%" + this.searchForm.compNm + "%";
+      if (this.searchForm.compNm != '' && this.searchForm.compNm != undefined) {
+        params['compNm'] = '%' + this.searchForm.compNm + '%';
       }
       this.$http({
-        url: "/subLoad/page",
-        method: "get",
+        url: '/subLoad/page',
+        method: 'get',
         params: params,
       }).then(({ data }) => {
         if (data && data.code === 0) {
@@ -474,27 +363,23 @@ export default {
     async deleteHandler(id) {
       var ids = id
         ? [Number(id)]
-        : this.dataListSelections.map((item) => {
+        : this.dataListSelections.map(item => {
             return Number(item.id);
           });
-      await this.$confirm(
-        `确定进行[${id ? "删除" : "批量删除"}]操作?`,
-        "提示",
-        {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning",
-        }
-      ).then(async () => {
+      await this.$confirm(`确定进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }).then(async () => {
         await this.$http({
-          url: "subLoad/delete",
-          method: "post",
+          url: 'subLoad/delete',
+          method: 'post',
           data: ids,
         }).then(async ({ data }) => {
           if (data && data.code === 0) {
             this.$message({
-              message: "操作成功",
-              type: "success",
+              message: '操作成功',
+              type: 'success',
             });
             this.search();
           } else {
@@ -947,12 +832,7 @@ export default {
   position: relative;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__sizes
-  .el-input
-  .el-input__inner {
+.main-content .el-pagination ::v-deep .el-pagination__sizes .el-input .el-input__inner {
   border: 1px solid #dcdfe6;
   cursor: pointer;
   padding: 0 25px 0 8px;
@@ -968,25 +848,14 @@ export default {
   height: 28px;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__sizes
-  .el-input
-  span.el-input__suffix {
+.main-content .el-pagination ::v-deep .el-pagination__sizes .el-input span.el-input__suffix {
   top: 0;
   position: absolute;
   right: 0;
   height: 100%;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__sizes
-  .el-input
-  .el-input__suffix
-  .el-select__caret {
+.main-content .el-pagination ::v-deep .el-pagination__sizes .el-input .el-input__suffix .el-select__caret {
   cursor: pointer;
   color: #c0c4cc;
   width: 25px;
@@ -1018,12 +887,7 @@ export default {
   height: 28px;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__jump
-  .el-input
-  .el-input__inner {
+.main-content .el-pagination ::v-deep .el-pagination__jump .el-input .el-input__inner {
   border: 1px solid #dcdfe6;
   cursor: pointer;
   padding: 0 3px;

src/views/modules/load-data/index.vue

@@ -1,36 +1,403 @@
 <template>
-  <div
-    class="main-content"
-    :style="{ width: '100%', padding: '20px 30px', fontSize: '15px' }"
-  >
-    <el-tabs v-model="activeName" @tab-click="handleClick">
-      <el-tab-pane label="变电站负荷数据" name="stationLoad"
-        >
-        <stationLoadList/>
-        </el-tab-pane
+  <div class="main-content" :style="{ width: '100%', padding: '20px 30px', fontSize: '15px' }">
+    <!-- 列表页 -->
+    <template v-if="!addOrUpdateOrDetailFlag">
+      <el-form
+        class="center-form-pv"
+        :style="{
+          border: '0px solid #fff',
+          padding: '10px',
+          margin: '0',
+          flexWrap: 'wrap',
+          background: '#ffffff',
+          display: 'flex',
+          width: '100%',
+        }"
+        :inline="true"
+        :model="searchForm"
       >
-      <el-tab-pane label="线路负荷数据" name="lineLoad"
-        >线路负荷数据</el-tab-pane
+        <el-row
+          :style="{
+            padding: '10px',
+            alignItems: 'center',
+            flexWrap: 'wrap',
+            background: 'none',
+            display: 'flex',
+          }"
+        >
+          <div
+            :style="{
+              alignItems: 'center',
+              margin: '0 10px 0 0',
+              display: 'flex',
+            }"
+          >
+            <label
+              :style="{
+                margin: '0 10px 0 0',
+                whiteSpace: 'nowrap',
+                color: '#666',
+                display: 'inline-block',
+                lineHeight: '40px',
+                fontSize: 'inherit',
+                fontWeight: '500',
+                height: '40px',
+              }"
+              class="item-label"
+              >变电站名称</label
+            >
+            <el-input v-model="searchForm.subName" placeholder="变电站名称" @keydown.enter.native="search()" clearable></el-input>
+          </div>
+          <div
+            :style="{
+              alignItems: 'center',
+              margin: '0 10px 0 0',
+              display: 'flex',
+            }"
+          >
+            <label
+              :style="{
+                margin: '0 10px 0 0',
+                whiteSpace: 'nowrap',
+                color: '#666',
+                display: 'inline-block',
+                lineHeight: '40px',
+                fontSize: 'inherit',
+                fontWeight: '500',
+                height: '40px',
+              }"
+              class="item-label"
+              >归属县旗</label
+            >
+            <el-select
+              style="width: 100%"
+              v-model="searchForm.compNm"
+              placeholder="归属县旗名称"
+              @keydown.enter.native="search()"
+              clearable
+            >
+              <el-option v-for="item in compList" :key="item.value" :label="item.label" :value="item.label" />
+            </el-select>
+          </div>
+
+          <el-button class="search" type="success" @click="search()">
+            <span
+              class="icon iconfont icon-fangdajing07"
+              :style="{
+                margin: '0 2px',
+                fontSize: '16px',
+                color: '#fff',
+                display: 'none',
+                height: '40px',
+              }"
+            ></span>
+            搜索
+          </el-button>
+        </el-row>
+
+        <el-row
+          class="actions"
+          :style="{
+            padding: '10px',
+            margin: '0px 0',
+            flexWrap: 'wrap',
+            background: 'none',
+            display: 'flex',
+          }"
+        >
+          <el-button class="del" :disabled="dataListSelections.length ? false : true" type="danger" @click="deleteHandler()">
+            <span
+              class="icon iconfont icon-xihuan"
+              :style="{
+                margin: '0 2px',
+                fontSize: '14px',
+                color: '#fff',
+                display: 'none',
+                height: '34px',
+              }"
+            ></span>
+            批量删除
+          </el-button>
+          <el-button class="add" type="danger" @click="importHandler()">
+            <span
+              class="icon iconfont icon-xihuan"
+              :style="{
+                margin: '0 2px',
+                fontSize: '14px',
+                color: '#fff',
+                display: 'none',
+                height: '34px',
+              }"
+            ></span>
+            导入
+          </el-button>
+        </el-row>
+      </el-form>
+      <div
+        :style="{
+          border: '0px solid #fff',
+          width: '100%',
+          padding: '0 20px 20px',
+          fontSize: '14px',
+          color: '#000',
+          background: '#fff',
+        }"
       >
-    </el-tabs>
+        <el-table
+          class="tables"
+          :stripe="false"
+          :style="{
+            padding: '0px 0',
+            borderColor: '#f0f0f0',
+            borderRadius: '0',
+            borderWidth: '0px 0 0 1px',
+            background: '#fff',
+            width: '100%',
+            fontSize: 'inherit',
+            borderStyle: 'solid',
+          }"
+          :border="true"
+          :data="dataList"
+          v-loading="dataListLoading"
+          @selection-change="selectionChangeHandler"
+        >
+          <el-table-column :resizable="true" type="selection" align="center" width="50"></el-table-column>
+          <el-table-column :resizable="true" :sortable="true" label="序号" type="index" width="50" />
+
+          <el-table-column :resizable="true" :sortable="true" prop="subNm" label="变电站名称">
+            <template slot-scope="scope">
+              {{ scope.row.subNm }}
+            </template>
+          </el-table-column>
+          <el-table-column :resizable="true" :sortable="true" prop="compNm" label="归属旗县">
+            <template slot-scope="scope">
+              {{ scope.row.compNm }}
+            </template>
+          </el-table-column>
+          <el-table-column :resizable="true" :sortable="true" prop="voltageLevel" label="电压等级">
+            <template slot-scope="scope">
+              {{ scope.row.voltageLevel }}
+            </template>
+          </el-table-column>
+          <el-table-column :resizable="true" :sortable="true" prop="mainNum" label="主变台数">
+            <template slot-scope="scope">
+              {{ scope.row.mainNum }}
+            </template>
+          </el-table-column>
+          <el-table-column :resizable="true" :sortable="true" prop="mainCapacity" label="主变容量(MVA)">
+            <template slot-scope="scope">
+              {{ scope.row.mainCapacity }}
+            </template>
+          </el-table-column>
+          <el-table-column :resizable="true" :sortable="true" prop="dataDate" label="采集日期" />
+          <el-table-column :resizable="true" :sortable="true" prop="temperature" label="当日温度(℃)">
+            <template slot-scope="scope">
+              {{ scope.row.temperature }}
+            </template>
+          </el-table-column>
+          <el-table-column :resizable="true" :sortable="true" prop="peakLoad" label="最大负荷(MW)" />
+          <el-table-column :resizable="true" :sortable="true" prop="baseLoad" label="基础负荷(MW)" />
+          <el-table-column :resizable="true" :sortable="true" prop="electricHeatingLoad" label="电采暖负荷(MW)" />
+          <el-table-column :resizable="true" :sortable="true" prop="usersNum" label="用户数" />
+          <el-table-column :resizable="true" :sortable="true" prop="pingfangUsers" label="平房区用户数" />
+          <el-table-column :resizable="true" :sortable="true" prop="electricHeatingUsers" label="平房区接入电暖用户数" />
+          <el-table-column :resizable="true" :sortable="true" prop="pingfangElectricHeatingCapacity" label="平房区已接入电采暖容量(MWA)" />
+          <el-table-column width="120" label="操作">
+            <template slot-scope="scope">
+              <el-button class="view" type="success" @click="addOrUpdateHandler(scope.row.id, 'view')">
+                <span
+                  class="icon iconfont icon-xihuan"
+                  :style="{
+                    margin: '0 2px',
+                    fontSize: '14px',
+                    color: '#fff',
+                    display: 'none',
+                    height: '40px',
+                  }"
+                ></span>
+                明细
+              </el-button>
+              <el-button class="del" type="primary" @click="deleteHandler(scope.row.id)">
+                <span
+                  class="icon iconfont icon-xihuan"
+                  :style="{
+                    margin: '0 2px',
+                    fontSize: '14px',
+                    color: '#fff',
+                    display: 'none',
+                    height: '40px',
+                  }"
+                ></span>
+                删除
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <el-pagination
+        @size-change="sizeChangeHandle"
+        @current-change="currentChangeHandle"
+        :current-page="pageIndex"
+        background
+        :page-sizes="[10, 50, 100, 200]"
+        :page-size="pageSize"
+        :layout="layouts.join()"
+        :total="totalPage"
+        prev-text="< "
+        next-text="> "
+        :hide-on-single-page="false"
+        :style="{
+          padding: '0 20px 20px',
+          margin: '0px auto',
+          whiteSpace: 'nowrap',
+          color: '#333',
+          textAlign: 'left',
+          background: '#fff',
+          width: '100%',
+          fontSize: 'inherit',
+          position: 'relative',
+          fontWeight: '500',
+        }"
+      ></el-pagination>
+    </template>
+    <!-- 添加/修改页面  将父组件的search方法传递给子组件-->
+    <add-or-update v-if="addOrUpdateOrDetailFlag" :parent="this" ref="addOrUpdate"></add-or-update>
+    <!-- 上传文件弹窗 -->
+    <upload-modal :parent="this" ref="uploadModal"></upload-modal>
   </div>
 </template>
+
 <script>
-import stationLoadList from "@/views/modules/load-data/components/stationLoadList.vue";
+import AddOrUpdate from './components/add-or-update.vue';
+import uploadModal from './components/uploadModal.vue';
 export default {
+  components: {
+    AddOrUpdate,
+    uploadModal,
+  },
   data() {
     return {
-      activeName: "stationLoad",
+      searchForm: {
+        subNm: '',
+        compNm: '',
+      },
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      dataListSelections: [],
+      layouts: ['prev', 'pager', 'next', 'sizes'],
+      compList: [],
+      addOrUpdateOrDetailFlag: false,
     };
   },
-  created() {},
-  mounted() {},
-  components: {
-    stationLoadList,
+  created() {
+    this.getCompList();
+    this.getDataList();
   },
   methods: {
-    handleClick(tab) {
-      console.log(tab);
+    // 获取公司列表
+    async getCompList() {
+      this.compList = [];
+      const { data } = await this.$http({
+        url: `/company/lists`,
+        method: 'get',
+      });
+      if (data && data.code === 0) {
+        this.compList = data.data.map(item => ({
+          label: item.compName,
+          value: String(item.id),
+        }));
+      }
+    },
+    importHandler() {
+      this.$refs.uploadModal.openDialog();
+    },
+    search() {
+      this.pageIndex = 1;
+      this.getDataList();
+    },
+    // 获取数据列表
+    getDataList() {
+      this.dataListLoading = true;
+      let params = {
+        page: this.pageIndex,
+        limit: this.pageSize,
+        sort: 'id',
+        order: 'desc',
+      };
+      if (this.searchForm.subNm != '' && this.searchForm.subNm != undefined) {
+        params['subNm'] = '%' + this.searchForm.subNm + '%';
+      }
+      if (this.searchForm.compNm != '' && this.searchForm.compNm != undefined) {
+        params['compNm'] = '%' + this.searchForm.compNm + '%';
+      }
+      this.$http({
+        url: '/subLoad/page',
+        method: 'get',
+        params: params,
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.dataList = data.data.list;
+          this.totalPage = data.data.total;
+        } else {
+          this.dataList = [];
+          this.totalPage = 0;
+        }
+        this.dataListLoading = false;
+      });
+    },
+    // 每页数
+    sizeChangeHandle(val) {
+      this.pageSize = val;
+      this.pageIndex = 1;
+      this.getDataList();
+    },
+    // 当前页
+    currentChangeHandle(val) {
+      this.pageIndex = val;
+      this.getDataList();
+    },
+    // 多选
+    selectionChangeHandler(val) {
+      this.dataListSelections = val;
+    },
+    // 添加/修改
+    addOrUpdateHandler(id, type) {
+      this.addOrUpdateOrDetailFlag = true;
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.openDialog(id, type);
+      });
+    },
+    // 删除
+    async deleteHandler(id) {
+      var ids = id
+        ? [Number(id)]
+        : this.dataListSelections.map(item => {
+            return Number(item.id);
+          });
+      await this.$confirm(`确定进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }).then(async () => {
+        await this.$http({
+          url: 'subLoad/delete',
+          method: 'post',
+          data: ids,
+        }).then(async ({ data }) => {
+          if (data && data.code === 0) {
+            this.$message({
+              message: '操作成功',
+              type: 'success',
+            });
+            this.search();
+          } else {
+            this.$message.error(data.msg);
+          }
+        });
+      });
     },
   },
 };
@@ -476,12 +843,7 @@ export default {
   position: relative;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__sizes
-  .el-input
-  .el-input__inner {
+.main-content .el-pagination ::v-deep .el-pagination__sizes .el-input .el-input__inner {
   border: 1px solid #dcdfe6;
   cursor: pointer;
   padding: 0 25px 0 8px;
@@ -497,25 +859,14 @@ export default {
   height: 28px;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__sizes
-  .el-input
-  span.el-input__suffix {
+.main-content .el-pagination ::v-deep .el-pagination__sizes .el-input span.el-input__suffix {
   top: 0;
   position: absolute;
   right: 0;
   height: 100%;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__sizes
-  .el-input
-  .el-input__suffix
-  .el-select__caret {
+.main-content .el-pagination ::v-deep .el-pagination__sizes .el-input .el-input__suffix .el-select__caret {
   cursor: pointer;
   color: #c0c4cc;
   width: 25px;
@@ -547,12 +898,7 @@ export default {
   height: 28px;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__jump
-  .el-input
-  .el-input__inner {
+.main-content .el-pagination ::v-deep .el-pagination__jump .el-input .el-input__inner {
   border: 1px solid #dcdfe6;
   cursor: pointer;
   padding: 0 3px;

src/views/modules/station/components/add-or-update.vue

@@ -79,9 +79,7 @@
         </el-form-item>
         <el-form-item label="负荷报警阀值" prop="alarmThreshold">
           <el-input
-            @change="
-              ruleForm.alarmThreshold = parseInt(ruleForm.alarmThreshold)
-            "
+            @change="ruleForm.alarmThreshold = parseInt(ruleForm.alarmThreshold)"
             type="number"
             style="width: 100%"
             v-model="ruleForm.alarmThreshold"
@@ -106,30 +104,15 @@
           ></el-input>
         </el-form-item>
         <el-form-item class="btn">
-          <el-button
-            class="btn3"
-            v-if="type != 'view'"
-            type="success"
-            @click="onSubmit"
-          >
+          <el-button class="btn3" v-if="type != 'view'" type="success" @click="onSubmit">
             <span class="icon iconfont icon-xihuan"></span>
             提交
           </el-button>
-          <el-button
-            class="btn4"
-            v-if="type != 'view'"
-            type="success"
-            @click="back()"
-          >
+          <el-button class="btn4" v-if="type != 'view'" type="success" @click="back()">
             <span class="icon iconfont icon-xihuan"></span>
             取消
           </el-button>
-          <el-button
-            class="btn5"
-            v-if="type == 'view'"
-            type="success"
-            @click="back()"
-          >
+          <el-button class="btn5" v-if="type == 'view'" type="success" @click="back()">
             <span class="icon iconfont icon-xihuan"></span>
             返回
           </el-button>
@@ -139,16 +122,16 @@
   </div>
 </template>
 <script>
-import { myMixin } from "../selectMixin";
+import { myMixin } from '../selectMixin';
 
 export default {
   mixins: [myMixin],
   data() {
     return {
-      type: "add", // add, edit, view
+      type: 'add', // add, edit, view
       ruleForm: {
         id: undefined,
-        subName: "",
+        subName: '',
         voltageLevel: undefined,
         mainNum: undefined,
         mainCapacity: undefined,
@@ -161,40 +144,21 @@ export default {
         remark: undefined,
       },
       rules: {
-        subName: [
-          { required: true, message: "变电站名称不能为空", trigger: "blur" },
-        ],
-        voltageLevel: [
-          { required: true, message: "电压等级不能为空", trigger: "blur" },
-        ],
-        mainNum: [
-          { required: true, message: "主变台数不能为空", trigger: "blur" },
-        ],
-        mainCapacity: [
-          { required: true, message: "主变容量不能为空", trigger: "blur" },
-        ],
-        alarmThreshold: [
-          { required: true, message: "负荷报警阀值不能为空", trigger: "blur" },
-        ],
-        cityId: [
-          { required: true, message: "归属市名称不能为空", trigger: "change" },
-        ],
-        compId: [
-          { required: true, message: "归属县旗不能为空", trigger: "change" },
-        ],
+        subName: [{ required: true, message: '变电站名称不能为空', trigger: 'blur' }],
+        voltageLevel: [{ required: true, message: '电压等级不能为空', trigger: 'blur' }],
+        mainNum: [{ required: true, message: '主变台数不能为空', trigger: 'blur' }],
+        mainCapacity: [{ required: true, message: '主变容量不能为空', trigger: 'blur' }],
+        alarmThreshold: [{ required: true, message: '负荷报警阀值不能为空', trigger: 'blur' }],
+        cityId: [{ required: true, message: '归属市名称不能为空', trigger: 'change' }],
+        compId: [{ required: true, message: '归属县旗不能为空', trigger: 'change' }],
       },
-      // cityList: [],
       compList: [],
     };
   },
-  props: ["parent"],
+  props: ['parent'],
   computed: {
     title() {
-      return this.type == "add"
-        ? "添加"
-        : this.type == "edit"
-        ? "修改"
-        : "查看";
+      return this.type == 'add' ? '添加' : this.type == 'edit' ? '修改' : '查看';
     },
   },
   methods: {
@@ -208,13 +172,13 @@ export default {
       this.compList = [];
       const { data } = await this.$http({
         url: `/company/lists`,
-        method: "get",
+        method: 'get',
         params: {
           cityId: this.ruleForm.cityId,
         },
       });
       if (data && data.code === 0) {
-        this.compList = data.data.map((item) => ({
+        this.compList = data.data.map(item => ({
           label: item.compName,
           value: item.id,
         }));
@@ -229,13 +193,11 @@ export default {
     info(id) {
       this.$http({
         url: `sub/info/${id}`,
-        method: "get",
+        method: 'get',
       }).then(({ data }) => {
         if (data && data.code === 0) {
           this.ruleForm = data.data;
-          this.ruleForm.compId = this.ruleForm.compId
-            ? Number(this.ruleForm.compId)
-            : undefined;
+          this.ruleForm.compId = this.ruleForm.compId ? Number(this.ruleForm.compId) : undefined;
           if (this.ruleForm.cityId) this.getCompList();
         } else {
           this.$message.error(data.msg);
@@ -245,7 +207,7 @@ export default {
     resetForm() {
       this.ruleForm = {
         id: undefined,
-        subName: "",
+        subName: '',
         voltageLevel: undefined,
         mainNum: undefined,
         mainCapacity: undefined,
@@ -260,25 +222,21 @@ export default {
     },
     // 提交
     async onSubmit() {
-      await this.$refs["ruleForm"].validate(async (valid) => {
+      await this.$refs['ruleForm'].validate(async valid => {
         if (valid) {
-          const compName = this.compList.find(
-            (item) => item.value === this.ruleForm.compId
-          )?.label;
-          const cityName = this.cityList.find(
-            (item) => item.value === this.ruleForm.cityId
-          )?.label;
+          const compName = this.compList.find(item => item.value === this.ruleForm.compId)?.label;
+          const cityName = this.cityList.find(item => item.value === this.ruleForm.cityId)?.label;
           this.ruleForm.compName = compName;
           this.ruleForm.cityName = cityName;
           await this.$http({
-            url: `sub/${!this.ruleForm.id ? "save" : "update"}`,
-            method: "post",
+            url: `sub/${!this.ruleForm.id ? 'save' : 'update'}`,
+            method: 'post',
             data: this.ruleForm,
           }).then(async ({ data }) => {
             if (data && data.code === 0) {
               this.$message({
-                message: "操作成功",
-                type: "success",
+                message: '操作成功',
+                type: 'success',
               });
               this.parent.addOrUpdateOrDetailFlag = false;
               this.resetForm();
@@ -369,7 +327,7 @@ export default {
   min-width: 50%;
   height: 40px;
 }
-.add-update-preview .el-input ::v-deep .el-input__inner[readonly="readonly"] {
+.add-update-preview .el-input ::v-deep .el-input__inner[readonly='readonly'] {
   border: 0px solid #ccc;
   cursor: not-allowed;
   border-radius: 0px;
@@ -451,10 +409,7 @@ export default {
   font-size: 15px;
   height: 40px;
 }
-.add-update-preview
-  .el-date-editor
-  ::v-deep
-  .el-input__inner[readonly="readonly"] {
+.add-update-preview .el-date-editor ::v-deep .el-input__inner[readonly='readonly'] {
   border: 0;
   cursor: not-allowed;
   border-radius: 0px;
@@ -597,10 +552,7 @@ export default {
   min-height: 150px;
   height: auto;
 }
-.add-update-preview
-  .el-textarea
-  ::v-deep
-  .el-textarea__inner[readonly="readonly"] {
+.add-update-preview .el-textarea ::v-deep .el-textarea__inner[readonly='readonly'] {
   border: 0;
   cursor: not-allowed;
   border-radius: 0px;

src/views/modules/station/list.vue

@@ -1,7 +1,11 @@
 <template>
   <div
     class="main-content"
-    :style="{ width: '100%', padding: '20px 30px', fontSize: '15px' }"
+    :style="{
+      width: '100%',
+      padding: '20px 30px',
+      fontSize: '15px',
+    }"
   >
     <!-- 列表页 -->
     <template v-if="!addOrUpdateOrDetailFlag">
@@ -155,11 +159,7 @@
             display: 'flex',
           }"
         >
-          <el-button
-            class="add"
-            type="success"
-            @click="addOrUpdateHandler(null, 'add')"
-          >
+          <el-button class="add" type="success" @click="addOrUpdateHandler(null, 'add')">
             <span
               class="icon iconfont icon-xihuan"
               :style="{
@@ -234,52 +234,27 @@
             width="50"
           />
 
-          <el-table-column
-            :resizable="true"
-            :sortable="true"
-            prop="subName"
-            label="变电站名称"
-          >
+          <el-table-column :resizable="true" :sortable="true" prop="subName" label="变电站名称">
             <template slot-scope="scope">
               {{ scope.row.subName }}
             </template>
           </el-table-column>
-          <el-table-column
-            :resizable="true"
-            :sortable="true"
-            prop="cityName"
-            label="归属市名称"
-          >
+          <el-table-column :resizable="true" :sortable="true" prop="cityName" label="归属市名称">
             <template slot-scope="scope">
               {{ scope.row.cityName }}
             </template>
           </el-table-column>
-          <el-table-column
-            :resizable="true"
-            :sortable="true"
-            prop="compName"
-            label="归属旗县"
-          >
+          <el-table-column :resizable="true" :sortable="true" prop="compName" label="归属旗县">
             <template slot-scope="scope">
               {{ scope.row.compName }}
             </template>
           </el-table-column>
-          <el-table-column
-            :resizable="true"
-            :sortable="true"
-            prop="voltageLevel"
-            label="电压等级"
-          >
+          <el-table-column :resizable="true" :sortable="true" prop="voltageLevel" label="电压等级">
             <template slot-scope="scope">
               {{ scope.row.voltageLevel }}
             </template>
           </el-table-column>
-          <el-table-column
-            :resizable="true"
-            :sortable="true"
-            prop="mainNum"
-            label="主变台数"
-          >
+          <el-table-column :resizable="true" :sortable="true" prop="mainNum" label="主变台数">
             <template slot-scope="scope">
               {{ scope.row.mainNum }}
             </template>
@@ -310,12 +285,7 @@
             prop="growRate"
             label="用户增长率(%)"
           />
-          <el-table-column
-            :resizable="true"
-            :sortable="true"
-            prop="remark"
-            label="备注"
-          >
+          <el-table-column :resizable="true" :sortable="true" prop="remark" label="备注">
             <template slot-scope="scope">
               {{ scope.row.remark }}
             </template>
@@ -356,11 +326,7 @@
                 ></span>
                 修改
               </el-button>
-              <el-button
-                class="del"
-                type="primary"
-                @click="deleteHandler(scope.row.id)"
-              >
+              <el-button class="del" type="primary" @click="deleteHandler(scope.row.id)">
                 <span
                   class="icon iconfont icon-xihuan"
                   :style="{
@@ -373,12 +339,7 @@
                 ></span>
                 删除
               </el-button>
-              <el-button
-                v-if="false"
-                class="view"
-                type="primary"
-                @click="lineHandler(scope.row)"
-              >
+              <el-button v-if="false" class="view" type="primary" @click="lineHandler(scope.row)">
                 <span
                   class="icon iconfont icon-xihuan"
                   :style="{
@@ -423,29 +384,25 @@
     </template>
 
     <!-- 添加/修改页面  将父组件的search方法传递给子组件-->
-    <add-or-update
-      v-if="addOrUpdateOrDetailFlag"
-      :parent="this"
-      ref="addOrUpdate"
-    ></add-or-update>
+    <add-or-update v-if="addOrUpdateOrDetailFlag" :parent="this" ref="addOrUpdate"></add-or-update>
     <!-- 线路页面 -->
     <line-list :parent="this" ref="line"></line-list>
   </div>
 </template>
 
 <script>
-import AddOrUpdate from "./components/add-or-update";
-import LineList from "./components/line-list";
-import { myMixin } from "./selectMixin";
+import AddOrUpdate from './components/add-or-update';
+import LineList from './components/line-list';
+import { myMixin } from './selectMixin';
 
 export default {
   mixins: [myMixin],
   data() {
     return {
       searchForm: {
-        subName: "",
-        cityId: "",
-        compId: "",
+        subName: '',
+        cityId: '',
+        compId: '',
       },
       form: {},
       dataList: [],
@@ -454,7 +411,7 @@ export default {
       totalPage: 0,
       dataListLoading: false,
       dataListSelections: [],
-      layouts: ["prev", "pager", "next", "sizes"],
+      layouts: ['prev', 'pager', 'next', 'sizes'],
       compList: [],
       addOrUpdateOrDetailFlag: false,
     };
@@ -463,8 +420,6 @@ export default {
     this.getCityList();
     this.getDataList();
   },
-  mounted() {},
-  computed: {},
   components: {
     AddOrUpdate,
     LineList,
@@ -476,13 +431,13 @@ export default {
       this.compList = [];
       const { data } = await this.$http({
         url: `/company/lists`,
-        method: "get",
+        method: 'get',
         params: {
           cityId: this.searchForm.cityId,
         },
       });
       if (data && data.code === 0) {
-        this.compList = data.data.map((item) => ({
+        this.compList = data.data.map(item => ({
           label: item.compName,
           value: String(item.id),
         }));
@@ -501,24 +456,21 @@ export default {
       let params = {
         page: this.pageIndex,
         limit: this.pageSize,
-        sort: "id",
-        order: "desc",
+        sort: 'id',
+        order: 'desc',
       };
-      if (
-        this.searchForm.subName != "" &&
-        this.searchForm.subName != undefined
-      ) {
-        params["subName"] = "%" + this.searchForm.subName + "%";
+      if (this.searchForm.subName != '' && this.searchForm.subName != undefined) {
+        params['subName'] = '%' + this.searchForm.subName + '%';
       }
-      if (this.searchForm.cityId != "" && this.searchForm.cityId != undefined) {
-        params["cityId"] = Number(this.searchForm.cityId);
+      if (this.searchForm.cityId != '' && this.searchForm.cityId != undefined) {
+        params['cityId'] = Number(this.searchForm.cityId);
       }
-      if (this.searchForm.compId != "" && this.searchForm.compId != undefined) {
-        params["compId"] = Number(this.searchForm.compId);
+      if (this.searchForm.compId != '' && this.searchForm.compId != undefined) {
+        params['compId'] = Number(this.searchForm.compId);
       }
       this.$http({
-        url: "/sub/page",
-        method: "get",
+        url: '/sub/page',
+        method: 'get',
         params: params,
       }).then(({ data }) => {
         if (data && data.code === 0) {
@@ -557,27 +509,23 @@ export default {
     async deleteHandler(id) {
       var ids = id
         ? [Number(id)]
-        : this.dataListSelections.map((item) => {
+        : this.dataListSelections.map(item => {
             return Number(item.id);
           });
-      await this.$confirm(
-        `确定进行[${id ? "删除" : "批量删除"}]操作?`,
-        "提示",
-        {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning",
-        }
-      ).then(async () => {
+      await this.$confirm(`确定进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }).then(async () => {
         await this.$http({
-          url: "sub/delete",
-          method: "post",
+          url: 'sub/delete',
+          method: 'post',
           data: ids,
         }).then(async ({ data }) => {
           if (data && data.code === 0) {
             this.$message({
-              message: "操作成功",
-              type: "success",
+              message: '操作成功',
+              type: 'success',
             });
             this.search();
           } else {
@@ -604,6 +552,7 @@ export default {
 .center-form-pv .el-input {
   width: auto;
 }
+
 .center-form-pv .el-input ::v-deep .el-input__inner {
   border: 1px solid #ddd;
   border-radius: 0px;
@@ -613,9 +562,11 @@ export default {
   font-size: 15px;
   height: 40px;
 }
+
 .center-form-pv .el-select {
   width: auto;
 }
+
 .center-form-pv .el-select ::v-deep .el-input__inner {
   border: 1px solid #ddd;
   border-radius: 0px;
@@ -625,6 +576,7 @@ export default {
   font-size: 15px;
   height: 40px;
 }
+
 .center-form-pv .el-date-editor {
   width: auto;
 }
@@ -766,6 +718,7 @@ export default {
 .el-table ::v-deep .el-table__body-wrapper {
   position: relative;
 }
+
 .el-table ::v-deep .el-table__body-wrapper tbody {
   width: 100%;
 }
@@ -1030,12 +983,7 @@ export default {
   position: relative;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__sizes
-  .el-input
-  .el-input__inner {
+.main-content .el-pagination ::v-deep .el-pagination__sizes .el-input .el-input__inner {
   border: 1px solid #dcdfe6;
   cursor: pointer;
   padding: 0 25px 0 8px;
@@ -1051,12 +999,7 @@ export default {
   height: 28px;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__sizes
-  .el-input
-  span.el-input__suffix {
+.main-content .el-pagination ::v-deep .el-pagination__sizes .el-input span.el-input__suffix {
   top: 0;
   position: absolute;
   right: 0;
@@ -1101,12 +1044,7 @@ export default {
   height: 28px;
 }
 
-.main-content
-  .el-pagination
-  ::v-deep
-  .el-pagination__jump
-  .el-input
-  .el-input__inner {
+.main-content .el-pagination ::v-deep .el-pagination__jump .el-input .el-input__inner {
   border: 1px solid #dcdfe6;
   cursor: pointer;
   padding: 0 3px;
@@ -1203,6 +1141,7 @@ export default {
   align-items: center;
   height: 30px;
 }
+
 .main-content .el-table .el-switch ::v-deep .el-switch__label--left {
   cursor: pointer;
   margin: 0 10px 0 0;
@@ -1214,6 +1153,7 @@ export default {
   transition: 0.2s;
   height: 30px;
 }
+
 .main-content .el-table .el-switch ::v-deep .el-switch__label--right {
   cursor: pointer;
   margin: 0 0 0 10px;
@@ -1225,6 +1165,7 @@ export default {
   transition: 0.2s;
   height: 30px;
 }
+
 .main-content .el-table .el-switch ::v-deep .el-switch__core {
   border: 1px solid #75c0d6;
   cursor: pointer;
@@ -1237,6 +1178,7 @@ export default {
   transition: border-color 0.3s, background-color 0.3s;
   height: 20px;
 }
+
 .main-content .el-table .el-switch ::v-deep .el-switch__core::after {
   border-radius: 100%;
   top: 1px;
@@ -1247,6 +1189,7 @@ export default {
   transition: all 0.3s;
   height: 16px;
 }
+
 .main-content .el-table .el-switch.is-checked ::v-deep .el-switch__core::after {
   margin: 0 0 0 -18px;
   left: 100%;
@@ -1259,6 +1202,7 @@ export default {
   font-size: 0;
   position: relative;
 }
+
 .main-content .el-table .el-rate ::v-deep .el-rate__item .el-rate__icon {
   margin: 0 3px;
   display: inline-block;