新增商品

src/App.vue

@@ -64,13 +64,6 @@
       this.editableTabs=store?.getters?.getTabList
     },
     watch: {
-      editableTabsValue(val,newval){
-          this.allDatas.forEach(element => {
-            if(element.meta.title==val){
-              this.$router.push(element.path)
-            }
-          });
-      },
       nowindex(val,newval){
         this.$router.push(this.editableTabs[val].path)
       },

src/app.less

@@ -19,9 +19,11 @@ html, body {
             flex:1;
             flex-direction: column;
             width: 100%;
+            height:100%;
         }
         .content{
             background:#F6F8F9;
+            height:100%;
         }
         #main{
             flex:1;
@@ -29,7 +31,13 @@ html, body {
             -webkit-overflow-scrolling: touch;
             background:white;
             margin: 10px;
+            border-radius: 5px;
             padding: 15px;
+            box-sizing: border-box;
+            .blackbtn{
+                background-color: #060101;
+                color: white;
+            }
             &::-webkit-scrollbar {
                 width: 10px;
                 height: 1px;

src/components/base-table.vue

@@ -0,0 +1,465 @@
+<!--
+ * @Descripttion: Element Ui Table 表格二次封装
+ * @Author: 周连
+ -->
+<template>
+  <div class="TableView">
+    <el-table class="elTable" :class="{ 'no-row-line': stripe }" size="medium" ref="dataTable" :data="tableData"
+      :max-height="tableHeight" :stripe="stripe" :highlight-current-row="highlightCurrentRow"
+      @selection-change="selectLine" @current-change="handleCurrentChange" @sort-change="changeSort"
+      @row-dblclick="rowdblclick" @row-click="rowClick" :row-key="rowKey"
+      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
+      <el-table-column v-if="showSelect" type="selection" width="50" align="center" :selectable="checkboxT"
+        reserve-selection>
+      </el-table-column>
+
+      <el-table-column type="expand" v-if="isExpand">
+        <template slot-scope="scope">
+          <slot name="expand" :data="scope" />
+        </template>
+      </el-table-column>
+      <el-table-column label="序号" v-if="showIndex" type="index" width="50" align="center">
+        <template slot-scope="scope">
+          <span>{{ (pageRequest.pageIndex - 1) * pageRequest.pageSize + scope.$index + 1 }}</span></template>
+      </el-table-column>
+      <!-- 文本数据渲染 -->
+      <template v-for="item in tableHead">
+        <!--自定义列 操作模块   fixed="right" -->
+        <el-table-column v-if="item.columnType == 'operation' && item.isShow" :prop="item.prop" :label="item.label"
+          :key="item.prop" :min-width="item.minWidth" :width="item.width" :align="item.align || 'center'" fixed="right">
+          <template slot-scope="scope">
+            <slot :name="item.slotName" :data="scope" />
+          </template>
+        </el-table-column>
+
+        <!--自定义列 :sortable="sortable ? sortable :'custom' "-->
+        <el-table-column :show-overflow-tooltip="item.tooltip == null ? true : item.tooltip"
+          v-else-if="item.columnType == 'slot' && item.isShow" :prop="item.prop" :label="item.label" :key="item.prop"
+          :min-width="item.minWidth" :width="item.width" :align="item.align ? item.align : 'center'"
+          :sortable="item.sortable == null ? false : item.sortable">
+          <template slot-scope="scope">
+            <slot :name="item.slotName" :data="scope" />
+          </template>
+        </el-table-column>
+
+        <!--普通文本 :sort-orders="['ascending', 'descending']" -->
+        <el-table-column :show-overflow-tooltip="item.tooltip == null ? true : item.tooltip"
+          v-else-if="item.isShow && !item.type && !item.columnType" :prop="item.prop" :label="item.label"
+          :key="item.prop" :min-width="item.minWidth" :width="item.width" :align="item.align ? item.align : 'center'"
+          :sortable="item.sortable == null ? false : item.sortable"></el-table-column>
+
+        <!--根据不同类型显示不同的输入框 可以是下拉选择 /按钮 /输入框 还可以自己定义更多 -->
+        <el-table-column v-else-if="item.type && item.isShow && !item.columnType" :label="item.label" :key="item.prop"
+          :min-width="item.minWidth" :width="item.width" :align="item.align ? item.align : 'center'"
+          :sortable="item.sortable == null ? false : item.sortable">
+          <template slot-scope="scope">
+            <el-select v-if="item.type == 'select'" size="mini" v-model="scope.row[item.prop]"
+              @change="handleEdit(scope.$index, scope.row)" placeholder="请选择" clearable filterable value>
+              <el-option v-for="option in item.data" :disabled="disabled" :value="option.name" :key="option.name"
+                :label="option.name" />
+            </el-select>
+            <el-button v-else-if="item.type == 'btn'" :disabled="disabled" @click="onSelected(scope.$index, scope.row)"
+              type="primary" size="mini">{{ item.text }}</el-button>
+            <el-input v-else-if="item.type == 'text'" size="mini" :disabled="item.disabled || disabled"
+              v-model="scope.row[item.prop]" placeholder="请输入" @change="handleEdit(scope.$index, scope.row)" />
+
+            <el-input v-only-number="{ min: 0, precision: 2 }" v-else-if="item.type == 'money'" size="mini"
+              :disabled="item.disabled || disabled" v-model="scope.row[item.prop]" placeholder="请输入"
+              @change="handleEdit(scope.$index, scope.row)" />
+
+            <el-input-number v-onlyInt size="mini" v-else-if="item.type === 'number'" v-model="scope.row[item.prop]"
+              :min="0" label="排序编号" @change="handleEdit(scope.$index, scope.row)"></el-input-number>
+            <!-- <span>{{scope.row[item.prop]}}</span> -->
+          </template>
+        </el-table-column>
+      </template>
+    </el-table>
+
+    <div class="paginationInfo" v-show="pageShow">
+      <pagination ref="p" :page-size="pageRequest.pageSize" :total="total" :current-page="pageRequest.pageIndex"
+        @changePage="changePage" @changePageSize="changePageSize" :layout="layout"></pagination>
+      <div class="pool">{{ totalizeStr }}</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import pagination from '@/components/pagination';
+export default {
+  name: 'e-table',
+  components: { pagination },
+  /**
+   * @name:
+   * @test: test font
+   * @msg:
+   * @param {
+   *  接收参数:
+   *      tableHeadConfig 列的名称、接收值     |     Array
+   *        label         列的名称                      |     String
+   *        prop          列的对应值                    |     String
+   *        columnType    定义当前列为插槽    |   slot   |     String
+   *        slotName      定义当前列插槽的名字           |     String
+   *        width         定义当前列的宽度               |     String
+   *        sortable      列的排序
+   *        isTime        列是否是时间
+   * tooltip :false
+   *
+   *  示例：配置
+   *      tableHeadConfig:[
+   *              {
+   *                label       : "缩略图",
+   *                prop       : "skuName",
+   *                columnType  : "slot",
+   *                slotName    : "thumbnail",
+   *                width       : 240
+   *              }
+   *            ]
+   *
+   *      tableLoadData     异步获取的table文本数据信息
+   *      align             表格单元格内容排列顺序      left|center|right
+   *      showSelect         表格是否可多选
+   *      height            表格默认撑开高度（未用）
+   *      heightOffset      表格最大高度偏移量
+   *      pageShow   显示分页（默认显示）
+   *      pageSize 分页》 页条
+   *      total  分页》 总数
+   *      currentPage 分页 》当前页码
+   *      totalizeStr  合计说明处理
+   *  事件：
+   *      获取当前选中行
+   *      调用页面用  @selectLine="xxx" 进行监听处理
+   *      从后台获取数据,重新排序   changeSort
+   *      双击行事件rowdblclick
+   *      分页获取更改的页码  changePage
+   *      分页获取更改条数/页  changePageSize
+   * }
+   * @return:
+   */
+  props: {
+    tableHeadConfig: {
+      type: Array,
+      default: () => {
+        return [
+          {
+            label: 'skuId',
+            prop: 'skuId',
+          },
+          {
+            label: '操作',
+            columnType: 'slot',
+            slotName: 'operation',
+          },
+        ];
+      },
+    },
+    tableLoadData: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+    highlightCurrentRow: {
+      type: Boolean,
+      default: false,
+    },
+    align: {
+      type: String,
+      default: 'center',
+    },
+    showIndex: {
+      type: Boolean,
+      default: false,
+    },
+    isRequest: {
+      type: Boolean,
+      default: false,
+    },
+    isSerial: {
+      type: Boolean,
+      default: true,
+    },
+    isExpand: {
+      type: Boolean,
+      default: false,
+    },
+    sortable: {
+      type: Boolean,
+      default: false,
+    },
+    showSelect: {
+      type: Boolean,
+      default: false,
+    },
+    height: {
+      type: [Number, String],
+      default: 50,
+    },
+    heightOffset: {
+      type: [Number, String],
+      default: 50,
+    },
+    isDisabled: {//是否禁用
+      type: Boolean,
+      default: true,
+    },
+    tagIndex: { //多个table标签
+      type: Number,
+      default: 0,
+    },
+    isTime: {
+      type: Boolean,
+      default: false,
+    },
+    pageShow: {//显示分页
+      type: Boolean,
+      default: true,
+    },
+    total: {//总数量
+      type: [Number, String],
+      default: 0,
+    },
+    pageSize: {//每页数量
+      type: [Number, String],
+      default: 10,
+    }, 
+    currentPage: {//分页页码
+      type: Number,
+      default: 1,
+    },
+    totalizeStr: {
+      type: String,
+      default: '',
+    },
+    selectQuantity: {//设置选择数量
+      type: [String, Number],
+      default: 0,
+    },
+    layout: {
+      type: String,
+      default: 'total, sizes, prev, pager, next',
+    },
+    stripe: {//是否为斑马纹 table
+      type: Boolean,
+      default: true,
+    },
+    autoHeight: {
+      type: Boolean,
+      default: false,
+    },
+    rowKey: {
+      type: String,
+      default: 'id',
+    },
+    multiple: {//是否多选
+      type: Boolean,
+      default: true,
+    },
+  },
+
+  data() {
+    return {
+      selectioned: '',//单选中的值
+      selectList: [],
+      disabled: false,
+      // 分页信息
+      pageRequest: {
+        pageIndex: 1,
+        pageSize: 10,
+        sort: null,
+        order: null,
+      },
+      tableHeight: null,
+    };
+  },
+  computed: {
+    tableData() {
+      return this.tableLoadData;
+    },
+    tableHead() {
+      return this.tableHeadConfig;
+    },
+  },
+  created() { },
+  mounted() {
+    if (this.isRequest) this.getPageList();
+    if (this.autoHeight) {
+
+      // 监听窗口大小变化
+      let self = this;
+      this.$nextTick(() => {
+        self.tableHeight =
+          window.innerHeight -
+          self.$refs.dataTable.$el.offsetTop -
+          self.heightOffset;
+
+
+        window.onresize = function () {
+          if (self.$refs.dataTable) {
+            self.tableHeight =
+              window.innerHeight -
+              self.$refs.dataTable.$el.offsetTop -
+              self.heightOffset;
+          }
+        };
+        //this.$refs.dataTable.$el.offsetTop：表格距离浏览器的高度
+        //50表示你想要调整的表格距离底部的高度（你可以自己随意调整），因为我们一般都有放分页组件的，所以需要给它留一个高度
+      });
+    }
+  },
+  watch: {
+    currentPage(val) {
+      this.pageRequest.pageIndex = val;
+    },
+    pageSize(val) {
+      this.pageRequest.pageSize = val;
+    }
+  },
+
+  methods: {
+    /*实现单选*/
+    dialogCheck: function (selection, row) {
+      this.$refs.dataTable.clearSelection()
+      if (selection.length === 0) { // 判断selection是否有值存在
+        return
+      }
+      if (row) {
+        this.selectioned = row
+        this.$refs.dataTable.toggleRowSelection(row, true)
+      }
+    },
+
+
+    checkboxT(val) {
+      return this.isDisabled;
+      // return val.isDisabled
+    },
+    // 分页查询
+    getPageList() {
+      this.$emit('getPageList', this.pageRequest);
+    },
+    onResetPage() {
+      this.pageRequest = {
+        pageIndex: 1,
+        pageSize: 10,
+        sort: null,
+        order: null,
+      };
+    },
+    // 从后台获取数据,重新排序
+    changeSort(val) {
+      if (val) {
+        this.pageRequest.pageIndex = 1;
+        this.pageRequest.sort = val.prop;
+        this.pageRequest.order =
+          val.order == 'descending'
+            ? 'desc'
+            : val.order == 'ascending'
+              ? 'asc'
+              : '';
+        this.getPageList();
+      }
+      console.log(this.pageRequest, val);
+    },
+    // 分页获取更改的页码
+    changePage(val) {
+      this.pageRequest.pageIndex = val;
+      this.getPageList();
+      this.$emit('changePage', val);
+    },
+    // 分页获取更改条数/页
+    changePageSize(val) {
+      this.pageRequest.pageSize = val;
+      this.pageRequest.pageIndex = 1;
+      this.getPageList();
+      this.$emit('changePageSize', val);
+    },
+    //双击行事件
+    rowdblclick(row) {
+      console.log(row);
+    },
+    // 选择切换
+    handleCurrentChange(val) {
+      this.$emit('handleCurrentChange', val);
+    },
+    //选择
+    selectLine(val) {
+      this.selectList = val;
+      if (this.selectQuantity > 0) {
+        if (this.selectList.length > this.selectQuantity) {
+          // 截取前20位
+          this.selectList = val.slice(0, this.selectQuantity);
+          // 截取20位之后的数组  禁止选中
+          let tempArr = val.slice(this.selectQuantity);
+          if (tempArr.length !== 0) {
+            tempArr.forEach((ele) => {
+              this.$refs.dataTable.toggleRowSelection(ele, false);
+            });
+          }
+          this.$message.closeAll();
+          this.$message.warning('只能请选择' + this.selectQuantity + '个');
+        }
+      }
+      else {//单选处理
+        if (!this.multiple) {  
+          if (this.selectList.length > 1) {
+            this.$refs.dataTable.clearSelection();
+            this.$refs.dataTable.toggleRowSelection(val.pop());
+          }  
+        }
+      }
+      this.$emit('selectLine', this.selectList, this.tagIndex);
+    },
+
+    handleEdit(index, row) {
+      this.$emit('handleEdit', { index: index, row: row });
+    },
+    onSelected: function (index, row) {
+      this.$emit('onTableBtn', { index: index, row: row });
+    },
+    rowClick(row) {
+      this.$emit('clickTable', row);
+    },
+    // 清空选择
+    clearSelection() {
+      this.$nextTick(() => {
+        this.$refs.dataTable.clearSelection()
+      })
+    },
+  },
+};
+</script>
+<style lang="less" scoped>
+.TableView {
+  margin-top: 10px !important;
+  background: #fff;
+}
+.elTable {
+  & /deep/ .el-table__header-wrapper .el-table__cell .cell {
+    font-family: PingFang SC;
+    font-weight: 400;
+    color: #3a3b3d;
+  }
+}
+.el-table::before {
+  height: 0;
+}
+.el-table /deep/ th {
+  background: #f5f7fd;
+}
+
+// .el-table /deep/ th.el-table__cell.is-leaf,
+// .el-table /deep/ td.el-table__cell {
+//   border: none;
+// }
+.paginationInfo {
+  display: flex;
+  justify-content: flex-end;
+  padding: 7px 0;
+  margin-top: 10px;
+  .pool {
+    padding: 10px 10px;
+    color: #6c6c6c;
+    text-align: right;
+  }
+}
+</style>

src/components/sidebar/menuList.vue

@@ -59,7 +59,7 @@
   font-size: 14px;
   border-radius: 5px;
   margin: 4px;
-  color: black;
+  color: #060101;
   .iconfont{
   font-size: 24px;
   margin-bottom: 2px;
@@ -70,7 +70,7 @@
     flex-direction: column;
     align-items: center;
     font-size: 14px;
-    background: black;
+    background: #060101;
     color: white;
     margin: 4px;
     border-radius: 5px;

src/pages/goods/addGoods/index.vue

@@ -0,0 +1,168 @@
+<template>
+    <div class="wrapper">
+        <div class="title">新增商品</div>
+        <el-form class="form" ref="form" :model="form" label-width="80px">
+            <el-form-item class="single" label="商品名:" label-width="100px">
+                <el-input class="pr-50" placeholder="请输入" v-model="form.title" maxlength="60" show-word-limit>
+                </el-input>
+            </el-form-item>
+            <el-form-item label="类目:" label-width="100px">
+                <el-select v-model="form.third_cat_audit" placeholder="请选择" clearable filterable>
+                    <el-option label="申请通过的类目" value="1"></el-option>
+                    <el-option label="无需审核类目" value="0"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="商品ID:" label-width="100px">
+                <el-input placeholder="请输入" v-model="form.out_product_id" maxlength="25">
+                </el-input>
+            </el-form-item>
+            <el-form-item label="品牌:" label-width="100px">
+                <el-select v-model="form.has_brand" placeholder="请选择" clearable filterable>
+                    <el-option label="申请通过的品牌" value="1"></el-option>
+                    <el-option label="无品牌" value="0"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="商品库存:" label-width="100px">
+                <el-input placeholder="请输入" type='number' maxlength="25" v-model="form.stock_num">
+                </el-input>
+            </el-form-item>
+            <el-form-item label="售卖价格:" label-width="100px">
+                <el-input placeholder="请输入" type='number' maxlength="25" v-model="form.sale_price">
+                </el-input>
+            </el-form-item>
+            <el-form-item label="市场价格:" label-width="100px">
+                <el-input placeholder="请输入" type='number' maxlength="25" v-model="form.market_price">
+                </el-input>
+            </el-form-item>
+            <el-form-item class="single" label="小程序链接:" label-width="100px">
+                <el-input class="pr-50" placeholder="请输入" v-model="form.path" maxlength="100">
+                </el-input>
+            </el-form-item>
+            <el-form-item label="一级类目:" v-if="false" label-width="100px">
+                <el-input placeholder="请输入" maxlength="25">
+                </el-input>
+            </el-form-item>
+            <el-form-item label="二级类目:" v-if="false" label-width="100px">
+                <el-input placeholder="请输入" maxlength="25">
+                </el-input>
+            </el-form-item>
+            <el-form-item label="三级类目:" v-if="form.has_brand=='0'" label-width="100px">
+                <el-input placeholder="请输入" maxlength="25" v-model="form.third_cat_id">
+                </el-input>
+            </el-form-item>
+            <el-form-item class="single" label="商品图片:" label-width="100px">
+                <el-upload :action="uploadUrl" list-type="picture-card" :on-preview="handlePictureCardPreview"
+                    :on-remove="handleRemove">
+                    <i class="el-icon-plus"></i>
+                </el-upload>
+                <el-dialog :visible.sync="dialogVisible">
+                    <img width="100%" :src="dialogImageUrl" alt="">
+                </el-dialog>
+            </el-form-item>
+            <el-form-item class="single" label="商品资质图片:" label-width="100px">
+                <el-upload :action="uploadUrl" list-type="picture-card" :on-preview="handlePictureCardPreview"
+                    :on-remove="handleRemove">
+                    <i class="el-icon-plus"></i>
+                </el-upload>
+                <el-dialog :visible.sync="dialogVisible">
+                    <img width="100%" :src="dialogImageUrl" alt="">
+                </el-dialog>
+            </el-form-item>
+            <el-form-item class="commit">
+                <el-button class="blackbtn" :loading="loading" @click.native.prevent="commit">提交
+                </el-button>
+            </el-form-item>
+
+        </el-form>
+    </div>
+</template>
+
+<script>
+    export default {
+        components: {},
+        props: {},
+        data() {
+            return {
+                uploadUrl: global_config.BASE_URL + 'file/img/upload',
+                form: {
+                    title: '',
+                    third_cat_audit: '',
+                    out_product_id: '',
+                    has_brand: '',
+                    stock_num: '',
+                    sale_price: '',
+                    market_price: '',
+                    path: '',
+                    third_cat_id: '',
+                },
+                loading: false
+            };
+        },
+        watch: {},
+        computed: {},
+        methods: {
+            commit(){
+                this.$router.go(-1)
+            },
+            handlePictureCardPreview(file) {
+                this.dialogImageUrl = file.url;
+                this.dialogVisible = true
+            }
+        },
+        created() {},
+        mounted() {}
+    };
+</script>
+<style lang="less" scoped>
+    .wrapper {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+
+        .title {
+            font-weight: bold;
+            width: 100%;
+            text-align: left;
+            margin-left: 100px;
+        }
+
+        .form {
+            margin-top: 20px;
+            width: 75%;
+            display: flex;
+            justify-content: space-between;
+            flex-wrap: wrap;
+
+            .el-form-item {
+                color: #232323;
+                font-weight: bold;
+            }
+
+            .el-select {
+                width: 300px;
+            }
+
+            .el-input {
+                width: 300px;
+            }
+
+            .single {
+                width: 100%;
+
+                .el-input {
+                    width: 875px;
+                }
+
+                .el-select {
+                    width: 875px;
+                }
+            }
+            .commit{
+                width: 100%;
+                text-align: center;
+            }
+        }
+
+
+    }
+</style>

src/pages/goods/index.vue

@@ -0,0 +1,114 @@
+<template>
+  <div class="index flex column">
+    <el-tabs v-model="activeName" @tab-click="handleClick">
+      <el-tab-pane label="上架" name="上架"></el-tab-pane>
+      <el-tab-pane label="下架" name="下架"></el-tab-pane>
+      <el-tab-pane label="首次申请" name="首次申请"></el-tab-pane>
+    </el-tabs>
+    <div class="serach flex row space-between">
+      <el-button class="blackbtn" icon="el-icon-plus" @click="addGoods">新增商品</el-button>
+      <div class="flex row">
+        <el-input v-model="searchForm.shopName" placeholder="请输入商品名称/ID" clearable></el-input>
+        <el-button class="btn_search blackbtn" icon="el-icon-search" @click="handleLogin">查询</el-button>
+      </div>
+    </div>
+    <e-table class="table" ref="eTable" :tableHeadConfig="tableHeadConfig" :tableLoadData="tableLoadData"
+      :pageShow="true" :total="searchForm.total" :currentPage="searchForm.pageNum" :pageSize="searchForm.pageSize"
+      @getPageList="getPageList">
+      <template v-slot:operation="slotData">
+        <div class="operationDiv">
+            <el-button type="text"  @click="toView(slotData.row)">下架</el-button>
+            <el-button type="text"  @click="toView(slotData.row)">编辑</el-button>
+        </div>
+      </template>
+    </e-table>
+
+  </div>
+</template>
+
+<script>
+  import eTable from '@/components/base-table'
+  export default {
+    name: "index",
+    components: {
+      eTable
+    },
+    data() {
+      return {
+        activeName: '上架',
+        searchForm: {
+          shopName: '',
+          total: 0,
+          pageNum: 1,
+          pageSize: 10,
+        },
+        tableHeadConfig: [{
+            label: '商品名称',
+            prop: 'name',
+            isShow: true,
+          },
+
+          {
+            label: '商品ID',
+            prop: 'name',
+            isShow: true,
+          },
+          {
+            label: '价格',
+            prop: 'name',
+            isShow: true,
+          },
+          {
+            label: '库存',
+            prop: 'name',
+            isShow: true,
+          },
+          {
+            label: '审核状态',
+            prop: 'name',
+            isShow: true,
+          },
+          {
+            label: '创建时间',
+            prop: 'name',
+            isShow: true,
+          },
+          {
+            label: '上架时间',
+            prop: 'name',
+            isShow: true,
+          },
+          {
+            label: '操作',
+            columnType: 'operation',
+            slotName: 'operation',
+            width: 200,
+            isShow: true,
+          }
+        ],
+        tableLoadData: [{name:"111"}],
+      };
+    },
+    created() {},
+    methods: {
+      getPageList(pageRequest) {
+        if (pageRequest) {
+          this.searchForm.pageNum = pageRequest.pageIndex;
+          this.searchForm.pageSize = pageRequest.pageSize;
+        }
+      },
+      addGoods(){// 新增商品
+        this.$router.push("/goods/addGoods");
+      }
+    }
+  };
+</script>
+<style lang="less" scoped>
+  .btn_search {
+    margin-left: 10px;
+  }
+  .serach{
+    margin-bottom: 10px;
+  }
+  
+</style>

src/pages/index/index.vue

@@ -1,26 +0,0 @@
-<template>
-  <div class="index">
-    <div>
-      <div>Welcome</div>
-      <div>您可以在这里开始工作</div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "index",
-  components: {
-  },
-  data() {
-    return {
-    };
-  },
-  created() {
-  },
-  methods: {
-  }
-};
-</script>
-<style lang="less" scoped>
-</style>

src/pages/login/index.vue

@@ -7,13 +7,13 @@
       <el-form class="form" ref="loginForm" :model="loginForm" label-width="80px" label-position="top"
         :rules="loginRules" hide-required-asterisk>
         <el-form-item label="账号:" prop="account">
-          <el-input v-model="loginForm.account" placeholder="请输入账号" maxlength="20" clearable></el-input>
+          <el-input v-model="loginForm.account" @keyup.enter.native="handleLogin" placeholder="请输入账号" maxlength="20" clearable></el-input>
         </el-form-item>
         <el-form-item label="密码:" prop="password">
-          <el-input v-model="loginForm.password" placeholder="请输入密码" maxlength="20" show-password clearable></el-input>
+          <el-input v-model="loginForm.password" @keyup.enter.native="handleLogin" placeholder="请输入密码" maxlength="20" show-password clearable></el-input>
         </el-form-item>
         <el-form-item>
-          <el-button class="loginbtn" :loading="loading" @click.native.prevent="handleLogin">登陆</el-button>
+          <el-button class="loginbtn blackbtn" :loading="loading" @click.native.prevent="handleLogin">登陆</el-button>
         </el-form-item>
       </el-form>
     </div>
@@ -71,7 +71,7 @@
               if (res.code == 0) {
                 store.commit('SET_USER_INFO',res.data)
                 store.commit('SET_USER_TOKEN',res.data.token)
-                this.$router.push("/index");
+                this.$router.push("/goods");
               }
             }).catch(()=>{
               this.loading=false
@@ -116,13 +116,11 @@
       .loginbtn {
         width: 200px;
         margin-top: 20px;
-        color: white;
-        background-color: black;
       }
     }
 
     .welcome {
-      color: black;
+      color: #060101;
       font-size: x-large;
       font-weight: bold;
       margin-top: 10px;

src/router/routes.js

@@ -8,10 +8,10 @@ keepAlive动态页面缓存：
 export  const menuRouter =[
   {
     id: 0,
-    name: 'index',
-    path: '/index',
+    name: 'goods',
+    path: '/goods',
     meta: { title: '商品管理', icon: 'icon-shangpinguanli', keepAlive:true},
-    component: () => import('@/pages/index/index.vue'),
+    component: () => import('@/pages/goods/index.vue'),
   },
   {
     id: 1,
@@ -38,4 +38,10 @@ export const otherRouter = [
     meta: { title: '登录' },
     component: () => import('@/pages/login/index.vue'),
   },
+  {
+    name: 'addGoods',
+    path: '/goods/addGoods',
+    meta: { title: '新增商品' },
+    component: () => import('@/pages/goods/addGoods/index.vue'),
+  },
 ]

static/iconfont/demo.css

@@ -401,7 +401,7 @@ https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javasc
  */
 code[class*="language-"],
 pre[class*="language-"] {
-  color: black;
+  color: #060101;
   background: none;
   text-shadow: 0 1px white;
   font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;