init

src/assets/js/asyncRouter.js

@@ -629,6 +629,14 @@ export default [
             path: "",
             component: "statistical_analysis/inventory_statistics_month/index",
           },
+          {
+            path: "/statistical_analysis/inventory_statistics_month/print",
+            meta: {
+              title: "打印",
+              activeMenu: "/statistical_analysis/inventory_statistics_month",
+            },
+            component: "statistical_analysis/inventory_statistics_month/print",
+          },
         ],
       },
     ],

src/request/statistical_analysis.js

@@ -8,3 +8,5 @@ export const getDetectionSituationListTime = (params) =>
   post("/liststatistics/getTimeAstrict", params); // 员工日常检测情况列表时间
 export const getUsageSituationList = (params) =>
   post("/liststatistics/checkSituation", params); // 员工使用情况分析列表
+export const getInventoryStatisticsMonthList = (params) =>
+  post("/checkrecord/monthStatistics", params); // 员工清单检查统计（月）列表

src/views/statistical_analysis/detection_situation/print.vue

@@ -44,6 +44,7 @@
     <div class="tc mt-10">
       <el-button type="primary" v-print="'#printContent'">打印</el-button>
     </div>
+    <div v-html="PRINT_STYLE" />
   </layout-card>
 </template>
 
@@ -51,6 +52,7 @@
 import useListData from "@/assets/js/useListData.js";
 import { getDetectionSituationList } from "@/request/statistical_analysis.js";
 import { useRoute } from "vue-router";
+import { PRINT_STYLE } from "@/assets/js/constant.js";
 
 const route = useRoute();
 const { STARTTIME, ENDTIME, DEPTIDS } = route.query;

src/views/statistical_analysis/inventory_statistics_month/index.vue

