提交

package.json

@@ -5,6 +5,7 @@
   "scripts": {
     "serve": "set NODE_OPTIONS=--openssl-legacy-provider & vue-cli-service serve --mode dev",
     "build": "set NODE_OPTIONS=--openssl-legacy-provider & vue-cli-service build --mode pro & node ./saveOSSAGitte.js",
+    "build:local": "set NODE_OPTIONS=--openssl-legacy-provider & vue-cli-service build --mode pro",
     "gitPush": "node ./saveOSSAGitte.js"
   },
   "dependencies": {

src/api/scheduling.js

@@ -0,0 +1,43 @@
+import ajax from '@/utils/request.js';
+export function getUsers() {
+  return ajax({
+    url: 'http://172.16.101.11:8081/user-list',
+    method: 'GET',
+    urlType: 'default',
+    next: true,
+    errorToast: '当前访问人数过多，请重试。',
+  });
+}
+
+export function createScheduling(data) {
+  return ajax({
+    url: 'http://172.16.101.11:8081/create-duty',
+    method: 'GET',
+    urlType: 'default',
+    next: true,
+    errorToast: '当前访问人数过多，请重试。',
+    data: data,
+  });
+}
+
+export function getHistory(data) {
+  return ajax({
+    url: 'http://172.16.101.11:8081/history',
+    method: 'POST',
+    urlType: 'default',
+    next: true,
+    errorToast: '当前访问人数过多，请重试。',
+    data: data,
+  });
+}
+
+export function createUser(data) {
+  return ajax({
+    url: 'http://172.16.101.11:8081/custom-create-duty',
+    method: 'POST',
+    urlType: 'default',
+    next: true,
+    errorToast: '当前访问人数过多，请重试。',
+    data: data,
+  });
+}

src/config/page.json

@@ -69,5 +69,8 @@
     },
     "analysis": {
         "title": "抖音解析"
+    },
+    "Scheduling": {
+        "title": "排班"
     }
 }

src/utils/request.js

@@ -68,7 +68,7 @@ export default function (ori) {
         console.error(err);
         reject(err);
       }
-      if (data.code === 0 || ori.next) resolve(data.data);
+      if (data.code === 0 || ori.next) resolve(data.data || data);
       else reject(data);
     };
   });

src/view/Scheduling/index.js

@@ -0,0 +1,9 @@
+import App from './index.vue';
+import '@/assets/js/common';
+import { createApp } from 'vue';
+import { getPageParameters, environment } from '../../config/pageConfig';
+// 判断环境
+environment();
+window.$originData = getPageParameters();
+document.title = window.$originData.orginParames.title || '';
+createApp(App).mount('#app');

src/view/Scheduling/index.vue

