feat: distribute

server/controllers/groupmeal.js

+// const GROUPMEAL_URI = require("../config.js").GROUPMEAL_URI;
+// const req = require("../utils/request").httpReq;

src/pages/Groupmeal/Distrib/index.less

+.goods {
+	width: 100%;
+	height: 100%;
+	padding: 0 30px;
+    .header {
+        text-align: right;
+        margin-bottom: 30px;
+    }
+    .dioFor {
+       padding-left: 10%;   
+        width: 70%;
+    }
+    .diotab {
+        margin-left: 5%;   
+        margin-top: 10px;
+    }
+	.dialog-footer {
+        display: flex;
+		align-items: center;
+		justify-content: center;
+    }
+	.commodity_list {
+		margin-top: 30px;
+	}
+	.pagination {
+		margin-top: 30px;
+	}
+}

src/pages/Groupmeal/Distrib/index.vue

+<template>
+  <Layout>
+    <el-card class="goods">
+      <div class="header">
+        <el-button type="primary" @click="dialogFormAssign = true"
+          >分配配送员</el-button
+        >
+        <el-button type="primary" @click="dialogFormAdd = true"
+          >添加配送员</el-button
+        >
+      </div>
+      <el-table :data="distribList" border stripe style="width: 100%">
+        <el-table-column
+          align="center"
+          prop="name"
+          label="活动名称"
+          width="width"
+        >
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="number"
+          label="配送员数量"
+          width="width"
+        >
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="people"
+          label="配送人员"
+          width="width"
+        >
+        <template #default="scope">
+            {{scope.row.people.map(item=>item.name).join(',')}}
+        </template>
+        </el-table-column>
+        <el-table-column align="center" prop="prop" label="操作" width="width">
+          <template #default="scope">
+            <el-button type="primary" @click="handleModify(scope.row)"
+              >修改</el-button
+            >
+            <el-button
+              type="primary"
+              @click="handleDownload('download', scope.row.id)"
+              >下载配送路线</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 添加配送员弹框 -->
+      <el-dialog
+        title="添加配送员"
+        v-model="dialogFormAdd"
+        width="40%"
+        :show-close="false"
+      >
+        <el-form class="dioFor" :model="addDistrib" :rules="rules">
+          <el-form-item label="姓名" label-width="100px" prop="name">
+            <el-input
+              v-model="addDistrib.name"
+              maxlength="10"
+              type="text"
+              show-word-limit
+              clearable
+              autocomplete="off"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="配送上限" label-width="100px" prop="limit">
+            <el-input
+              v-model.number="addDistrib.limit"
+              onkeyup="value=value.replace(/[^\d]/g,'')"
+              clearable
+              autocomplete="off"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="最小配送量" label-width="100px" prop="minvolume">
+            <el-input
+              v-model.number="addDistrib.minvolume"
+              onkeyup="value=value.replace(/[^\d]/g,'')"
+              clearable
+              autocomplete="off"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="配送工具" label-width="100px" prop="tool">
+            <el-select
+              v-model="addDistrib.tool"
+              clearable
+              placeholder="请选择活动区域"
+            >
+              <el-option label="电动车" value="electric"></el-option>
+              <el-option label="摩托车" value="motorcycle"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-form>
+        <template #footer>
+          <span class="dialog-footer">
+            <el-button @click="dialogFormAdd = false">取 消</el-button>
+            <el-button type="primary" @click="dialogFormAdd = false"
+              >保 存</el-button
+            >
+          </span>
+        </template>
+      </el-dialog>
+      <!-- 分配配送员弹框 -->
+      <el-dialog
+        title="分配配送员"
+        v-model="dialogFormAssign"
+        width="40%"
+        :show-close="false"
+      >
+        <el-form class="dioFor" :model="assignDistrib">
+          <el-form-item label="活动姓名" label-width="100px">
+            <el-select v-model="assignDistrib.name" clearable filterable>
+              <el-option label="电动车" value="electric"></el-option>
+              <el-option label="摩托车" value="motorcycle"></el-option>
+            </el-select>
+          </el-form-item>
+          <span class="dioFor">已选:</span>
+          <el-table
+            class="diotab"
+            align="center"
+            :data="data"
+            max-height="200"
+            border
+            size="small"
+            style="width: 100%"
+            @selection-change="selectGoodsChange"
+          >
+            <el-table-column
+              align="center"
+              width="80"
+            >
+            <template #header>
+                <el-checkbox :value="true"></el-checkbox>全选
+            </template>
+            <template #default="scope">
+                <el-checkbox :value="true" @click="handleChecked(scope.row)"></el-checkbox>
+            </template>
+            </el-table-column>
+            <el-table-column
+              align="center"
+              prop=""
+              label="配送员姓名"
+              width="100"
+            >
+            </el-table-column>
+            <el-table-column
+              align="center"
+              prop=""
+              label="配送上限"
+              width="100"
+            >
+            </el-table-column>
+            <el-table-column
+              align="center"
+              prop=""
+              label="最少配送量"
+              width="100"
+            >
+            </el-table-column>
+            <el-table-column
+              align="center"
+              prop=""
+              label="配送工具"
+              width="100"
+            >
+            </el-table-column>
+          </el-table>
+        </el-form>
+        <template #footer>
+          <span class="dialog-footer">
+            <el-button @click="dialogFormAssign = false">取 消</el-button>
+            <el-button type="primary" @click="dialogFormAssign = false"
+              >保 存</el-button
+            >
+          </span>
+        </template>
+      </el-dialog>
+    </el-card> </Layout
+  >
+</template>
+<script>
+import Layout from "../layout/index.vue";
+// import { getActivity } from "../../../service/Groupmeal/groupmeal";
+export default {
+  name: "Distrib",
+  components: {
+    Layout,
+  },
+  data() {
+    return {
+      rules: {
+        name: [{ required: true, message: "请输入活动名称", trigger: "blur" }],
+        limit: [
+          { required: true, message: "请填写配送上限", trigger: "blur" },
+          //   { type: "number", message: "请填写数值哦", trigger: "change" },
+        ],
+        minvolume: [
+          { type: "number", message: "请填写数值哦", trigger: "change" },
+        ],
+      },
+      dialogFormAdd: false,
+    //   列表
+    distribList: [],
+      // 添加配送员弹框
+      addDistrib: {
+        name: "",
+        limit: "", //配送上限
+        minvolume: "", //最小配送量
+        tool: [], //配送工具
+      },
+      //分配配送员弹框
+      dialogFormAssign: false,
+      assignDistrib: {
+          name:"",
+          people:""
+      },
+      courier:[],//配送员
+    };
+  },
+  methods: {
+    selectGoodsChange() {
+      //   this.ruleForm.goods_spu_id = e.map((item) => item.goods_sku_id);
+    },
+    // 获取主页列表
+    async getDistribList() {
+        try {
+        //   const res = await getDistribList()
+        //   this.distribList = res.result
+        this.distribList =[{
+            name: "你大哥",
+            number: "5",
+            people: [{id:"2",name:"张三"},{id:"2",name:"张ba"}]
+        }]
+        } catch (error) {
+            console.log(error);
+        }
+    },
+    // 修改
+    handleModify(row) {
+        this.dialogFormAssign = true
+        const {name, people} = row
+        this.assignDistrib.name = name
+        this.assignDistrib.people = people
+    },
+    // 选则项
+    handleChecked(row){
+        console.log(row)
+    },
+    // 活动名称列表
+    async getActivity() {
+    //   try {
+    //     const res = await getActivity();
+    //     this.addDistrib.name = res.result;
+    //   } catch (error) {
+    //     console.log(error);
+    //   }
+    },
+  },
+  created() {
+    this.getDistribList()
+    this.getActivity()
+}
+};
+</script>
+<style lang="less" src="./index.less" scope>
+</style>
\ No newline at end of file