@@ -0,0 +1,265 @@
+<template>
+  <div>
+    <el-card>
+      <el-form
+        :model="searchForm"
+        label-width="70px"
+        @submit.prevent="fnResetPaginationTransfer"
+      >
+        <el-row>
+          <el-col :span="6">
+            <el-form-item label="姓名" prop="KEYWORDS">
+              <el-input
+                v-model="searchForm.KEYWORDS"
+                placeholder="请输入关键字"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="部门" prop="DEPTIDS">
+              <layout-department
+                v-model="searchForm.DEPTIDS"
+                multiple
+                show-checkbox
+                collapse-tags
+                root-disabled="Y"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="时间" prop="MONTH">
+              <el-date-picker
+                v-model="searchForm.MONTH"
+                format="YYYY-MM"
+                value-format="YYYY-MM"
+                type="month"
+                placeholder="选择查询日期"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <el-form-item label-width="10px">
+              <el-button type="primary" native-type="submit">搜索</el-button>
+              <el-button native-type="reset" @click="fnResetPaginationTransfer">
+                重置
+              </el-button>
+            </el-form-item>
+          </el-col>
+          <el-col :span="2">
+            <el-form-item label-width="10px" class="end">
+              <el-button
+                @click="
+                  router.push({
+                    path: '/statistical_analysis/inventory_statistics_month/print',
+                    query: {
+                      ...searchForm,
+                      DEPTIDS: searchForm.DEPTIDS?.join(','),
+                    },
+                  })
+                "
+              >
+                打印
+              </el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-card>
+    <layout-card>
+      <div class="mb-10 flex">
+        <div>备注：红色日期代表周六日</div>
+        <div class="flex ml-10">
+          <img src="/src/assets/images/print/white/check.png" alt="" />
+          完成检查
+        </div>
+        <div class="flex ml-10">
+          <img src="/src/assets/images/print/white/error.png" alt="" />
+          未进行检查
+        </div>
+        <div class="flex ml-10">
+          <img src="/src/assets/images/print/white/waring.png" alt="" />
+          离岗/休班/周期未结束
+        </div>
+        <div class="flex ml-10">
+          <img src="/src/assets/images/print/white/line.png" alt="" />
+          未建立
+        </div>
+      </div>
+      <layout-table
+        :data="list"
+        v-model:pagination="pagination"
+        @get-data="fnGetDataTransfer"
+      >
+        <el-table-column label="序号" width="70" fixed="left">
+          <template v-slot="{ $index }">
+            {{ serialNumber(pagination, $index) }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="DEPARTMENT_NAME"
+          label="部门"
+          width="155"
+          fixed="left"
+        />
+        <el-table-column
+          prop="POST_NAME"
+          label="岗位"
+          width="100"
+          fixed="left"
+        />
+        <el-table-column
+          prop="USER_NAME"
+          label="人员"
+          width="100"
+          fixed="left"
+        />
+        <el-table-column
+          prop="PERIOD_NAME"
+          label="检查周期"
+          width="80"
+          fixed="left"
+        />
+        <el-table-column
+          prop="NAME"
+          label="清单名称"
+          width="155"
+          fixed="left"
+        />
+        <el-table-column align="center">
+          <template v-slot:header>
+            {{ currentMonth }}清单检查详细情况
+          </template>
+          <el-table-column
+            v-for="(item, index) in currentMonthDays"
+            :key="index"
+            :label="item.toString()"
+            width="50"
+          >
+            <template #header="{ column }">
+              <span :style="{ color: fnIsItAWeekend(column) ? 'red' : '' }">
+                {{ item }}
+              </span>
+              <br />
+              <span :style="{ color: fnIsItAWeekend(column) ? 'red' : '' }">
+                {{ fnDayOfWeek(column) }}
+              </span>
+            </template>
+            <template #default="{ row }">
+              <template
+                v-if="dayjs().format('YYYY-MM-DD') > fnFormatDate(item)"
+              >
+                <div
+                  v-if="
+                    (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || '')
+                      .TYPE === '1'
+                  "
+                  style="position: relative"
+                  class="flex"
+                >
+                  <img src="/src/assets/images/print/white/check.png" alt="" />
+                  <span
+                    v-if="
+                      (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || '')
+                        .CREATTIME === fnFormatDate(item)
+                    "
+                    style="position: absolute; right: -6px; top: -6px"
+                  >
+                    {{
+                      (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || "")
+                        .HIDDEN_COUNT === "0"
+                        ? ""
+                        : (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || "")
+                            .HIDDEN_COUNT
+                    }}
+                  </span>
+                </div>
+                <span
+                  v-else-if="
+                    (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || '')
+                      .TYPE === '2'
+                  "
+                  class="flex"
+                >
+                  <img src="/src/assets/images/print/white/error.png" alt="" />
+                </span>
+                <span
+                  v-else-if="
+                    (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || '')
+                      .TYPE === '3'
+                  "
+                  class="flex"
+                >
+                  <img src="/src/assets/images/print/white/line.png" alt="" />
+                </span>
+                <span v-else class="flex">
+                  <img src="/src/assets/images/print/white/waring.png" alt="" />
+                </span>
+              </template>
+            </template>
+          </el-table-column>
+        </el-table-column>
+      </layout-table>
+    </layout-card>
+  </div>
+</template>
+
+<script setup>
+import LayoutDepartment from "@/components/department/index.vue";
+import { serialNumber } from "@/assets/js/utils.js";
+import useListData from "@/assets/js/useListData.js";
+import { getInventoryStatisticsMonthList } from "@/request/statistical_analysis.js";
+import dayjs from "dayjs";
+import { ref } from "vue";
+import { useRouter } from "vue-router";
+
+const router = useRouter();
+const currentMonth = ref(dayjs().format("YYYY-MM"));
+const currentMonthDays = ref(0);
+const resMap = ref({});
+const { list, searchForm, pagination, fnResetPagination, fnGetData } =
+  useListData(getInventoryStatisticsMonthList, {
+    defaultSearchForm: {
+      MONTH: currentMonth.value,
+    },
+    key: "list",
+    callbackFn: (list, resData) => {
+      currentMonth.value = searchForm.value.MONTH;
+      resMap.value = resData.resmap;
+      currentMonthDays.value = dayjs(currentMonth.value).daysInMonth();
+    },
+  });
+const fnGetDataTransfer = () => {
+  fnGetData({
+    DEPTIDS: searchForm.value.DEPTIDS?.join(","),
+  });
+};
+const fnResetPaginationTransfer = () => {
+  fnResetPagination({
+    DEPTIDS: searchForm.value.DEPTIDS?.join(","),
+  });
+};
+const fnIsItAWeekend = (column) => {
+  const day = dayjs(`${currentMonth.value}-${column.label}`).day();
+  return day === 0 || day === 6;
+};
+const fnDayOfWeek = (column) => {
+  const day = dayjs(`${currentMonth.value}-${column.label}`).day();
+  const dayOfWeek = ["日", "一", "二", "三", "四", "五", "六"];
+  return dayOfWeek[day];
+};
+const fnFormatDate = (day) => {
+  return currentMonth.value + "-" + day.toString().padStart(2, "0");
+};
+</script>
+
+<style scoped lang="scss">
+.flex {
+  display: flex;
+  align-items: center;
+}
+
+img {
+  width: 16px;
+  height: 16px;
+}
+</style>

src/views/statistical_analysis/inventory_statistics_month/print.vue

@@ -0,0 +1,294 @@
+<template>
+  <layout-card>
+    <div id="printContent">
+      <!--      TODO 打印分页截断-->
+      <el-divider content-position="left">员工清单检查统计（月）</el-divider>
+      <div class="mb-10 flex">
+        <div>备注：</div>
+        <div class="flex ml-10">
+          <img
+            src="/src/assets/images/print/white/check.png"
+            alt=""
+            class="print_no_use"
+          />
+          <img
+            src="/src/assets/images/print/black/check.png"
+            alt=""
+            class="print_use"
+          />
+          完成检查
+        </div>
+        <div class="flex ml-10">
+          <img
+            src="/src/assets/images/print/white/error.png"
+            alt=""
+            class="print_no_use"
+          />
+          <img
+            src="/src/assets/images/print/black/error.png"
+            alt=""
+            class="print_use"
+          />
+          未进行检查
+        </div>
+        <div class="flex ml-10">
+          <img
+            src="/src/assets/images/print/white/waring.png"
+            alt=""
+            class="print_no_use"
+          />
+          <img
+            src="/src/assets/images/print/black/waring.png"
+            alt=""
+            class="print_use"
+          />
+          离岗/休班/周期未结束
+        </div>
+        <div class="flex ml-10">
+          <img
+            src="/src/assets/images/print/white/line.png"
+            alt=""
+            class="print_no_use"
+          />
+          <img
+            src="/src/assets/images/print/black/line.png"
+            alt=""
+            class="print_use"
+          />
+          未建立
+        </div>
+      </div>
+      <div class="print_no_use">
+        <layout-table :data="list" :show-pagination="false">
+          <el-table-column label="序号" width="70" fixed="left" type="index" />
+          <el-table-column
+            prop="DEPARTMENT_NAME"
+            label="部门"
+            width="155"
+            fixed="left"
+          />
+          <el-table-column
+            prop="POST_NAME"
+            label="岗位"
+            width="100"
+            fixed="left"
+          />
+          <el-table-column
+            prop="USER_NAME"
+            label="人员"
+            width="100"
+            fixed="left"
+          />
+          <el-table-column
+            prop="PERIOD_NAME"
+            label="检查周期"
+            width="80"
+            fixed="left"
+          />
+          <el-table-column
+            prop="NAME"
+            label="清单名称"
+            width="155"
+            fixed="left"
+          />
+          <el-table-column align="center">
+            <template v-slot:header> {{ MONTH }}清单检查详细情况</template>
+            <el-table-column
+              v-for="(item, index) in currentMonthDays"
+              :key="index"
+              :label="item.toString()"
+              width="50"
+            >
+              <template #default="{ row }">
+                <template
+                  v-if="dayjs().format('YYYY-MM-DD') > fnFormatDate(item)"
+                >
+                  <div
+                    v-if="
+                      (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || '')
+                        .TYPE === '1'
+                    "
+                    style="position: relative"
+                    class="flex"
+                  >
+                    <img
+                      src="/src/assets/images/print/white/check.png"
+                      alt=""
+                    />
+                    <span
+                      v-if="
+                        (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || '')
+                          .CREATTIME === fnFormatDate(item)
+                      "
+                      style="position: absolute; right: -6px; top: -6px"
+                    >
+                      {{
+                        (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || "")
+                          .HIDDEN_COUNT === "0"
+                          ? ""
+                          : (
+                              resMap[row.LISTMANAGER_ID][fnFormatDate(item)] ||
+                              ""
+                            ).HIDDEN_COUNT
+                      }}
+                    </span>
+                  </div>
+                  <span
+                    v-else-if="
+                      (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || '')
+                        .TYPE === '2'
+                    "
+                    class="flex"
+                  >
+                    <img
+                      src="/src/assets/images/print/white/error.png"
+                      alt=""
+                    />
+                  </span>
+                  <span
+                    v-else-if="
+                      (resMap[row.LISTMANAGER_ID][fnFormatDate(item)] || '')
+                        .TYPE === '3'
+                    "
+                    class="flex"
+                  >
+                    <img src="/src/assets/images/print/white/line.png" alt="" />
+                  </span>
+                  <span v-else class="flex">
+                    <img
+                      src="/src/assets/images/print/white/waring.png"
+                      alt=""
+                    />
+                  </span>
+                </template>
+              </template>
+            </el-table-column>
+          </el-table-column>
+        </layout-table>
+      </div>
+      <table class="print_use">
+        <thead>
+          <tr>
+            <th rowspan="2">序号</th>
+            <th rowspan="2">部门</th>
+            <th rowspan="2">岗位</th>
+            <th rowspan="2">人员</th>
+            <th rowspan="2">检查周期</th>
+            <th rowspan="2">清单名称</th>
+            <th :colspan="currentMonthDays">{{ MONTH }}清单检查详细情况</th>
+          </tr>
+          <tr>
+            <th v-for="(item, index) in currentMonthDays" :key="index">
+              {{ item }}
+            </th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="(item, index) in list" :key="index">
+            <td>{{ index + 1 }}</td>
+            <td>{{ item.DEPARTMENT_NAME }}</td>
+            <td>{{ item.POST_NAME }}</td>
+            <td>{{ item.USER_NAME }}</td>
+            <td>{{ item.PERIOD_NAME }}</td>
+            <td>{{ item.NAME }}</td>
+            <td v-for="(item1, index1) in currentMonthDays" :key="index1">
+              <template
+                v-if="dayjs().format('YYYY-MM-DD') > fnFormatDate(item1)"
+              >
+                <div
+                  v-if="
+                    (resMap[item.LISTMANAGER_ID][fnFormatDate(item1)] || '')
+                      .TYPE === '1'
+                  "
+                  style="position: relative"
+                  class="flex"
+                >
+                  <img src="/src/assets/images/print/black/check.png" alt="" />
+                  <span
+                    v-if="
+                      (resMap[item.LISTMANAGER_ID][fnFormatDate(item1)] || '')
+                        .CREATTIME === fnFormatDate(item1)
+                    "
+                    style="position: absolute; right: -6px; top: -6px"
+                  >
+                    {{
+                      (resMap[item.LISTMANAGER_ID][fnFormatDate(item1)] || "")
+                        .HIDDEN_COUNT
+                    }}
+                  </span>
+                </div>
+                <span
+                  v-else-if="
+                    (resMap[item.LISTMANAGER_ID][fnFormatDate(item1)] || '')
+                      .TYPE === '2'
+                  "
+                  class="flex"
+                >
+                  <img src="/src/assets/images/print/black/error.png" alt="" />
+                </span>
+                <span
+                  v-else-if="
+                    (resMap[item.LISTMANAGER_ID][fnFormatDate(item1)] || '')
+                      .TYPE === '3'
+                  "
+                  class="flex"
+                >
+                  <img src="/src/assets/images/print/black/line.png" alt="" />
+                </span>
+                <span v-else class="flex">
+                  <img src="/src/assets/images/print/black/waring.png" alt="" />
+                </span>
+              </template>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <div class="tc mt-10">
+      <el-button type="primary" v-print="'#printContent'">打印</el-button>
+    </div>
+    <div v-html="PRINT_STYLE" />
+  </layout-card>
+</template>
+
+<script setup>
+import useListData from "@/assets/js/useListData.js";
+import { getInventoryStatisticsMonthList } from "@/request/statistical_analysis.js";
+import dayjs from "dayjs";
+import { ref } from "vue";
+import { useRoute } from "vue-router";
+import { PRINT_STYLE } from "@/assets/js/constant.js";
+
+const route = useRoute();
+const { KEYWORDS, DEPTIDS, MONTH } = route.query;
+const currentMonthDays = ref(0);
+const resMap = ref({});
+const { list } = useListData(getInventoryStatisticsMonthList, {
+  otherParams: {
+    showCount: 9999,
+    KEYWORDS,
+    DEPTIDS,
+    MONTH,
+  },
+  key: "list",
+  callbackFn: (list, resData) => {
+    resMap.value = resData.resmap;
+    currentMonthDays.value = dayjs(MONTH).daysInMonth();
+  },
+});
+const fnFormatDate = (day) => {
+  return MONTH + "-" + day.toString().padStart(2, "0");
+};
+</script>
+
+<style scoped lang="scss">
+.flex {
+  display: flex;
+  align-items: center;
+}
+
+img {
+  width: 16px;
+  height: 16px;
+}
+</style>