ss

src/pages/mobikeMarket/goods-list/index.vue

@@ -0,0 +1,123 @@
+<template>
+  <div class="box">
+    <div class="top_box">
+      <el-button type="primary" @click="confirm">确定</el-button>
+    </div>
+    <my-form
+      ref="myForm"
+      :formValue="formValue"
+      :formList="formList"
+      :rules="rules"
+      labelPosition="left"
+      labelWidth="100px"
+      class="my_form"
+    >
+    </my-form>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "goods-list",
+  data() {
+    return {
+      formValue: {
+        name: "",
+        number: "",
+        grade: "",
+        status: "",
+        status2: [],
+        rich: "",
+      },
+      formList: [
+        {
+          type: "input",
+          prop: "name",
+          label: "名称:",
+        },
+        {
+          type: "input",
+          prop: "number",
+          label: "剩余数量:",
+        },
+        {
+          type: "input",
+          prop: "grade",
+          label: "积分（分）:",
+        },
+
+        {
+          label: "项目状态",
+          prop: "status",
+          type: "Radio",
+          radios: [
+            { label: "上线", value: 1 },
+            { label: "待上线", value: 2 },
+            { label: "下线", value: 3 },
+          ],
+        },
+
+        {
+          label: "项目状态",
+          prop: "status2",
+          type: "Checkbox",
+          checkboxs: [
+            { label: "西瓜", value: 1 },
+            { label: "苹果", value: 2 },
+            { label: "菠萝", value: 3 },
+          ],
+        },
+        {
+          type: "richText",
+          prop: "rich",
+        },
+      ],
+      rules: {
+        name: [
+          { required: true, message: "请选择活动区域", trigger: "change" },
+        ],
+        number: [
+          { required: true, message: "请选择活动区域", trigger: "change" },
+        ],
+        grade: [
+          { required: true, message: "请选择活动区域", trigger: "change" },
+        ],
+      },
+    };
+  },
+  methods: {
+    confirm() {
+      this.$refs.myForm.$refs.formData.validate((valid) => {
+        if (valid) {
+          console.log("77777");
+          console.log(this.formValue);
+          let arr = [];
+          // this.$emit("submitForm", this.formValue);
+        } else {
+          return false;
+        }
+      });
+    },
+    handlePop() {},
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.box {
+  // height: 100vh;
+  width: 100%;
+  .top_box {
+    width: 100%;
+    height: 7vh;
+    border-bottom: 1px solid #00bfbf;
+    display: flex;
+    align-items: flex-end;
+    justify-content: flex-end;
+    margin-bottom: 2%;
+  }
+}
+::v-deep .my_form .ql-container {
+  height: 20vh;
+}
+</style>

src/pages/mobikeMarket/index.vue

@@ -0,0 +1,15 @@
+<template>
+  <div>
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "mobikemarket",
+  data() {
+    return {};
+  },
+  mounted() {},
+};
+</script>

src/pages/mobikeMarket/sends/index.vue

@@ -0,0 +1,70 @@
+<template>
+  <div class="box">
+    <template v-for="(item, index) in title">
+      <span
+        :class="{ active: index === currentIndex, title: true }"
+        @click="changeColor(index)"
+        >{{ item }}</span
+      >
+      <el-divider
+        v-if="index < title.length - 1"
+        direction="vertical"
+      ></el-divider>
+    </template>
+    <div class="">
+      {{ msg }}
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "goods-classify",
+  data() {
+    return {
+      msg: "000000",
+      title: ["待提交", "待审核", "待发送", "历史"],
+      currentIndex: 0,
+    };
+  },
+  methods: {
+    changeColor(index) {
+      this.currentIndex = index;
+      switch (index) {
+        case 0:
+          this.msg = "000000";
+          break;
+        case 1:
+          this.msg = "11111";
+          break;
+        case 2:
+          this.msg = "2222222";
+          break;
+        case 3:
+          this.msg = "3333333";
+          break;
+        default:
+          this.msg = "000000";
+          break;
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.box {
+  height: 100vh;
+  width: 100%;
+  .title {
+    display: inline-block;
+    font-size: 17px;
+  }
+  .el-divider--vertical {
+    margin: 0 34px;
+  }
+  .active {
+    color: red;
+  }
+}
+</style>

src/router/dynamic-router.js

@@ -15,6 +15,11 @@ const GoodsClassify = () => import('../pages/goods-manage/goods-classify')
 const System = () => import('../pages/system')
 
 
+/* 移动营销 */
+const MobikeMarket = () => import('../pages/mobikeMarket')
+const Sends = () => import('../pages/mobikeMarket/sends')
+
+
 /* 测试管理 */
 const Test = () => import('../pages/test')
 
@@ -124,6 +129,26 @@ const dynamicRoutes = [
             name: '测试管理',
             icon: 'el-icon-s-help'
         },
+    },
+    {
+        path: '/mobkemarket',
+        component: MobikeMarket,
+        name: 'mobikeMarket',
+        meta: {
+            name: '移动营销',
+            icon: 'el-icon-s-platform'
+        },
+        children: [
+            {
+                path: 'sends',
+                name: 'sends',
+                component: Sends,
+                meta: {
+                    name: '短信群发',
+                    icon: 'el-icon-location'
+                }
+            },
+        ]
     }
 
 ]