123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190 |
- <template>
- <div class="mainContentBox">
- <avue-crud
- ref="crudRef"
- v-model:search="search"
- v-model="form"
- :data="data"
- :option="option"
- v-model:page="page"
- @row-save="createRow"
- @row-del="deleteRow"
- @row-update="updateRow"
- @search-change="searchChange"
- @search-reset="resetChange"
- @size-change="dataList"
- @current-change="dataList"
- @selection-change="selectionChange"
- :before-open="onBeforeOpen"
- >
- </avue-crud>
- </div>
- </template>
- <script setup lang="ts">
- import {ref, getCurrentInstance} from "vue";
- import {useCrud} from "@/hooks/userCrud";
- // 传入一个url,后面不带/
- const {form, data, option, search, page, toDeleteIds, Methords, Utils} =
- useCrud({
- src: "/api/v1/attendanceStatistics",
- });
- const {dataList, createRow, updateRow, deleteRow, searchChange, resetChange} =
- Methords; //增删改查
- const {selectionChange, multipleDelete} = Methords; //选中和批量删除事件
- const {checkBtnPerm, downloadTemplate, exportData} = Utils; //按钮权限等工具
- const deptTypes = ref([]);
- const crudRef = ref(null); //crudRef.value 获取avue-crud对象
- onMounted(() => {
- // console.log("crudRef", crudRef)
- dataList();
- });
- const multipleRow = ref(true);
- const productionLineRef = ref(null);
- const startCreat = () => {
- productionLineRef.value?.mergeOption({
- selection: true,
- reserveSelection: true,
- });
- };
- // 设置表格列或者其他自定义的option
- option.value = Object.assign(option.value, {
- searchEnter: false,
- selection: false,
- menuWidth: 200,
- border: true,
- index: true,
- delBtn: true,
- addBtn: true,
- viewBtn: false,
- editBtn: false,
- rowKey: "id",
- column: [
- // {
- // label: "择班组信息",
- // prop: "toSelect",
- // hide: true,
- // type: "tree",
- // dicUrl: import.meta.env.VITE_APP_BASE_API + "/api/v1/sys/dept/orgTree",
- // // dicMethod: "post",
- // span: 24,
- // props: {
- // label: "deptName", // 下拉菜单显示的字段
- // value: "deptCode", // 下拉菜单值的字段
- // },
- // change: (row) => {
- // if (row && row.item) {
- // form.value.deptName = row.item.deptName;
- // }
- // },
- // },
- {
- label: "班组名称",
- prop: "deptName",
- type: "select",
- dicUrl: import.meta.env.VITE_APP_BASE_API + "/api/v1/sys/dept/deptList?parentId=10",
- props: {
- label: "deptName",
- value: "deptName",
- },
- change: (row) => {
- if (row && row.item) {
- form.value.deptName = row.item.deptName;
- form.value.deptNum = row.item.deptNum;
- }
- },
- search: true,
- overHidden: true,
- rules: [
- {
- required: true,
- message: "请输入deptName",
- trigger: "blur",
- },
- ],
- },
- {
- label: "班组人数",
- prop: "deptNum",
- search: false,
- overHidden: true,
- type: "number",
- min: 1,
- max: 99999,
- rules: [
- {
- required: true,
- message: "班组人数不能为空",
- trigger: "trigger",
- },
- ],
- },
- {
- label: "应出勤",
- prop: "answerNum",
- search: false,
- overHidden: true,
- type: "number",
- min: 1,
- max: 99999,
- rules: [
- {
- required: true,
- message: "应出勤人数不能为空",
- trigger: "trigger",
- },
- ],
- },
- {
- label: "实出勤",
- prop: "practicalNum",
- search: false,
- overHidden: true,
- type: "number",
- min: 1,
- max: 99999,
- rules: [
- {
- required: true,
- message: "实出勤人数不能为空",
- trigger: "trigger",
- },
- ],
- blur: () => {
- // 检查两个字段是否都有值(不为 null/undefined/空字符串/0)
- if (form.value.practicalNum != null && form.value.answerNum != null) {
- // 额外检查 answerNum 不能为 0(避免除以零)
- if (form.value.answerNum !== 0) {
- form.value.attendanceRate = (form.value.practicalNum / form.value.answerNum * 100).toFixed(2);
- } else {
- form.value.attendanceRate = 0; // 或其他默认值
- }
- }
- // 如果任一字段为空,不执行计算(保持 attendanceRate 原值或清空)
- },
- },
- {
- label: "出勤率(%)",
- prop: "attendanceRate",
- search: false,
- overHidden: true,
- },
- {
- label: "创建时间",
- prop: "created",
- display: false,
- },
- ],
- });
- const tableData = ref<any[]>([]); //选中的行
- const onBeforeOpen = (done) => {
- console.log("before open");
- tableData.value = [];
- form.value.dtos = [];
- done();
- };
- </script>
|