src/pages/Groupmeal/components/PageHeader/User.vue

+<template>
+  <el-dropdown>
+    <div class="user-info">
+      <el-avatar
+        :src="userInfo.avatar || DEFAULT_AVATAR"
+        size="small"
+      ></el-avatar>
+      <span class="user-name">{{userInfo.name}}</span>
+    </div>
+    <template #dropdown>
+      <el-dropdown-menu>
+        <el-dropdown-item>
+          <i class="el-icon-message"></i>
+          {{userInfo.email}}
+        </el-dropdown-item>
+        <el-dropdown-item>
+          <span><a
+              class="link"
+              href="//pandora.yidian-inc.com/"
+            >返回pandora工具平台</a></span>
+        </el-dropdown-item>
+      </el-dropdown-menu>
+    </template>
+  </el-dropdown>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import { HEADER_CONFIG } from '@/config/pageconfig';
+
+export default {
+  computed: mapState({
+    userInfo: state => (state.userInfo || {}),
+  }),
+
+  data () {
+    return {
+      DEFAULT_AVATAR: HEADER_CONFIG.miscellaneous.defaultAvatar,
+    };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.user-info {
+  display: flex;
+  align-items: center;
+}
+
+.user-name {
+  margin-left: 12px;
+  color: #fff;
+}
+</style>

src/pages/Groupmeal/components/PageHeader/config.js

+const headerConfig = [
+  {
+    name: "订单管理",
+    path: "/op/groupmeal/distrib"
+  },
+  {
+    path: '/op/groupmeal/distrib',
+    name: '配送员管理'
+  },
+
+];
+
+export default headerConfig;
\ No newline at end of file

src/pages/Groupmeal/components/PageHeader/index.vue

+<template>
+  <div id="pageheader">
+    <div class="line"></div>
+    <el-menu
+      class="header-menu"
+      mode="horizontal"
+      :router="true"
+      background-color="#545c64"
+      text-color="#fff"
+      :default-active="activeMenu"
+      active-text-color="#ffd04b"
+      unique-opened
+    >
+      <el-menu-item
+        v-for="item in headerConfig"
+        :index="item.path"
+        :key="item.path"
+      >
+        {{ item.name }}
+      </el-menu-item>
+      <el-menu-item
+        key="usermenu"
+        class="user-menu"
+      >
+        <user></user>
+      </el-menu-item>
+    </el-menu>
+  </div>
+</template>
+
+<script>
+import headerConfig from "./config";
+import User from "./User.vue";
+
+export default {
+  name: "PageHeader",
+  components: {
+    User
+  },
+  data () {
+    return {
+      headerConfig
+    };
+  },
+  computed: {
+    activeMenu () {
+      return this.$route.path;
+    }
+  },
+  beforeMount () { },
+  methods: {}
+};
+</script>
+
+<style lang="less">
+</style>

src/pages/Groupmeal/layout/index.less

+.layout {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+}
+
+.main {
+	flex: 1;
+}

src/pages/Groupmeal/layout/index.vue

+<template>
+  <div class="layout">
+    <!-- 页面公共 header -->
+    <page-header class="page-header"></page-header>
+
+    <!-- 页面主体部分 -->
+    <div class="main">
+      <slot></slot>
+    </div>
+
+  </div>
+</template>
+<script>
+import PageHeader from '../components/PageHeader';
+
+export default {
+  components: { PageHeader },
+};
+</script>
+
+<style lang="less" src="./index.less"></style>

src/router/Groupmeal/index.js

+/**
+ * 商品列表管理
+ */
+ const groupmealRouters = [
+    {
+      path: "/op/groupmeal",
+      redirect: "/op/groupmeal/distrib"
+    },
+    {
+      path: "/op/groupmeal/distrib",
+      name: "Distrib",
+      component: () => import(/* webpackChunkName: "goods" */ "@/pages/Groupmeal/Distrib")
+    },
+  ];
+  
+  export default groupmealRouters;
+  
\ No newline at end of file