页面修改

src/components/huimai/hbrand.vue

@@ -2,28 +2,62 @@
   <div class="performanceStatics">
     <div class="head-title">
       品牌管理
-      <el-button style="float:right;margin-top: -5px;" type="primary" class="el-button--small"
-        @click="CommonJump('hbrandedit')">新增</el-button>
+      <el-button
+        style="float:right;margin-top: -5px;"
+        type="primary"
+        class="el-button--small"
+        @click="CommonJump('hbrandedit')"
+        >新增</el-button
+      >
     </div>
     <div class="content">
       <div style="margin-bottom:20px">
         <span>分类</span>
-        <el-select style="margin:0 10px" class="w200" @change="msg.pageIndex=1,getList()" v-model="msg.CategoryId"
-          size="small" placeholder="请选择" clearable>
+        <el-select
+          style="margin:0 10px"
+          class="w200"
+          @change="(msg.pageIndex = 1), getList()"
+          v-model="msg.CategoryId"
+          size="small"
+          placeholder="请选择"
+          clearable
+        >
           <el-option label="不限" :value="0"></el-option>
-          <el-option v-for="item in CategoryList" :key="item.Id" :label="item.Name" :value="item.Id">
+          <el-option
+            v-for="item in CategoryList"
+            :key="item.Id"
+            :label="item.Name"
+            :value="item.Id"
+          >
           </el-option>
         </el-select>
         <span>品牌名称</span>
-        <el-input type="text" style="width:250px" size="small" maxlength="100" v-model="msg.Name" clearable
-          @input="msg.pageIndex=1,getList()">
+        <el-input
+          type="text"
+          style="width:250px"
+          size="small"
+          maxlength="100"
+          v-model="msg.Name"
+          clearable
+          @input="(msg.pageIndex = 1), getList()"
+        >
         </el-input>
-        <el-button @click="msg.pageIndex=1,getList()" size="small" type="primary">
+        <el-button
+          @click="(msg.pageIndex = 1), getList()"
+          size="small"
+          type="primary"
+        >
           查询
         </el-button>
       </div>
-      <el-table :data="tableData" v-loading="loading" border style="width: 100%">
-        <el-table-column prop="Id" label="编号" width="100">
+      <el-table
+        :data="tableData"
+        v-loading="loading"
+        border
+        style="width: 100%"
+      >
+        <el-table-column prop="Id" label="编号" width="100"> </el-table-column>
+        <el-table-column prop="CategoryName" label="所属分类" width="100">
         </el-table-column>
         <el-table-column prop="Name" label="品牌名称" width="200">
         </el-table-column>
@@ -34,32 +68,57 @@
         </el-table-column>
         <el-table-column label="是否热门" width="100px">
           <template slot-scope="scope">
-            <el-tag v-if="scope.row.IsHot==1" effect="dark">
+            <el-tag v-if="scope.row.IsHot == 1" effect="dark">
               热门
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column prop="RemarkDesc" label="上传描述">
-        </el-table-column>
-        <el-table-column prop="MoreDesc" label="备注描述">
-        </el-table-column>
-        <el-table-column label="操作" width="250px">
+        <el-table-column prop="RemarkDesc" label="上传描述"> </el-table-column>
+        <el-table-column prop="MoreDesc" label="备注描述"> </el-table-column>
+        <el-table-column label="操作" width="150px">
           <template slot-scope="scope">
-            <img @click="showBrandForm(scope.row)" src="../../assets/img/userman/edit.png" alt="" />
-            <img @click="RemmoveBrand(scope.row)" style="margin-left:10px;" src="../../assets/img/userman/del.png"
-              alt="" />
+            <el-tooltip
+              class="item"
+              effect="dark"
+              content="编辑"
+              placement="top"
+            >
+              <img
+                class="edit-img"
+                src="../../assets/img/userman/edit.png"
+                @click="showBrandForm(scope.row)"
+              />
+            </el-tooltip>
+            <el-tooltip
+              class="item"
+              effect="dark"
+              content="删除"
+              placement="top"
+            >
+              <img
+                src="../../assets/img/userman/del.png"
+                @click="RemmoveBrand(scope.row)"
+              />
+            </el-tooltip>
           </template>
         </el-table-column>
       </el-table>
-      <el-pagination style="text-align:right" background @current-change="handleCurrentChange" :page-size="msg.pageSize"
-        :current-page.sync="msg.pageIndex" layout="prev, pager, next" :total="total">
+      <el-pagination
+        style="text-align:right"
+        background
+        @current-change="handleCurrentChange"
+        :page-size="msg.pageSize"
+        :current-page.sync="msg.pageIndex"
+        layout="prev, pager, next"
+        :total="total"
+      >
       </el-pagination>
     </div>
   </div>
 </template>
 
 <script>
-  export default {
+export default {
   data() {
     return {
       loading: false,
@@ -69,14 +128,14 @@
         pageIndex: 1,
         pageSize: 15,
         CategoryId: 0, //分类编号
-          Name: '', //品牌名称
+        Name: "" //品牌名称
       },
       CategoryList: [], //分类列表
-        dateList: [], //日期
-      }
+      dateList: [] //日期
+    };
   },
   created() {
-      this.getCategoryList()
+    this.getCategoryList();
   },
   mounted() {
     this.getList();
@@ -90,24 +149,23 @@
         } else {
           this.Error(res.data.message);
         }
-        })
-      },
-      refreshPage() {
-
+      });
     },
+    refreshPage() {},
     //新增修改品牌
     showBrandForm(item) {
-        this.CommonJump('hbrandedit', {
+      this.CommonJump("hbrandedit", {
         Id: item.Id
-        })
+      });
     },
     //删除品牌
     RemmoveBrand(item) {
       let that = this;
-        that.Confirm("是否删除此品牌?", function () {
+      that.Confirm("是否删除此品牌?", function() {
         that.apipost(
-            "/api/Assess/DelBrandInfo", {
-              BrandId: item.Id,
+          "/api/Assess/DelBrandInfo",
+          {
+            BrandId: item.Id
           },
           res => {
             if (res.data.resultCode == 1) {
@@ -116,7 +174,7 @@
             } else {
               that.Error(res.data.message);
             }
-            },
+          }
         );
       });
     },
@@ -131,21 +189,24 @@
         } else {
           this.Error(res.data.message);
         }
-        })
+      });
     },
     handleCurrentChange(val) {
       this.msg.pageIndex = val;
       this.getList();
-      },
     }
-  };
+  }
+};
 </script>
-<style>
-  .performanceStatics .content {
+<style scope>
+.performanceStatics .content {
   background: #fff;
   margin-top: 10px;
   padding: 20px;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
-  }
+}
+.edit-img {
+  margin-right: 10px;
+}
 </style>