@@ -0,0 +1,286 @@
+<template>
+  <div class="Scheduling">
+    <el-row>
+      <el-col :span="12"
+        ><el-date-picker v-model="dates" type="dates" placeholder="请选择日期"
+      /></el-col>
+      <el-col :span="12" style="text-align: right">
+        <el-button type="primary" @click="showHistoryDate">历史记录</el-button>
+      </el-col>
+    </el-row>
+    <el-row :gutter="20">
+      <el-col :span="10">
+        <br />
+        <el-card>
+          <template #header>本轮已排班人员</template>
+          <el-empty v-if="OnDuty.length === 0" description="暂无人员" />
+          <div v-for="o in OnDuty" :key="o" class="text">
+            {{ o.dt }} {{ o.name }}
+          </div>
+        </el-card>
+        <br />
+        <el-card>
+          <template #header> 本轮未排班人员 </template>
+          <el-empty v-if="NotOnDuty.length === 0" description="暂无人员" />
+          <div v-for="o in NotOnDuty" :key="o" class="text">
+            {{ o.name }}
+          </div>
+        </el-card>
+      </el-col>
+      <el-col :span="4" style="position: relative">
+        <div class="start_scheduling" @click="createScheduling_func">
+          开始排班
+        </div>
+      </el-col>
+      <el-col :span="10">
+        <br />
+        <el-card>
+          <template #header> 新生成排班 </template>
+          <el-empty v-if="NewOnDuty.length === 0" description="暂无人员" />
+          <div v-for="o in NewOnDuty" :key="o" class="text">
+            {{ o.dt }} {{ o.name }}
+          </div>
+        </el-card>
+        <br />
+        <el-card>
+          <template #header>
+            <el-date-picker
+              v-model="dates_now"
+              type="date"
+              placeholder="请选择日期"
+            />
+            <el-select
+              v-model="selectUser"
+              placeholder="请选择"
+              style="width: 240px"
+            >
+              <el-option
+                v-for="item in NotOnDuty"
+                :key="item.name"
+                :label="item.naem"
+                :value="item.name"
+              />
+            </el-select>
+            <el-button type="primary" @click="createNotOnDuty">+</el-button>
+          </template>
+          <el-empty v-if="NotOnDuty.length === 0" description="暂无人员" />
+
+          <div v-for="(o, i) in addUser" :key="o.name" class="text">
+            {{ o.dt }}
+            ：
+            {{ o.name }}
+            <el-button type="danger" @click="() => delUser(i)">删除</el-button>
+          </div>
+          <el-button type="primary" @click="createOnDuty">添加排班</el-button>
+        </el-card>
+      </el-col>
+    </el-row>
+
+    <el-dialog v-model="showHistory" title="值班历史">
+      <el-table :data="showHistoryList">
+        <el-table-column property="dt" label="值班日期" />
+        <el-table-column property="name" label="姓名" />
+      </el-table>
+      <br />
+      <br />
+      <el-pagination
+        background
+        layout="prev, pager, next"
+        :page-size="size"
+        v-model:current-page="page"
+        :total="total"
+        @current-change="handleCurrentChange"
+      />
+    </el-dialog>
+  </div>
+</template>
+<script setup>
+import { ref } from 'vue';
+import {
+  getUsers,
+  getHistory,
+  createScheduling,
+  createUser,
+} from '@/api/scheduling.js';
+import {
+  ElDatePicker,
+  ElRow,
+  ElCol,
+  ElCard,
+  ElEmpty,
+  ElButton,
+  ElTable,
+  ElTableColumn,
+  ElDialog,
+  ElPagination,
+  ElSelect,
+  ElOption,
+} from 'element-plus';
+import { showToast } from 'vant';
+import 'vant/lib/toast/style/index';
+import 'element-plus/dist/index.css';
+// import { onMounted, reactive } from "vue";
+// import { isIpad, isIpod, isIphone } from "../../utils/isTerminal";
+/**
+ * window.$originData.orginParames.title 页面标题
+ * window.$originData.orginParames.parameters 固定参数值
+ * window.$originData.urlParames url参数
+ */
+console.log(window.$originData);
+const selectUser = ref('');
+const dates = ref([]);
+const dates_now = ref([]);
+const OnDuty = ref([]);
+const NotOnDuty = ref([]);
+const NewOnDuty = ref([]);
+const showHistory = ref(false);
+const showHistoryList = ref([]);
+let ori_showHistoryList = [];
+const total = ref(0);
+const page = ref(1);
+const size = 10;
+const addUser = ref([]);
+
+function createScheduling_func() {
+  if (!dates.value.length) return showToast('请选择日期');
+  const li = [];
+  for (let i = 0; i < dates.value.length; i++) {
+    const v = dates.value[i];
+    const Y = v.getFullYear();
+    const M =
+      v.getMonth() + 1 > 9 ? v.getMonth() + 1 : '0' + (v.getMonth() + 1);
+    const D = v.getDate() > 9 ? v.getDate() : '0' + v.getDate();
+    li.push(`${Y}-${M}-${D}`);
+  }
+  createScheduling({ dt: li.join(',') }).then(r => {
+    if (r.message) return showToast(r.message);
+    getHistory({ startDt: '2024-01-01', endDt: getDate() }).then(r => {
+      const historyStates = r || [];
+      const history = {};
+      for (let i = 0; i < historyStates.length; i++) {
+        const v = historyStates[i];
+        if (history[v.createTime]) history[v.createTime].push(v);
+        else history[v.createTime] = [v];
+      }
+      const newHistory = history[Object.keys(history)[0]] || {};
+      console.log(newHistory);
+      NewOnDuty.value = newHistory;
+    });
+  });
+}
+
+function handleCurrentChange() {
+  showHistoryList.value = table_page();
+}
+
+function delUser(i) {
+  addUser.value.splice(i, 1);
+}
+
+function createNotOnDuty() {
+  console.log(selectUser.value, dates_now.value);
+  const endDt = new Date(dates_now.value);
+  const Y = endDt.getFullYear();
+  const M =
+    endDt.getMonth() + 1 > 9
+      ? endDt.getMonth() + 1
+      : '0' + (endDt.getMonth() + 1);
+  const D = endDt.getDate() > 9 ? endDt.getDate() : '0' + endDt.getDate();
+  addUser.value.push({
+    name: selectUser.value,
+    dt: `${Y}-${M}-${D}`,
+  });
+  selectUser.value = '';
+  dates_now.value = '';
+}
+
+function createOnDuty() {
+  if (!addUser.value.length) return showToast('请添加人员');
+  createUser(addUser.value).then(r => {
+    if (r.message) return showToast(r.message);
+    getUsers_fun();
+    addUser.value = [];
+  });
+}
+
+function showHistoryDate() {
+  const endDt = new Date();
+  const Y = endDt.getFullYear() + 1;
+  const M =
+    endDt.getMonth() + 1 > 9
+      ? endDt.getMonth() + 1
+      : '0' + (endDt.getMonth() + 1);
+  const D = endDt.getDate() > 9 ? endDt.getDate() : '0' + endDt.getDate();
+  getHistory({ startDt: '2024-01-01', endDt: `${Y}-${M}-${D}` }).then(r => {
+    ori_showHistoryList = (r || []).reverse();
+    showHistoryList.value = table_page();
+    total.value = ori_showHistoryList.length;
+    showHistory.value = true;
+  });
+}
+
+function table_page() {
+  const li = [];
+  for (let i = (page.value - 1) * size; i < page.value * size; i++) {
+    const v = ori_showHistoryList[i];
+    if (!v) continue;
+    li.push(v);
+  }
+  return li;
+}
+
+function getDate() {
+  const endDt = new Date();
+  const Y = endDt.getFullYear() + 1;
+  const M =
+    endDt.getMonth() + 1 > 9
+      ? endDt.getMonth() + 1
+      : '0' + (endDt.getMonth() + 1);
+  const D = endDt.getDate() > 9 ? endDt.getDate() : '0' + endDt.getDate();
+  return `${Y}-${M}-${D}`;
+}
+
+function getUsers_fun() {
+  getUsers().then(res => {
+    const nowHistory = res || [];
+    NotOnDuty.value = [];
+    OnDuty.value = [];
+    for (let i = 0; i < nowHistory.length; i++) {
+      const v = nowHistory[i];
+      if (v.state) OnDuty.value.push(v);
+      else NotOnDuty.value.push(v);
+    }
+  });
+}
+
+getUsers_fun();
+</script>
+<style>
+.Scheduling {
+  width: 100vw;
+  height: 100vh;
+  padding: 1em;
+}
+.start_scheduling {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  background-color: #409eff;
+  border-radius: 50%;
+  width: 100px;
+  height: 100px;
+  color: #ffffff;
+  text-align: center;
+  line-height: 40px;
+  font-size: 30px;
+  padding: 10px;
+  box-shadow: 0 0 10px 15px #409eff;
+  cursor: pointer;
+}
+
+.text {
+  line-height: 2em;
+  margin: 0 0 5px 0;
+}
+</style>