npmapps 1.0.6 → 1.0.7

package/app/components/shift/index.vue

@@ -0,0 +1,147 @@
+<template>
+  <div class="attendanceCycle" v-loading="loading">
+    <div class="header">
+      <div class="left">
+        <el-button size="mini" type="primary" @click="onSave">选择</el-button>
+      </div>
+      <div class="right">
+     
+      </div>
+    </div>
+    <el-table
+      size="mini"
+      :data="tableData"
+      style="width: 100%"
+      border
+      @row-click="handleRowClick"
+    >
+      <!-- 单选框列 -->
+      <el-table-column width="50">
+        <template slot-scope="scope">
+          <el-radio
+            :value="currentRow.monthId"
+            :label="scope.row.monthId"
+          >&nbsp;</el-radio>
+        </template>
+      </el-table-column>
+      <el-table-column prop="monthId" label="表集合"></el-table-column>
+      <el-table-column prop="monthName" label="名称"></el-table-column>
+      <el-table-column prop="monthName" label="休息班"></el-table-column>
+      <el-table-column prop="monthName" label="班段信息"></el-table-column>
+      <el-table-column prop="monthName" label="班次类型"></el-table-column>
+      <el-table-column prop="monthName" label="状态"></el-table-column>
+    </el-table>
+     <div class="footer">
+      <div class="left">
+        
+      </div>
+      <div class="right">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 30, 100]"
+          :page-size="10"
+          layout="total, sizes, prev, pager, next"
+          :total="total"
+        >
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {
+  getOpenAttendanceCycleMonthListApi,
+} from "../../employeeSchedulingManagement/data.js";
+
+export default {
+  // 班次
+  props: {
+    close: {
+      type: Function,
+      default: () => {},
+    },
+    setData:{
+        type: Function,
+        default: () => {},
+    },
+  },
+
+  data() {
+    return {
+      loading: false,
+      tableData: [],
+      year: "2025",
+      options: [],
+      currentRow: {
+        monthId: "",
+      }, // 当前选中的行
+      currentPage: 1,
+      total: 11110,
+    };
+  },
+  mounted() {
+    this.loading = false;
+    this.getTableData();
+  },
+  methods: {
+    getTableData() {
+      this.loading = true;
+      getOpenAttendanceCycleMonthListApi(this.year).then((res) => {
+        this.tableData = res;
+        console.log(res, "res");
+        this.loading = false;
+      });
+    },
+   
+    yearChange() {
+      this.getTableData();
+    },
+    handleRowClick(row) {
+      this.currentRow = row; // 点击行时更新选中状态
+    },
+    onSave() {
+        if (this.currentRow.monthId === "") {
+            return this.$message.error("请选择");
+        }
+      this.close();
+      this.setData(this.currentRow);
+    },
+    handleSizeChange(val) {
+      this.currentPage = 1;
+      this.getTableData();
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      this.getTableData();
+    },
+    
+
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.attendanceCycle {
+  .header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 10px;
+    .left {
+      display: flex;
+      align-items: center;
+    }
+    .right {
+      display: flex;
+      align-items: center;
+    }
+  }
+  .footer {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+</style>

package/app/components/shiftRotationSystem/index.vue

@@ -0,0 +1,147 @@
+<template>
+  <div class="attendanceCycle" v-loading="loading">
+    <div class="header">
+      <div class="left">
+        <el-button size="mini" type="primary" @click="onSave">选择</el-button>
+      </div>
+      <div class="right">
+     
+      </div>
+    </div>
+    <el-table
+      size="mini"
+      :data="tableData"
+      style="width: 100%"
+      border
+      @row-click="handleRowClick"
+    >
+      <!-- 单选框列 -->
+      <el-table-column width="50">
+        <template slot-scope="scope">
+          <el-radio
+            :value="currentRow.monthId"
+            :label="scope.row.monthId"
+          >&nbsp;</el-radio>
+        </template>
+      </el-table-column>
+      <el-table-column prop="monthId" label="表集合"></el-table-column>
+      <el-table-column prop="monthId" label="编码"></el-table-column>
+      <el-table-column prop="monthName" label="名称"></el-table-column>
+      <el-table-column prop="monthName" label="是否按周期排班"></el-table-column>
+      <el-table-column prop="monthName" label="周期"></el-table-column>
+      <el-table-column prop="monthName" label="生效日期"></el-table-column>
+    </el-table>
+     <div class="footer">
+      <div class="left">
+        
+      </div>
+      <div class="right">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 30, 100]"
+          :page-size="10"
+          layout="total, sizes, prev, pager, next"
+          :total="total"
+        >
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {
+  getOpenAttendanceCycleMonthListApi,
+} from "../../employeeSchedulingManagement/data.js";
+
+export default {
+  // 轮班制度
+  props: {
+    close: {
+      type: Function,
+      default: () => {},
+    },
+    setData:{
+        type: Function,
+        default: () => {},
+    },
+  },
+
+  data() {
+    return {
+      loading: false,
+      tableData: [],
+      year: "2025",
+      options: [],
+      currentRow: {
+        monthId: "",
+      }, // 当前选中的行
+      currentPage: 1,
+      total: 11110,
+    };
+  },
+  mounted() {
+    this.loading = false;
+    this.getTableData();
+  },
+  methods: {
+    getTableData() {
+      this.loading = true;
+      getOpenAttendanceCycleMonthListApi(this.year).then((res) => {
+        this.tableData = res;
+        console.log(res, "res");
+        this.loading = false;
+      });
+    },
+   
+    yearChange() {
+      this.getTableData();
+    },
+    handleRowClick(row) {
+      this.currentRow = row; // 点击行时更新选中状态
+    },
+    onSave() {
+        if (this.currentRow.monthId === "") {
+            return this.$message.error("请选择");
+        }
+      this.close();
+      this.setData(this.currentRow);
+    },
+    handleSizeChange(val) {
+      this.currentPage = 1;
+      this.getTableData();
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      this.getTableData();
+    },
+    
+
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.attendanceCycle {
+  .header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 10px;
+    .left {
+      display: flex;
+      align-items: center;
+    }
+    .right {
+      display: flex;
+      align-items: center;
+    }
+  }
+  .footer {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+</style>

package/app/employeeSchedulingManagement/batchScheduling/index.vue

@@ -0,0 +1,401 @@
+<template>
+  <div class="batchScheduling">
+    <div class="basicInfo">
+      <div class="title">基本信息</div>
+      <div class="content">
+        <el-form
+          ref="form"
+          :model="formData"
+          label-width="140px"
+          :rules="rules"
+        >
+          <div class="form-item-fisrt">
+            <el-form-item label="开始日期" prop="startDate">
+              <el-date-picker
+                style="width: 100%"
+                size="small"
+                v-model="formData.startDate"
+                type="date"
+                placeholder="选择日期"
+              >
+              </el-date-picker>
+            </el-form-item>
+            <el-form-item label="结束日期" prop="endDate">
+              <el-date-picker
+                style="width: 100%"
+                size="small"
+                v-model="formData.endDate"
+                type="date"
+                placeholder="选择日期"
+              >
+              </el-date-picker>
+            </el-form-item>
+            <el-form-item label="分类" prop="category">
+              <el-input
+                size="small"
+                v-model="formData.category"
+                placeholder="请输入分类"
+              />
+            </el-form-item>
+            <el-form-item label="轮班制度" prop="shiftRotationSystem">
+              <el-input
+                size="small"
+                v-model="formData.shiftRotationSystem"
+                placeholder="请输入轮班制度"
+              >
+                <el-button
+                  slot="append"
+                  icon="el-icon-search"
+                  @click="openShiftRotationSystem"
+                ></el-button
+              ></el-input>
+            </el-form-item>
+            <el-form-item
+              label="起始班次序号"
+              prop="startShift"
+              v-if="formData.participants === '1'"
+            >
+              <el-input
+                size="small"
+                v-model="formData.startShift"
+                placeholder="请输入起始班次序号"
+              />
+            </el-form-item>
+            <el-form-item label="法定假日休息班次" prop="legalHolidayRestShift">
+              <el-input
+                size="small"
+                v-model="formData.legalHolidayRestShift"
+                placeholder="请输入法定假日休息班次"
+              >
+                <el-button
+                  slot="append"
+                  icon="el-icon-search"
+                  @click="openShift('legalHolidayRestShift')"
+                ></el-button
+              ></el-input>
+            </el-form-item>
+            <el-form-item
+              label="企业假日休息班次"
+              prop="enterpriseHolidayRestShift"
+            >
+              <el-input
+                size="small"
+                v-model="formData.enterpriseHolidayRestShift"
+                placeholder="请输入企业假日休息班次"
+              >
+                <el-button
+                  slot="append"
+                  icon="el-icon-search"
+                  @click="openShift('enterpriseHolidayRestShift')"
+                ></el-button
+              ></el-input>
+            </el-form-item>
+            <el-form-item label="企业日历" prop="calendar">
+              <el-input
+                size="small"
+                v-model="formData.calendar"
+                placeholder="请输入企业日历"
+              >
+                <el-button
+                  slot="append"
+                  icon="el-icon-search"
+                  @click="openCompanyCalendar"
+                ></el-button
+              ></el-input>
+            </el-form-item>
+            <el-form-item label="参与人员" prop="participants">
+              <el-radio-group v-model="formData.participants">
+                <el-radio label="1">组内全部人员</el-radio>
+                <el-radio label="2">组内部分人员</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </div>
+          <div v-if="formData.participants === '2'" class="form-item-second">
+            <el-form-item label="选择人员" prop="personList">
+              <el-input
+                :value="personListComputed"
+                type="textarea"
+                placeholder="请输入内容"
+              />
+            </el-form-item>
+            <el-form-item>
+              <el-button
+                icon="el-icon-search"
+                size="mini"
+                style="margin-right: 10px"
+                @click="openAttendancePersonnel"
+              ></el-button>
+              <el-checkbox v-model="formData.reverseFilter"
+                >反向筛选</el-checkbox
+              >
+            </el-form-item>
+          </div>
+        </el-form>
+      </div>
+    </div>
+    <div class="shiftInfo">
+      <div class="title">班次信息</div>
+      <div class="shiftInfo-content">
+        <el-table size="mini" :data="tableData" style="width: 100%" border>
+          <el-table-column label="序号" prop="index"></el-table-column>
+          <el-table-column label="班次" prop="shiftName"> </el-table-column>
+          <el-table-column label="上班时间" prop="shiftTime"> </el-table-column>
+          <el-table-column label="下班时间" prop="shiftTimeEnd">
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <div class="bottom">
+      <el-button size="small" @click="close">取消</el-button>
+      <el-button size="small" type="primary" @click="onSave">生成排班</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import shiftRotationSystem from "../../components/shiftRotationSystem";
+import shift from "../../components/shift";
+import companyCalendar from "../../components/companyCalendar";
+import attendancePersonnel from "../../components/attendancePersonnel";
+export default {
+  // 批量排班
+  name: "batchScheduling",
+  props: {
+    close: {
+      type: Function,
+      default: () => {},
+    },
+   
+  },
+  data() {
+    return {
+      formData: {
+        startDate: "", // 开始日期
+        endDate: "", // 结束日期
+        category: "", // 分类
+        shiftRotationSystem: "", // 轮班制度
+        startShift: "", // 起始班次序号
+        legalHolidayRestShift: "", // 法定假日休息班次
+        enterpriseHolidayRestShift: "", // 企业假日休息班次
+        calendar: "", // 企业日历
+        participants: "1", //  参与人员
+        personList: [],
+        reverseFilter: false,
+      },
+      rules: {
+        startDate: [
+          { required: true, message: "请选择开始日期", trigger: "blur" },
+        ],
+        endDate: [
+          { required: true, message: "请选择结束日期", trigger: "blur" },
+        ],
+        category: [{ required: true, message: "请输入分类", trigger: "blur" }],
+        shiftRotationSystem: [
+          { required: true, message: "请输入轮班制度", trigger: "blur" },
+        ],
+        startShift: [
+          { required: true, message: "请输入起始班次序号", trigger: "blur" },
+        ],
+        legalHolidayRestShift: [
+          {
+            required: true,
+            message: "请输入法定假日休息班次",
+            trigger: "blur",
+          },
+        ],
+        enterpriseHolidayRestShift: [
+          {
+            required: true,
+            message: "请输入企业假日休息班次",
+            trigger: "blur",
+          },
+        ],
+        calendar: [
+          { required: true, message: "请输入企业日历", trigger: "blur" },
+        ],
+        participants: [
+          { required: true, message: "请输入参与人员", trigger: "blur" },
+        ],
+      },
+      tableData: [
+        {
+          id: 1,
+          index: 1,
+          shiftName: "早班",
+          shiftTime: "07:00-09:00",
+          shiftTimeEnd: "09:00-11:00",
+        },
+        {
+          id: 2,
+          index: 2,
+          shiftName: "中班",
+          shiftTime: "09:00-11:00",
+          shiftTimeEnd: "11:00-13:00",
+        },
+        {
+          id: 3,
+          index: 3,
+          shiftName: "晚班",
+          shiftTime: "11:00-13:00",
+          shiftTimeEnd: "13:00-15:00",
+        },
+        {
+          id: 4,
+          index: 4,
+          shiftName: "夜班",
+          shiftTime: "13:00-15:00",
+          shiftTimeEnd: "15:00-17:00",
+        },
+        {
+          id: 5,
+          index: 5,
+          shiftName: "夜班",
+          shiftTime: "15:00-17:00",
+          shiftTimeEnd: "17:00-19:00",
+        },
+        {
+          id: 6,
+          index: 6,
+          shiftName: "夜班",
+          shiftTime: "17:00-19:00",
+          shiftTimeEnd: "19:00-21:00",
+        },
+        {
+          id: 7,
+          index: 7,
+          shiftName: "夜班",
+          shiftTime: "19:00-21:00",
+          shiftTimeEnd: "21:00-23:00",
+        },
+      ],
+    };
+  },
+  computed: {
+    personListComputed() {
+      return "1";
+    },
+  },
+  mounted() {},
+  methods: {
+    openShiftRotationSystem() {
+      const config = {
+        props: {
+          title: "轮班制度",
+          width: "50%",
+        },
+        slots: {
+          default: (
+            <shiftRotationSystem
+              setData={this.setShiftRotationSystem}
+              close={() => close()}
+            />
+          ),
+        },
+      };
+      let { close } = this.$dialogFnByJsx(config);
+    },
+    setShiftRotationSystem(data) {
+      console.log(data);
+    },
+    openShift(key) {
+      const config = {
+        props: {
+          title: "班次",
+          width: "50%",
+        },
+        slots: {
+          default: (
+            <shift
+              setData={(d) => this.setShift(d, key)}
+              close={() => close()}
+            />
+          ),
+        },
+      };
+      let { close } = this.$dialogFnByJsx(config);
+    },
+    setShift(data, key) {
+      console.log(data, key, "setShift");
+    },
+    openCompanyCalendar() {
+      const config = {
+        props: {
+          title: "企业日历",
+          width: "50%",
+        },
+        slots: {
+          default: (
+            <companyCalendar
+              setData={this.setCompanyCalendarData}
+              close={() => close()}
+            />
+          ),
+        },
+      };
+      let { close } = this.$dialogFnByJsx(config);
+    },
+    setCompanyCalendarData(row) {
+      console.log(row, "setCompanyCalendarData");
+    },
+
+    openAttendancePersonnel() {
+      const config = {
+        props: {
+          title: "选择考勤人员",
+          width: "50%",
+        },
+        slots: {
+          default: (
+            <attendancePersonnel
+              close={() => close()}
+              setData={(row) => this.setAttendancePersonnel(row)}
+              multiple={true}
+            />
+          ),
+        },
+      };
+      let { close } = this.$dialogFnByJsx(config);
+    },
+    setAttendancePersonnel(row) {
+      console.log(row, "setAttendancePersonnel");
+    },
+
+    onSave() {
+        console.log("onSave");
+        this.close();
+    }
+  },
+};
+</script>
+
+<style lang="less">
+.batchScheduling {
+  .title {
+    font-size: 16px;
+    font-weight: 600;
+    border-bottom: 1px solid #ccc;
+    margin-bottom: 10px;
+    padding-bottom: 6px;
+  }
+  .basicInfo {
+    .form-item-fisrt {
+      display: flex;
+      flex-wrap: wrap;
+      .el-form-item {
+        width: 45%;
+        margin-bottom: 14px;
+      }
+    }
+    .form-item-second {
+      .el-form-item {
+        margin-bottom: 4px;
+      }
+    }
+  }
+  .bottom {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 10px;
+  }
+}
+</style>