班组班次

src/api/workforceManagement/classes.js

@@ -0,0 +1,30 @@
+import request from '@/utils/request';
+// 保存班组
+export async function saveteamtime(data) {
+    const res = await request.post(`/main/teamtime/save`, data);
+    if (res.data.code == 0) {
+        return res.data.message;
+    }
+    return Promise.reject(new Error(res.data.message));
+}
+// 列表
+export async function getteamtime(data) {
+    const res = await request.get(`/main/teamtime/page`, {
+        params: data
+    });
+    console.log(res.data.code == 0)
+    if (res.data.code == 0) {
+        return res.data.data;
+    }
+    return Promise.reject(new Error(res.data.message));
+}
+// 删除
+export async function deleteteamtime(data) {
+    const res = await request.delete(`/main/teamtime/delete`, {
+        data
+    });
+    if (res.data.code == 0) {
+        return res.data.message;
+    }
+    return Promise.reject(new Error(res.data.message));
+}

src/api/workforceManagement/team.js

@@ -0,0 +1,74 @@
+import request from '@/utils/request';
+// 获取工厂下的所有车间
+export async function listWorkshopByParentId(params) {
+    const res = await request.get(`/main/factoryarea/listWorkshopByParentId/` + params, {});
+    if (res.data.code == 0) {
+        return res.data.data;
+    }
+    return Promise.reject(new Error(res.data.message));
+}
+// 获取车间下的所有产线
+export async function listFactoryLineByParentId(params) {
+    const res = await request.get(`/main/factoryarea/listFactoryLineByParentId/` + params, {});
+    if (res.data.code == 0) {
+        return res.data.data;
+    }
+    return Promise.reject(new Error(res.data.message));
+}
+// 获取产线下的所有工位
+export async function listByProductionLineId(params) {
+    const res = await request.get(`/main/factoryworkstation/listByProductionLineId/` + params, {});
+    if (res.data.code == 0) {
+        return res.data.data;
+    }
+    return Promise.reject(new Error(res.data.message));
+}
+// 保存班组
+export async function saveteam(data) {
+    const res = await request.post(`/main/team/save`, data);
+    if (res.data.code == 0) {
+        return res.data.message;
+    }
+    return Promise.reject(new Error(res.data.message));
+}
+// 列表
+export async function getteampage(data) {
+    const res = await request.get(`/main/team/page`, {
+        params: data
+    });
+    console.log(res.data.code == 0)
+    if (res.data.code == 0) {
+        return res.data.data;
+    }
+    return Promise.reject(new Error(res.data.message));
+}
+// 删除
+export async function deleteteam(data) {
+    const res = await request.delete(`/main/team/delete`, {
+        data
+    });
+    if (res.data.code == 0) {
+        return res.data.message;
+    }
+    return Promise.reject(new Error(res.data.message));
+}
+// 班次下拉列表
+export async function getPullDown(data) {
+    const res = await request.get(`/main/teamtime/pullDown`, {
+        params: data
+    });
+    console.log(res.data.code == 0)
+    if (res.data.code == 0) {
+        return res.data.data;
+    }
+    return Promise.reject(new Error(res.data.message));
+}
+// 设置班次
+export async function settingTeamTime(data) {
+    const res = await request.post(`/main/team/settingTeamTime`, data);
+    console.log(res.data.code == 0)
+    if (res.data.code == 0) {
+        return res.data.message;
+    }
+    return Promise.reject(new Error(res.data.message));
+}

src/views/workforceManagement/classes/components/edit.vue

