科技超市更新

src/layout/layout-part/menus.vue

@@ -70,7 +70,8 @@ export default {
   props: {},
   components: {},
   data: () => ({
-    defalutMenu: ['1', '2', '3'],
+    // defalutMenu: ['1', '2', '3'],
+    defalutMenu: ['1'],
     defalutPage: '',
   }),
   created() {},

src/layout/supermarket/mainType.vue

@@ -28,7 +28,7 @@
       </el-col>
     </el-row>
     <el-dialog title="详细信息" :visible.sync="dialog">
-      <p class="text">创建用户名称：{{ info.title }}</p>
+      <p class="text">服务类别名称：{{ info.title }}</p>
       <p class="text">类别编码：{{ info.bianma }}</p>
       <p class="text">父类编码：{{ info.fuBianma }}</p>
       <p class="text">创建时间：{{ info.date }}</p>

src/layout/supermarket/serviceForm.vue

@@ -0,0 +1,58 @@
+<template>
+  <div id="typeForm">
+    <el-row>
+      <el-col :span="24" class="typeForm">
+        <el-form ref="form" :model="form" label-width="130px">
+          <el-form-item label="产品服务类别名称">
+            <el-input v-model="form.title" placeholder="请输入商铺类别名称"></el-input>
+          </el-form-item>
+          <el-form-item label="产品服务类别编码">
+            <el-input v-model="form.bianma" placeholder="商铺类别编码"></el-input>
+          </el-form-item>
+          <el-form-item label="请选择父类编码" prop="fuBianma">
+            <el-select v-model="form.fuBianma" placeholder="请选择父类编码">
+              <el-option label="计算机" value="man"></el-option>
+              <el-option label="VR" value="woman"></el-option>
+              <el-option label="MR" value="man"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-button @click="handleCancel">返回</el-button>
+            <el-button type="primary" @click="handleEdit()">提交</el-button>
+          </el-form-item>
+        </el-form>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import WangEditor from '@/components/wang-editor.vue';
+export default {
+  name: 'typeForm',
+  props: {
+    form: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {
+    handleEdit() {
+      this.handleCancel();
+    },
+    handleCancel() {
+      this.$router.push({ path: './index' });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.el-form {
+  padding: 0 200px;
+}
+.typeForm {
+  padding: 20px 0;
+}
+</style>

src/layout/supermarket/typeForm.vue

@@ -0,0 +1,58 @@
+<template>
+  <div id="typeForm">
+    <el-row>
+      <el-col :span="24" class="typeForm">
+        <el-form ref="form" :model="form" label-width="110px">
+          <el-form-item label="商铺类别名称">
+            <el-input v-model="form.title" placeholder="请输入商铺类别名称"></el-input>
+          </el-form-item>
+          <el-form-item label="商铺类别编码">
+            <el-input v-model="form.bianma" placeholder="商铺类别编码"></el-input>
+          </el-form-item>
+          <el-form-item label="请选择父类编码" prop="fuBianma">
+            <el-select v-model="form.fuBianma" placeholder="请选择父类编码">
+              <el-option label="计算机" value="man"></el-option>
+              <el-option label="VR" value="woman"></el-option>
+              <el-option label="MR" value="man"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-button @click="handleCancel">返回</el-button>
+            <el-button type="primary" @click="handleEdit()">提交</el-button>
+          </el-form-item>
+        </el-form>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import WangEditor from '@/components/wang-editor.vue';
+export default {
+  name: 'typeForm',
+  props: {
+    form: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {
+    handleEdit() {
+      this.handleCancel();
+    },
+    handleCancel() {
+      this.$router.push({ path: './index' });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.el-form {
+  padding: 0 200px;
+}
+.typeForm {
+  padding: 20px 0;
+}
+</style>

src/router/index.js

@@ -195,6 +195,10 @@ export default new Router({
       path: '/supermarket/service/index',
       component: () => import('../views/supermarket/service/index.vue'),
     },
+    {
+      path: '/supermarket/service/detail',
+      component: () => import('../views/supermarket/service/detail.vue'),
+    },
     // 科技超市-产品服务审核管理
     {
       path: '/supermarket/seviceShen/index',

src/views/supermarket/service/detail.vue

@@ -0,0 +1,45 @@
+<template>
+  <div id="detail">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="top">
+          <topInfo :topTitle="topTitle"></topInfo>
+        </el-col>
+        <el-col :span="24" class="main">
+          <typeForm :form="form"></typeForm>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import topInfo from '@/layout/public/top.vue';
+import typeForm from '@/layout/supermarket/serviceForm.vue';
+export default {
+  name: 'detail',
+  props: {},
+  components: {
+    topInfo, //头部标题
+    typeForm, //新闻信息form
+  },
+  data: () => ({
+    topTitle: '产品服务类别信息编辑',
+    form: {},
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.top {
+  height: 40px;
+  background-color: #f5f5f5;
+}
+.main {
+  width: 97%;
+  margin: 0 15px;
+}
+</style>

src/views/supermarket/service/index.vue

@@ -1,19 +1,94 @@
 <template>
   <div id="index">
-    <p>index</p>
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="top">
+          <topInfo :topTitle="topTitle"></topInfo>
+        </el-col>
+        <el-col :span="24" class="search">
+          <el-col :span="24" class="searchInfo">
+            <el-col :span="8" class="left">
+              <span>查询产品服务类别名称：</span>
+              <el-input v-model="input" placeholder="请输入产品服务类别名称"></el-input>
+            </el-col>
+            <el-col :span="8" class="left">
+              <span>查询产品服务类别编码：</span>
+              <el-input v-model="input" placeholder="请输入产品服务类别编码"></el-input>
+            </el-col>
+            <el-col :span="8" class="right">
+              <el-button size="mini" type="primary" icon="el-icon-search">查询</el-button>
+              <el-button size="mini" type="success" icon="el-icon-check" @click="addData()">产品服务类别类别</el-button>
+            </el-col>
+          </el-col>
+        </el-col>
+        <el-col :span="24" class="main">
+          <mainType :tableData="tableData"></mainType>
+        </el-col>
+      </el-col>
+    </el-row>
   </div>
 </template>
 
 <script>
+import topInfo from '@/layout/public/top.vue';
+import mainType from '@/layout/supermarket/mainType.vue';
 export default {
   name: 'index',
   props: {},
-  components: {},
-  data: () => ({}),
+  components: {
+    topInfo, //头部标题
+    mainType, //商铺类别管理
+  },
+  data: () => ({
+    topTitle: '商铺类别管理',
+    input: '',
+    tableData: [
+      {
+        title: '高校类别',
+        bianma: 'ASDF',
+        fuBianma: 'asdf',
+        date: '2019-01-13',
+      },
+      {
+        title: '十条数据',
+        bianma: 'ASDF',
+        fuBianma: 'asdf',
+        date: '2019-01-13',
+      },
+    ],
+  }),
   created() {},
   computed: {},
-  methods: {},
+  methods: {
+    addData() {
+      this.$router.push({ path: './detail' });
+    },
+  },
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.top {
+  height: 40px;
+  background-color: #f5f5f5;
+}
+.search {
+  height: 40px;
+  line-height: 40px;
+  padding: 0 15px;
+}
+.searchInfo .left span {
+  font-size: 13px;
+  color: #393939;
+}
+.searchInfo .left .el-input {
+  width: 50%;
+}
+/deep/.searchInfo .left .el-input .el-input__inner {
+  height: 28px;
+}
+.main {
+  width: 97%;
+  margin: 0 15px;
+}
+</style>

src/views/supermarket/type/detail.vue

@@ -1,19 +1,45 @@
 <template>
   <div id="detail">
-    <p>detail</p>
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="top">
+          <topInfo :topTitle="topTitle"></topInfo>
+        </el-col>
+        <el-col :span="24" class="main">
+          <typeForm :form="form"></typeForm>
+        </el-col>
+      </el-col>
+    </el-row>
   </div>
 </template>
 
 <script>
+import topInfo from '@/layout/public/top.vue';
+import typeForm from '@/layout/supermarket/typeForm.vue';
 export default {
   name: 'detail',
   props: {},
-  components: {},
-  data: () => ({}),
+  components: {
+    topInfo, //头部标题
+    typeForm, //新闻信息form
+  },
+  data: () => ({
+    topTitle: '商铺类别管理信息编辑',
+    form: {},
+  }),
   created() {},
   computed: {},
   methods: {},
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.top {
+  height: 40px;
+  background-color: #f5f5f5;
+}
+.main {
+  width: 97%;
+  margin: 0 15px;
+}
+</style>