@@ -0,0 +1,187 @@
+<!-- 用户编辑弹窗 -->
+<template>
+  <el-dialog
+    class="ele-dialog-form"
+    :title="title"
+    :visible.sync="visible"
+    :before-close="handleClose"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    width="1200px"
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-card
+        shadow="never"
+        header="基本信息"
+        body-style="padding: 22px 22px 0 22px;"
+      >
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="编码:" prop="code" style="margin-bottom: 22px">
+              <el-input
+                clearable
+                :maxlength="20"
+                v-model="form.code"
+                placeholder="请输入"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item
+              label="班次名称:"
+              prop="name"
+              style="margin-bottom: 22px"
+            >
+              <el-input
+                clearable
+                :maxlength="20"
+                v-model="form.name"
+                placeholder="请输入"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item
+              label="日工作时长:"
+              prop="totalWorkHour"
+              style="margin-bottom: 22px"
+            >
+              {{ form.totalWorkHour }}
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-card>
+      <el-card
+        shadow="never"
+        header="工作时间段"
+        body-style="padding: 22px 22px 0 22px;"
+      >
+        <timeTable ref="timeTable" @timeAll="gettimeAll"></timeTable>
+      </el-card>
+    </el-form>
+    <template v-slot:footer>
+      <el-button @click="handleClose">取消</el-button>
+      <el-button type="primary" :loading="loading" @click="save">
+        保存
+      </el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script>
+import { saveteamtime } from '@/api/workforceManagement/classes';
+import timeTable from './timeTable.vue';
+export default {
+  components: {
+    timeTable
+  },
+  data() {
+    const defaultForm = {
+      id: '',
+      code: '',
+      name: '',
+      totalWorkHour: '',
+      details: []
+    };
+    return {
+      defaultForm,
+      // 表单数据
+      form: { ...defaultForm },
+      // 表单验证规则
+      rules: {
+        code: [{ required: true, message: '请输入', trigger: 'blur' }],
+        name: [{ required: true, message: '请输入', trigger: 'blur' }]
+      },
+      visible: false,
+      type: '', // add/edit
+      loading: false,
+      options: {
+        workshopId: [],
+        productionLineId: [],
+        workStationId: []
+      }
+    };
+  },
+  computed: {
+    title() {
+      switch (this.type) {
+        case 'add':
+          return '新增班次';
+          break;
+        case 'edit':
+          return '新增班次';
+          break;
+        default:
+          break;
+      }
+    }
+  },
+  created() {},
+  methods: {
+    open(type, row) {
+      this.type = type;
+      this.visible = true;
+      if (type == 'edit') {
+        for (const key of Object.keys(this.form)) {
+          if (row[key]) {
+            this.form[key] = row[key];
+          }
+        }
+        this.$nextTick(() => {
+          // 反显时间段
+          this.$refs.timeTable.form.datasource = row.details;
+        });
+      }
+    },
+    /* 保存编辑 */
+    save() {
+      this.$refs.form.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+
+        if (this.type == 'add') {
+          delete this.form.id;
+        }
+        this.$refs.timeTable.verification().then((res) => {
+          this.loading = true;
+          this.form.details = this.$refs.timeTable.form.datasource;
+          console.log(this.form);
+          saveteamtime(this.form)
+            .then((msg) => {
+              this.loading = false;
+              this.$message.success(msg);
+              this.handleClose();
+              this.$emit('done');
+            })
+            .catch((e) => {
+              this.loading = false;
+              this.$message.error(e.message);
+            });
+        });
+      });
+    },
+    // 重置表单
+    restForm() {
+      this.$refs.form.clearValidate();
+      this.form = { ...this.defaultForm };
+    },
+    handleClose() {
+      this.restForm();
+      this.$refs.timeTable.restTable();
+      this.visible = false;
+    },
+    gettimeAll(val) {
+      this.form.totalWorkHour = val;
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+.location-warp {
+  display: flex;
+  .detail {
+    margin-left: 10px;
+  }
+}
+</style>

src/views/workforceManagement/classes/components/timeTable.vue

@@ -0,0 +1,270 @@
+<template>
+  <el-form ref="form" :model="form" :rules="rules">
+    <ele-pro-table
+      ref="table"
+      :needPage="false"
+      :columns="columns"
+      :datasource="form.datasource"
+      cache-key="systemRoleTable"
+    >
+      <!-- 表头工具栏 -->
+      <template v-slot:toolbar>
+        <el-button
+          size="small"
+          type="primary"
+          icon="el-icon-plus"
+          class="ele-btn-icon"
+          @click="handlAdd"
+        >
+          新增
+        </el-button>
+      </template>
+      <template v-slot:name="scope">
+        <el-form-item
+          style="margin-bottom: 20px"
+          :prop="'datasource.' + scope.$index + '.name'"
+          :rules="{
+            required: true,
+            message: '请输入',
+            trigger: 'change'
+          }"
+        >
+          <el-input v-model="scope.row.name" placeholder="请输入"></el-input>
+        </el-form-item>
+      </template>
+      <template v-slot:startTime="scope">
+        <el-form-item
+          style="margin-bottom: 20px"
+          :prop="'datasource.' + scope.$index + '.startTime'"
+          :rules="{
+            required: true,
+            message: '请输入',
+            trigger: 'change'
+          }"
+        >
+          <el-time-picker
+            style="width: 100%"
+            placeholder="起始时间"
+            v-model="scope.row.startTime"
+            format="HH:mm"
+            value-format="HH:mm:ss"
+            :picker-options="{
+              selectableRange: setStartTime(scope)
+            }"
+          >
+          </el-time-picker>
+        </el-form-item>
+      </template>
+      <template v-slot:endTime="scope">
+        <el-form-item
+          style="margin-bottom: 20px"
+          :prop="'datasource.' + scope.$index + '.endTime'"
+          :rules="{
+            required: true,
+            message: '请输入',
+            trigger: 'change'
+          }"
+        >
+          <el-time-picker
+            style="width: 100%"
+            format="HH:mm"
+            value-format="HH:mm:ss"
+            placeholder="结束时间"
+            v-model="scope.row.endTime"
+            :picker-options="{
+              selectableRange: setEndTime(scope)
+            }"
+          >
+          </el-time-picker>
+        </el-form-item>
+      </template>
+      <template v-slot:isFirst="scope">
+        {{ scope.row.isFirst ? '是' : '否' }}
+      </template>
+      <template v-slot:workHour="scope">
+        {{ getHour(scope.row) }}
+      </template>
+      <!-- 操作列 -->
+      <template v-slot:action="{ row }">
+        <el-popconfirm
+          class="ele-action"
+          title="确定要删除此角色吗？"
+          @confirm="remove(row)"
+        >
+          <template v-slot:reference>
+            <el-link type="danger" :underline="false" icon="el-icon-delete">
+              删除
+            </el-link>
+          </template>
+        </el-popconfirm>
+
+        <el-link
+          type="primary"
+          :underline="false"
+          v-if="!row.isLeader"
+          @click="setFirst(row)"
+        >
+          设为首班
+        </el-link>
+      </template>
+    </ele-pro-table>
+    <!-- <el-button @click="verification">ada</el-button> -->
+  </el-form>
+</template>
+<script>
+export default {
+  data() {
+    const defaultForm = {
+      id: null,
+      endTime: '',
+      isFirst: 0,
+      name: '',
+      startTime: '',
+      workHour: ''
+    };
+    return {
+      defaultForm,
+      form: {
+        datasource: []
+      },
+      rules: {},
+      columns: [
+        {
+          width: 45,
+          type: 'index',
+          columnKey: 'index',
+          align: 'center'
+        },
+        {
+          prop: 'name',
+          label: '时段名称',
+          slot: 'name'
+        },
+        {
+          prop: 'startTime',
+          label: '上班时间',
+          slot: 'startTime'
+        },
+        {
+          prop: 'endTime',
+          label: '下班时间',
+          slot: 'endTime'
+        },
+        {
+          prop: 'workHour',
+          label: '工作时数',
+          slot: 'workHour'
+        },
+        {
+          prop: 'isFirst',
+          label: '是否当日首班',
+          slot: 'isFirst'
+        },
+        {
+          columnKey: 'action',
+          label: '操作',
+          width: 220,
+          align: 'center',
+          resizable: false,
+          slot: 'action',
+          showOverflowTooltip: true
+        }
+      ]
+    };
+  },
+  methods: {
+    remove(row) {
+      console.log(row);
+      let index = this.form.datasource.findIndex((n) => n.id == row.id);
+      if (index !== -1) {
+        this.form.datasource.splice(index, 1);
+        this.setSort();
+      }
+    },
+    // 清空表格
+    restTable() {
+      this.form.datasource = [];
+    },
+    // 重新排序
+    setSort() {
+      this.form.datasource.forEach((n, index) => {
+        n.id = index + 1;
+      });
+    },
+    // 添加
+    handlAdd() {
+      let item = JSON.parse(JSON.stringify(this.defaultForm));
+      item.id = this.form.datasource.length + 1;
+      this.form.datasource.push(item);
+    },
+    // 设为首班
+    setFirst(row) {
+      this.form.datasource.forEach((n) => {
+        n.isFirst = 0;
+      });
+      row.isFirst = 1;
+    },
+    setStartTime(scope) {
+      if (scope.$index > 0) {
+        let Pitem = this.form.datasource[scope.$index - 1];
+        if (Pitem.endTime) {
+          return `${Pitem.endTime} - 23:59:59`;
+        } else {
+          return '00:00:00 - 23:59:59';
+        }
+      }
+      return '00:00:00 - 23:59:59';
+    },
+    setEndTime(scope) {
+      if (scope.row.startTime) {
+        return `${scope.row.startTime} - 23:59:59`;
+      } else {
+        return '00:00:00 - 23:59:59';
+      }
+    },
+    // 计算小时
+    getHour(row) {
+      let s1 = row.startTime;
+      let s2 = row.endTime;
+      let result = 0;
+      if (!s1 || !s2) {
+        result = 0;
+      }
+      var reDate = /\d{4}-\d{1,2}-\d{1,2} /;
+      s1 = new Date(
+        (reDate.test(s1) ? s1 : '2018-1-1 ' + s1).replace(/-/g, '/')
+      );
+      s2 = new Date(
+        (reDate.test(s2) ? s2 : '2018-1-1 ' + s2).replace(/-/g, '/')
+      );
+      var ms = s2.getTime() - s1.getTime();
+      if (ms < 0) return 0;
+      result = Math.floor(ms / 1000 / 60 / 60); //小时
+      row.workHour = result;
+      this.$emit('timeAll', this.gettimeAll());
+      return result;
+    },
+    // 获取工作日时常
+    gettimeAll() {
+      let result = 0;
+      this.form.datasource.forEach((n) => {
+        result += n.workHour;
+      });
+      return result;
+    },
+    verification() {
+      return new Promise((resolve, reject) => {
+        this.$refs.form.validate((valid) => {
+          if (!valid) {
+            reject();
+            return false;
+          }
+          resolve();
+        });
+      });
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+</style>

src/views/workforceManagement/classes/index.vue

@@ -0,0 +1,134 @@
+<template>
+  <div class="ele-body">
+    <el-card shadow="never">
+      <ele-pro-table
+        ref="table"
+        :columns="columns"
+        :datasource="datasource"
+        cache-key="systemRoleTable"
+      >
+        <!-- 表头工具栏 -->
+        <template v-slot:toolbar>
+          <el-button
+            size="small"
+            type="primary"
+            icon="el-icon-plus"
+            class="ele-btn-icon"
+            @click="openEdit('add')"
+          >
+            新建
+          </el-button>
+        </template>
+        <!-- 操作列 -->
+        <template v-slot:action="{ row }">
+          <el-link
+            type="primary"
+            :underline="false"
+            icon="el-icon-edit"
+            @click="openEdit('edit', row)"
+          >
+            修改
+          </el-link>
+          <el-popconfirm
+            class="ele-action"
+            title="确定要删除此角色吗？"
+            @confirm="remove(row)"
+          >
+            <template v-slot:reference>
+              <el-link type="danger" :underline="false" icon="el-icon-delete">
+                删除
+              </el-link>
+            </template>
+          </el-popconfirm>
+        </template>
+      </ele-pro-table>
+    </el-card>
+    <edit ref="edit" @done="done"></edit>
+  </div>
+</template>
+<script>
+import edit from './components/edit.vue';
+import { getteamtime, deleteteamtime } from '@/api/workforceManagement/classes';
+export default {
+  components: {
+    edit
+  },
+  data() {
+    return {
+      columns: [
+        {
+          width: 45,
+          type: 'index',
+          columnKey: 'index',
+          align: 'center'
+        },
+        {
+          prop: 'code',
+          label: '班次编号'
+        },
+        {
+          label: '班次名称',
+          prop: 'name'
+        },
+        {
+          label: '创建人',
+          prop: 'createUserName'
+        },
+        {
+          label: '创建时间',
+          prop: 'createTime'
+        },
+        {
+          columnKey: 'action',
+          label: '操作',
+          width: 220,
+          align: 'center',
+          resizable: false,
+          slot: 'action',
+          showOverflowTooltip: true
+        }
+      ],
+      dict: {
+        enabled: {
+          1: '生效',
+          0: '未生效'
+        },
+        groupId: []
+      }
+    };
+  },
+  methods: {
+    datasource({ page, where, limit }) {
+      let data = getteamtime({
+        ...where,
+        pageNum: page,
+        size: limit
+      });
+      console.log(data);
+      return data;
+    },
+    openEdit(type, row) {
+      this.$refs.edit.open(type, row);
+    },
+    remove(row) {
+      let par = [row.id];
+      deleteteamtime(par)
+        .then((message) => {
+          this.$message.success(message);
+          this.done();
+        })
+        .catch((e) => {
+          this.$message.error(e.message);
+        });
+    },
+    done() {
+      this.$refs.table.reload({
+        page: 1
+      });
+    },
+    openclass() {
+      this.$refs.setclasses.open();
+    }
+  }
+};
+</script>

src/views/workforceManagement/team/components/edit.vue

@@ -0,0 +1,315 @@
+<!-- 用户编辑弹窗 -->
+<template>
+  <el-dialog
+    class="ele-dialog-form"
+    :title="title"
+    :visible.sync="visible"
+    :before-close="handleClose"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    width="1000px"
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-card
+        shadow="never"
+        header="基本信息"
+        body-style="padding: 22px 22px 0 22px;"
+      >
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="编码:" prop="code" style="margin-bottom: 22px">
+              <el-input
+                clearable
+                :maxlength="20"
+                v-model="form.code"
+                placeholder="请输入"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="名称:" prop="name" style="margin-bottom: 22px">
+              <el-input
+                clearable
+                :maxlength="20"
+                v-model="form.name"
+                placeholder="请输入"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item
+              label="车间:"
+              prop="workshopId"
+              style="margin-bottom: 22px"
+            >
+              <el-select
+                v-model="form.workshopId"
+                @change="change_workshopId"
+                placeholder="请选择"
+                style="width: 100%"
+              >
+                <el-option
+                  v-for="item in options.workshopId"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8" style="margin-bottom: 22px">
+            <el-form-item label="产线:" prop="productionLineId">
+              <el-select
+                v-model="form.productionLineId"
+                @change="change_productionLineId"
+                placeholder="请选择"
+                style="width: 100%"
+              >
+                <el-option
+                  v-for="item in options.productionLineId"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8" style="margin-bottom: 22px">
+            <el-form-item label="工站:" prop="workStationIds">
+              <div class="location-warp">
+                <el-select
+                  v-model="form.workStationIds"
+                  multiple
+                  placeholder="请选择"
+                  style="width: 100%"
+                >
+                  <el-option
+                    v-for="item in options.workStationIds"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  >
+                  </el-option>
+                </el-select>
+              </div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-card>
+      <el-card
+        shadow="never"
+        header="员工配置"
+        body-style="padding: 22px 22px 0 22px;"
+      >
+        <userTable ref="userTable"></userTable>
+      </el-card>
+    </el-form>
+    <template v-slot:footer>
+      <el-button @click="handleClose">取消</el-button>
+      <el-button type="primary" :loading="loading" @click="save">
+        保存
+      </el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script>
+import {
+  listWorkshopByParentId,
+  listFactoryLineByParentId,
+  listByProductionLineId,
+  saveteam
+} from '@/api/workforceManagement/team';
+import userTable from './userTable.vue';
+export default {
+  components: {
+    userTable
+  },
+  data() {
+    const defaultForm = {
+      id: '',
+      code: '',
+      leaderUserId: '',
+      name: '',
+      productionLineId: '',
+      userIds: '',
+      userNumber: '',
+      workStationIds: [],
+      workshopId: ''
+    };
+    return {
+      defaultForm,
+      // 表单数据
+      form: { ...defaultForm },
+      // 表单验证规则
+      rules: {
+        code: [{ required: true, message: '请输入', trigger: 'blur' }],
+        name: [{ required: true, message: '请输入', trigger: 'blur' }],
+        workshopId: [{ required: true, message: '请输入', trigger: 'change' }],
+        productionLineId: [
+          { required: true, message: '请输入', trigger: 'change' }
+        ]
+      },
+      visible: false,
+      type: '', // add/edit
+      loading: false,
+      options: {
+        workshopId: [],
+        productionLineId: [],
+        workStationIds: []
+      }
+    };
+  },
+  computed: {
+    title() {
+      switch (this.type) {
+        case 'add':
+          return '新增班组';
+          break;
+        case 'edit':
+          return '编辑班组';
+          break;
+        default:
+          break;
+      }
+    }
+  },
+  created() {
+    this.getlistWorkshopByParentId();
+  },
+  methods: {
+    async open(type, row) {
+      this.type = type;
+      this.visible = true;
+      if (type == 'edit') {
+        for (const key of Object.keys(this.form)) {
+          if (row[key]) {
+            this.form[key] = row[key];
+          }
+        }
+        // 工位反显
+        if (row.workStationList.length > 0) {
+          this.form.workStationIds = row.workStationList.map(
+            (n) => n.workstationId
+          );
+        }
+        // 人员反显
+        this.$nextTick(() => {
+          this.$refs.userTable.confirmStaffSelection(row.userVOList);
+          // 班组长
+          this.$refs.userTable.setLeaderId(row.leaderUserId);
+        });
+
+        // 获取下拉列表
+        await this.getlistWorkshopByParentId();
+        await this.getlistFactoryLineByParentId();
+        this.getlistByProductionLineId();
+      }
+    },
+    /* 保存编辑 */
+    save() {
+      this.$refs.form.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        this.loading = true;
+        let userIds = this.$refs.userTable.datasource.map((n) => n.id);
+        if (userIds.length <= 0) {
+          this.$message.error('请选择员工');
+          return false;
+        }
+
+        let par = this.form;
+        par.userIds = userIds;
+        par.leaderUserId = this.$refs.userTable.getTwi();
+        par.userNumber = par.userIds.length;
+        if (this.type == 'add') {
+          delete par.id;
+        }
+        saveteam(par)
+          .then((msg) => {
+            this.$message.success(msg);
+            this.handleClose();
+            this.$emit('done');
+          })
+          .catch((e) => {
+            this.$message.error(e.message);
+          })
+          .finally(() => {
+            this.loading = false;
+          });
+      });
+    },
+    // 重置表单
+    restForm() {
+      this.$refs.form.clearValidate();
+      this.form = { ...this.defaultForm };
+    },
+    handleClose() {
+      this.restForm();
+      this.$refs.userTable.restTable();
+      this.visible = false;
+    },
+    // 获取车间
+    getlistWorkshopByParentId() {
+      let par = this.$store.state.user.info.factoryId;
+      return listWorkshopByParentId(par).then((res) => {
+        this.options.workshopId = res.map((n) => {
+          return {
+            value: n.id,
+            label: n.name
+          };
+        });
+      });
+    },
+    // 获取产线
+    getlistFactoryLineByParentId() {
+      let par = this.form.workshopId;
+      return listFactoryLineByParentId(par).then((res) => {
+        this.options.productionLineId = res.map((n) => {
+          return {
+            value: n.id,
+            label: n.name
+          };
+        });
+      });
+    },
+    // 获取工位
+    getlistByProductionLineId() {
+      let par = this.form.productionLineId;
+      return listByProductionLineId(par).then((res) => {
+        this.options.workStationIds = res.map((n) => {
+          return {
+            value: n.id,
+            label: n.name
+          };
+        });
+      });
+    },
+    // 选择车间
+    change_workshopId() {
+      this.form.productionLineId = '';
+      this.form.workStationIds = '';
+      this.options.productionLineId = [];
+      this.options.workStationIds = [];
+      this.getlistFactoryLineByParentId();
+    },
+    // 选择产线
+    change_productionLineId() {
+      this.form.workStationIds = '';
+      this.options.workStationIds = [];
+      this.getlistByProductionLineId();
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+.location-warp {
+  display: flex;
+  .detail {
+    margin-left: 10px;
+  }
+}
+</style>

src/views/workforceManagement/team/components/setclasses.vue

@@ -0,0 +1,109 @@
+<!-- 用户编辑弹窗 -->
+<template>
+  <el-dialog
+    class="ele-dialog-form"
+    :title="'设置班次'"
+    :visible.sync="visible"
+    :before-close="handleClose"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    width="500px"
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-form-item label="班次" prop="code" style="margin-bottom: 22px">
+        <el-select v-model="form.teamTimeDetailId" placeholder="请选择">
+          <el-option
+            v-for="item in options"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
+    </el-form>
+    <template v-slot:footer>
+      <el-button @click="handleClose">取消</el-button>
+      <el-button type="primary" :loading="loading" @click="save">
+        保存
+      </el-button>
+    </template>
+  </el-dialog>
+</template>
+  
+  <script>
+import { getPullDown, settingTeamTime } from '@/api/workforceManagement/team';
+export default {
+  data() {
+    const defaultForm = {
+      teamIds: [],
+      teamTimeDetailId: ''
+    };
+    return {
+      defaultForm,
+      // 表单数据
+      form: { ...defaultForm },
+      // 表单验证规则
+      rules: {
+        teamTimeDetailId: [
+          { required: true, message: '请输入', trigger: 'blur' }
+        ]
+      },
+      visible: false,
+      loading: false,
+      options: []
+    };
+  },
+  methods: {
+    async open(row) {
+      this.visible = true;
+      this.form.teamIds = row;
+      this.getPullDown();
+    },
+    /* 保存编辑 */
+    save() {
+      this.$refs.form.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        this.loading = true;
+        settingTeamTime(this.form)
+          .then((msg) => {
+            this.$message.success(msg);
+            this.handleClose();
+            this.$emit('done');
+          })
+          .catch((e) => {
+            this.$message.error(e.message);
+          })
+          .finally(() => {
+            this.loading = false;
+          });
+      });
+    },
+    // 重置表单
+    restForm() {
+      this.$refs.form.clearValidate();
+      this.form = { ...this.defaultForm };
+    },
+    handleClose() {
+      this.restForm();
+      this.visible = false;
+    },
+    getPullDown() {
+      getPullDown().then((res) => {
+        this.options = res;
+      });
+    }
+  }
+};
+</script>
+  <style lang="scss" scoped>
+.location-warp {
+  display: flex;
+  .detail {
+    margin-left: 10px;
+  }
+}
+</style>
+  

src/views/workforceManagement/team/components/staffSelection.vue

@@ -0,0 +1,338 @@
+<template>
+  <div class="container">
+    <!-- 单据弹窗 -->
+    <el-dialog
+      title="员工"
+      :before-close="handleClose"
+      :visible.sync="dialogVisible"
+      :close-on-click-modal="false"
+      :append-to-body="true"
+      width="80%"
+    >
+      <el-row class="zw-page">
+        <el-col :span="6" class="zw-page-left">
+          <el-card>
+            <div class="zw-card-header" slot="header">
+              <span class="zw-header-title details-title">部门</span>
+            </div>
+            <div class="zw-page-left-tree">
+              <el-container class="zw-container">
+                <el-tree
+                  ref="tree"
+                  :data="treeList"
+                  highlight-current
+                  node-key="id"
+                  :props="{ label: 'name' }"
+                  :expand-on-click-node="false"
+                  :default-expand-all="true"
+                  @node-click="handleNodeClick"
+                >
+                </el-tree>
+              </el-container>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="9" class="zw-page-main">
+          <el-card>
+            <div class="zw-card-header" slot="header">
+              <span class="zw-header-title details-title">员工明细</span>
+            </div>
+            <div class="zw-page-main-list">
+              <el-container class="zw-container">
+                <el-table
+                  :data="staffList"
+                  tooltip-effect="dark"
+                  style="width: 100%"
+                  :header-cell-style="{
+                    background: '#F0F3F3',
+                    border: 'none'
+                  }"
+                >
+                  <el-table-column prop="code" label="姓名">
+                    <template slot-scope="{ row }">
+                      <div>{{ row.name }}</div>
+                    </template>
+                  </el-table-column>
+                  <el-table-column label="工号">
+                    <template slot-scope="{ row }">
+                      <div>{{ row.jobNumber }}</div>
+                    </template>
+                  </el-table-column>
+                  <el-table-column width="80" label="操作">
+                    <template slot-scope="{ row }">
+                      <el-button
+                        size="mini"
+                        type="primary"
+                        @click="choiceAsset(row)"
+                        :disabled="row.disabled"
+                        icon="el-icon-arrow-right"
+                        circle
+                      >
+                      </el-button>
+                    </template>
+                  </el-table-column>
+                </el-table>
+                <div
+                  v-if="staffList.length !== 0 && isMore"
+                  class="zw-page-list-more"
+                >
+                  <el-link @click="getMore(page)" type="primary"
+                    >更多<i class="el-icon-caret-bottom"></i>
+                  </el-link>
+                </div>
+              </el-container>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="9" class="zw-page-right">
+          <el-card>
+            <div class="zw-card-header" slot="header">
+              <span class="zw-header-title">已选员工</span>
+            </div>
+            <div class="zw-page-right-list">
+              <el-container class="zw-container">
+                <el-table
+                  :data="selectStafflist"
+                  tooltip-effect="dark"
+                  style="width: 100%"
+                  :header-cell-style="{
+                    background: '#F0F3F3',
+                    border: 'none'
+                  }"
+                >
+                  <el-table-column prop="code" label="姓名">
+                    <template slot-scope="{ row }">
+                      <div>{{ row.name }}</div>
+                    </template>
+                  </el-table-column>
+                  <el-table-column label="工号">
+                    <template slot-scope="{ row }">
+                      <div>{{ row.jobNumber }}</div>
+                    </template>
+                  </el-table-column>
+                  <el-table-column width="80" label="操作">
+                    <template slot-scope="scope">
+                      <el-button
+                        @click="deleteSelectStaff(scope.row, scope.$index)"
+                        size="mini"
+                        type="danger"
+                        >删除
+                      </el-button>
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </el-container>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+      <div slot="footer" class="dialog-footer">
+        <el-button size="small" @click="handleClose">关 闭</el-button>
+        <el-button size="small" @click="sumbit" type="primary">确 认</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+  <script>
+import { listOrganizations, getUserPage } from '@/api/system/organization';
+export default {
+  data() {
+    return {
+      form: {
+        groupId: null
+      },
+      treeList: [],
+      staffList: [],
+      selectStafflist: [], //已选员工
+      defaultProps: {
+        children: 'children',
+        label: 'name',
+        value: 'code'
+      },
+      pageNum: 1, //设备当前页数
+      size: 10,
+      isMore: false,
+      dialogVisible: false
+    };
+  },
+  created() {},
+  methods: {
+    open(selectedList) {
+      this.dialogVisible = true;
+      this.selectStafflist = selectedList;
+      this.getInfo();
+    },
+    //初始数据
+    async getInfo() {
+      let list = await listOrganizations();
+      this.treeList = this.$util.toTreeData({
+        data: list,
+        idField: 'id',
+        parentIdField: 'parentId'
+      });
+      //this.treeList = res.data;
+    },
+    //选择分类
+    handleNodeClick(data) {
+      this.staffList = [];
+
+      this.form.groupId = data.id;
+      let params = {
+        pageNum: 1,
+        size: this.size,
+        groupId: this.form.groupId
+      };
+      this.getStaffList(params);
+    },
+    //获取员工列表
+    async getStaffList(params) {
+      let res = await getUserPage(params);
+      let list = res.list;
+      if (list.length < res.count) {
+        this.isMore = true;
+      } else {
+        this.isMore = false;
+      }
+      list.forEach((el) => {
+        let _index = this.selectStafflist.findIndex((n) => n.id == el.id);
+        if (_index !== -1) {
+          el.disabled = true;
+        } else {
+          el.disabled = false;
+        }
+      });
+      this.staffList = [...this.staffList, ...list];
+      this.pageNum = res.pageNum;
+    },
+    //查询更多员工
+    async getMore() {
+      this.pageNum += 1;
+      let params = {
+        pageNum: 1,
+        size: this.size,
+        groupId: this.form.groupId
+      };
+      this.getStaffList(params);
+    },
+    //选择员工
+    choiceAsset(info) {
+      let data = JSON.parse(JSON.stringify(info));
+      if (info.teamId) {
+        this.$confirm('当前员工已有所属班组, 是否继续?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        })
+          .then(() => {
+            this.selectStafflist.push(data);
+            info.disabled = true;
+          })
+          .catch(() => {});
+      } else {
+        this.selectStafflist.push(data);
+        info.disabled = true;
+      }
+    },
+    //删除已选员工
+    deleteSelectStaff(info, index) {
+      this.staffList.forEach((el) => {
+        if (el.id == info.id) {
+          el.disabled = false;
+        }
+      });
+      this.selectStafflist.splice(index, 1);
+    },
+    //保存
+    sumbit() {
+      if (this.selectStafflist.length === 0) {
+        this.$message.warning('请选择员工');
+      } else {
+        this.$emit('confirm', JSON.parse(JSON.stringify(this.selectStafflist)));
+        this.handleClose();
+      }
+    },
+    handleClose() {
+      this.staffList = [];
+      this.selectStafflist = [];
+      this.dialogVisible = false;
+    }
+  }
+};
+</script>
+  
+  <style lang='scss' scoped>
+.container {
+  padding: 10px 0;
+}
+.zw-container {
+  height: 500px;
+}
+.zw-header-title {
+  display: inline-block;
+  margin-right: 10px;
+  font-weight: 600;
+}
+.details-title {
+  line-height: 32px;
+  height: 32px;
+}
+.zw-page-list-p {
+  font-size: 14px;
+  margin-bottom: 18px;
+  display: flex;
+  justify-content: space-between;
+  // align-items: center;
+  .zw-page-list-right {
+    display: flex;
+  }
+}
+.zw-page {
+  background: #fff;
+  //   padding: 20px 0;
+  .zw-page-left {
+    padding: 0 10px;
+  }
+  .zw-page-main {
+    padding: 0 10px;
+    .zw-page-main-list {
+      span {
+        margin-right: 10px;
+      }
+      .zw-page-span-num {
+        font-size: 12px;
+        color: #157a2c;
+      }
+      .zw-page-p-operation {
+        text-align: right;
+        // width: 200px;
+      }
+      .zw-page-operation-num {
+        width: 100px;
+        margin: 0 10px;
+      }
+    }
+    .zw-page-list-more {
+      text-align: center;
+    }
+  }
+  .zw-page-right {
+    .zw-card-header {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      height: 32px;
+    }
+    span {
+      margin-right: 10px;
+    }
+    .zw-page-span-num {
+      font-size: 12px;
+      color: #157a2c;
+    }
+  }
+}
+.notes {
+  font-size: 12px;
+  color: #909090;
+}
+</style>

src/views/workforceManagement/team/components/userTable.vue

@@ -0,0 +1,159 @@
+<template>
+  <div>
+    <ele-pro-table
+      ref="table"
+      :needPage="false"
+      :columns="columns"
+      :datasource="datasource"
+      cache-key="systemRoleTable"
+    >
+      <!-- 表头工具栏 -->
+      <template v-slot:toolbar>
+        <el-button
+          size="small"
+          type="primary"
+          icon="el-icon-plus"
+          class="ele-btn-icon"
+          @click="handlAdd"
+        >
+          新增
+        </el-button>
+      </template>
+      <!-- 操作列 -->
+      <template v-slot:action="{ row }">
+        <el-popconfirm
+          class="ele-action"
+          title="确定要删除此角色吗？"
+          @confirm="remove(row)"
+        >
+          <template v-slot:reference>
+            <el-link type="danger" :underline="false" icon="el-icon-delete">
+              删除
+            </el-link>
+          </template>
+        </el-popconfirm>
+
+        <el-link :underline="false" v-if="row.isLeader"> 已设为班组长 </el-link>
+        <el-link
+          type="primary"
+          :underline="false"
+          v-else
+          @click="setLeader(row)"
+        >
+          设为班组长
+        </el-link>
+      </template>
+    </ele-pro-table>
+    <staffSelection
+      ref="staffSelection"
+      @confirm="confirmStaffSelection"
+    ></staffSelection>
+  </div>
+</template>
+<script>
+import staffSelection from './staffSelection.vue';
+export default {
+  components: {
+    staffSelection
+  },
+  data() {
+    return {
+      columns: [
+        {
+          width: 45,
+          type: 'index',
+          columnKey: 'index',
+          align: 'center'
+        },
+        {
+          prop: 'name',
+          label: '姓名'
+        },
+        {
+          prop: 'jobNumber',
+          label: '工号'
+        },
+        {
+          prop: 'phone',
+          label: '电话'
+        },
+        {
+          columnKey: 'action',
+          label: '操作',
+          width: 220,
+          align: 'center',
+          resizable: false,
+          slot: 'action',
+          showOverflowTooltip: true
+        }
+      ],
+      datasource: []
+    };
+  },
+  methods: {
+    remove(row) {
+      let index = this.datasource.findIndex((n) => n.id == row.id);
+      if (index !== -1) {
+        this.datasource.splice(index, 1);
+      }
+    },
+    handlAdd() {
+      this.$refs.staffSelection.open(
+        JSON.parse(JSON.stringify(this.datasource))
+      );
+    },
+    confirmStaffSelection(data) {
+      data.forEach((element) => {
+        if (!('isLeader' in element)) {
+          // isLeader 是否为班组长
+          element.isLeader = false;
+        }
+      });
+      this.datasource = data;
+      this.setDefaultLeader();
+    },
+    // 设置默认班组长
+    setDefaultLeader() {
+      if (this.datasource.length <= 0) {
+        return;
+      }
+      let result = this.datasource.find((n) => n.isLeader == true);
+      if (!result) {
+        this.datasource[0].isLeader = true;
+      }
+    },
+    // 设置班组长
+    setLeader(row) {
+      console.log(row);
+      this.datasource.forEach((n) => {
+        n.isLeader = false;
+      });
+      row.isLeader = true;
+    },
+    // 设置班组长（id）
+    setLeaderId(id) {
+      let result = this.datasource.find((n) => id == n.id);
+
+      if (result) {
+        this.datasource.forEach((n) => {
+          n.isLeader = false;
+        });
+        result.isLeader = true;
+      }
+    },
+    // 清空表格
+    restTable() {
+      this.datasource = [];
+    },
+    // 获取班组长id
+    getTwi() {
+      let result = this.datasource.find((n) => n.isLeader == true);
+      if (result) {
+        return result.id;
+      } else {
+        return null;
+      }
+    }
+  }
+};
+</script>

src/views/workforceManagement/team/index.vue

@@ -0,0 +1,165 @@
+<template>
+  <div class="ele-body">
+    <el-card shadow="never">
+      <ele-pro-table
+        ref="table"
+        :columns="columns"
+        :datasource="datasource"
+        :selection.sync="selection"
+        cache-key="systemRoleTable"
+      >
+        <!-- 表头工具栏 -->
+        <template v-slot:toolbar>
+          <el-button
+            size="small"
+            type="primary"
+            icon="el-icon-plus"
+            class="ele-btn-icon"
+            @click="openEdit('add')"
+          >
+            新建
+          </el-button>
+          <el-button
+            size="small"
+            type="primary"
+            class="ele-btn-icon"
+            @click="openclass"
+          >
+            设置班次
+          </el-button>
+        </template>
+        <!-- 操作列 -->
+        <template v-slot:action="{ row }">
+          <el-link
+            type="primary"
+            :underline="false"
+            icon="el-icon-edit"
+            @click="openEdit('edit', row)"
+          >
+            修改
+          </el-link>
+          <el-popconfirm
+            class="ele-action"
+            title="确定要删除此角色吗？"
+            @confirm="remove(row)"
+          >
+            <template v-slot:reference>
+              <el-link type="danger" :underline="false" icon="el-icon-delete">
+                删除
+              </el-link>
+            </template>
+          </el-popconfirm>
+        </template>
+      </ele-pro-table>
+    </el-card>
+    <edit ref="edit" @done="done"></edit>
+    <setclasses ref="setclasses" @done="done"></setclasses>
+  </div>
+</template>
+<script>
+import edit from './components/edit.vue';
+import setclasses from './components/setclasses.vue';
+import { getteampage, deleteteam } from '@/api/workforceManagement/team';
+export default {
+  components: {
+    edit,
+    setclasses
+  },
+  data() {
+    return {
+      selection: [],
+      columns: [
+        {
+          width: 45,
+          type: 'selection',
+          columnKey: 'selection',
+          align: 'center'
+        },
+        {
+          width: 45,
+          type: 'index',
+          columnKey: 'index',
+          align: 'center'
+        },
+        {
+          prop: 'code',
+          label: '编码'
+        },
+        {
+          label: '名称',
+          prop: 'name'
+        },
+        {
+          label: '所属产线',
+          prop: 'productionLineName'
+        },
+        {
+          label: '关联工站',
+          prop: 'workStationNames'
+        },
+        {
+          label: '人数',
+          prop: 'userNumber'
+        },
+        {
+          label: '当前班次',
+          prop: 'teamTimeDetailName'
+        },
+        {
+          columnKey: 'action',
+          label: '操作',
+          width: 220,
+          align: 'center',
+          resizable: false,
+          slot: 'action',
+          showOverflowTooltip: true
+        }
+      ],
+      dict: {
+        enabled: {
+          1: '生效',
+          0: '未生效'
+        },
+        groupId: []
+      }
+    };
+  },
+  methods: {
+    datasource({ page, where, limit }) {
+      let data = getteampage({
+        ...where,
+        pageNum: page,
+        size: limit
+      });
+      return data;
+    },
+    openEdit(type, row) {
+      this.$refs.edit.open(type, row);
+    },
+    remove(row) {
+      let par = [row.id];
+      deleteteam(par)
+        .then((message) => {
+          this.$message.success(message);
+          this.done();
+        })
+        .catch((e) => {
+          this.$message.error(e.message);
+        });
+    },
+    done() {
+      this.$refs.table.reload({
+        page: 1
+      });
+    },
+    openclass() {
+      if (this.selection.length <= 0) {
+        this.$message.error('请选择班组');
+        return;
+      }
+      let list = this.selection.map((n) => n.id);
+      this.$refs.setclasses.open(list);
+    }
+  }
+};
+</script>