| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <el-form :model="form" label-width="120px" :rules="formRules" ref="formRef"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="项ç®åç§°" prop="deviceName"> |
| | | <el-input v-model="form.deviceName" placeholder="请è¾å
¥é¡¹ç®åç§°" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ååç¼å·" prop="deviceModel"> |
| | | <el-input v-model="form.deviceModel" :disabled="(form.deviceModel != null && operationType === 'edit')" placeholder="请è¾å
¥ååç¼å·" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æ¿å
å" prop="supplierName"> |
| | | <el-select v-model="form.supplierName" placeholder="è¯·éæ©" clearable style="width: 100%"> |
| | | <el-option v-for="item in customerDataList" :key="item.id" :label="item.customerName + '(' + item.taxpayerIdentificationNumber + ')'" :value="item.customerName"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="仿¬¾æ¹å¼ " prop="unit"> |
| | | <el-select v-model="form.unit" placeholder="è¯·éæ©" clearable style="width: 100%"> |
| | | <el-option v-for="item in payMethods" :key="item.id" :label="item.label" :value="item.value"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æ°é" prop="number"> |
| | | <el-input-number :step="1" :min="0" style="width: 100%" |
| | | v-model="form.number" |
| | | placeholder="请è¾å
¥æ°é" |
| | | @change="mathNum" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å«ç¨åä»·" prop="taxIncludingPriceUnit"> |
| | | <el-input-number :step="0.01" :min="0" style="width: 100%" |
| | | v-model="form.taxIncludingPriceUnit" |
| | | placeholder="请è¾å
¥å«ç¨åä»·" |
| | | maxlength="10" |
| | | @change="mathNum" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å«ç¨æ»ä»·" prop="taxIncludingPriceTotal"> |
| | | <el-input |
| | | v-model="form.taxIncludingPriceTotal" |
| | | placeholder="èªå¨çæ" |
| | | type="number" |
| | | disabled |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ç¨ç(%)" prop="taxRate"> |
| | | <el-select |
| | | v-model="form.taxRate" |
| | | placeholder="è¯·éæ©" |
| | | clearable |
| | | @change="mathNum" |
| | | > |
| | | <el-option label="1" :value="1" /> |
| | | <el-option label="6" :value="6" /> |
| | | <el-option label="13" :value="13" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ä¸å«ç¨æ»ä»·" prop="unTaxIncludingPriceTotal"> |
| | | <el-input |
| | | v-model="form.unTaxIncludingPriceTotal" |
| | | placeholder="èªå¨çæ" |
| | | type="number" |
| | | disabled |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- <el-col :span="12"> |
| | | <el-form-item label="å½å
¥äºº" prop="createUser"> |
| | | <el-input v-model="form.createUser" placeholder="请è¾å
¥å½å
¥äºº" /> |
| | | </el-form-item> |
| | | </el-col> --> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å½å
¥æ¥æ" prop="createTime"> |
| | | <el-date-picker |
| | | style="width: 100%" |
| | | v-model="form.createTime" |
| | | format="YYYY-MM-DD" |
| | | value-format="YYYY-MM-DD HH:mm:ss" |
| | | type="date" |
| | | placeholder="è¯·éæ©å½å
¥æ¥æ" |
| | | clearable |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import useFormData from "@/hooks/useFormData"; |
| | | import {customerList} from "@/api/salesManagement/salesLedger.js"; |
| | | import { getLedgerById } from "@/api/equipmentManagement/ledger"; |
| | | import dayjs from "dayjs"; |
| | | import { |
| | | calculateTaxIncludeTotalPrice, |
| | | calculateTaxExclusiveTotalPrice, |
| | | } from "@/utils/summarizeTable"; |
| | | import { ElMessage } from "element-plus"; |
| | | import {ref,onMounted} from "vue"; |
| | | |
| | | defineOptions({ |
| | | name: "设å¤å°è´¦è¡¨å", |
| | | }); |
| | | const formRef = ref(null); |
| | | const customerDataList = ref([]) |
| | | const operationType = ref(''); |
| | | const payMethods = [ |
| | | { value: 'ææç»ç®', label: 'ææç»ç®' }, |
| | | { value: 'æè¿åº¦ä»æ¬¾', label: 'æè¿åº¦ä»æ¬¾' }, |
| | | { value: '䏿¬¡æ§æ¯ä»', label: '䏿¬¡æ§æ¯ä»' }, |
| | | { value: 'å
¶ä»', label: 'å
¶ä»' }, |
| | | ]; |
| | | const formRules = { |
| | | deviceName: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | deviceModel: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | supplierName: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | unit: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | number: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | taxIncludingPriceUnit: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | taxRate: [{ required: true, trigger: "change", message: "请è¾å
¥" }], |
| | | } |
| | | |
| | | const { form, resetForm } = useFormData({ |
| | | deviceName: undefined, // 设å¤åç§° |
| | | deviceModel: undefined, // è§æ ¼åå· |
| | | supplierName: undefined, // ä¾åºå |
| | | unit: undefined, // åä½ |
| | | number: undefined, // æ°é |
| | | taxIncludingPriceUnit: undefined, // å«ç¨åä»· |
| | | taxIncludingPriceTotal: undefined, // å«ç¨æ»ä»· |
| | | taxRate: undefined, // ç¨ç |
| | | unTaxIncludingPriceTotal: undefined, // ä¸å«ç¨æ»ä»· |
| | | // createUser: useUserStore().nickName, // å½å
¥äºº |
| | | createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"), // å½å
¥æ¥æ |
| | | }); |
| | | |
| | | const loadForm = async (id) => { |
| | | if (id) { |
| | | operationType.value = 'edit' |
| | | } |
| | | const { code, data } = await getLedgerById(id); |
| | | if (code == 200) { |
| | | form.deviceName = data.deviceName; |
| | | form.deviceModel = data.deviceModel; |
| | | form.supplierName = data.supplierName; |
| | | form.unit = data.unit; |
| | | form.number = data.number; |
| | | form.taxIncludingPriceUnit = data.taxIncludingPriceUnit; |
| | | form.taxIncludingPriceTotal = data.taxIncludingPriceTotal; |
| | | form.taxRate = data.taxRate; |
| | | form.unTaxIncludingPriceTotal = data.unTaxIncludingPriceTotal; |
| | | form.createTime = data.createTime; |
| | | } |
| | | }; |
| | | |
| | | const mathNum = () => { |
| | | if (!form.taxIncludingPriceUnit) { |
| | | ElMessage.error("请è¾å
¥åä»·"); |
| | | return; |
| | | } |
| | | if (!form.number) { |
| | | ElMessage.error("请è¾å
¥æ°é"); |
| | | return; |
| | | } |
| | | form.taxIncludingPriceTotal = calculateTaxIncludeTotalPrice( |
| | | form.taxIncludingPriceUnit, |
| | | form.number |
| | | ); |
| | | if (form.taxRate) { |
| | | form.unTaxIncludingPriceTotal = calculateTaxExclusiveTotalPrice( |
| | | form.taxIncludingPriceTotal, |
| | | form.taxRate |
| | | ); |
| | | } |
| | | }; |
| | | |
| | | // æ¸
é¤è¡¨åæ ¡éªç¶æ |
| | | const clearValidate = () => { |
| | | formRef.value?.clearValidate(); |
| | | }; |
| | | |
| | | // éç½®è¡¨åæ°æ®åæ ¡éªç¶æ |
| | | const resetFormAndValidate = () => { |
| | | resetForm(); |
| | | clearValidate(); |
| | | }; |
| | | |
| | | defineExpose({ |
| | | form, |
| | | loadForm, |
| | | resetForm, |
| | | clearValidate, |
| | | resetFormAndValidate, |
| | | formRef, |
| | | }); |
| | | onMounted(() => { |
| | | customerList().then(res=>{ |
| | | customerDataList.value = res |
| | | }) |
| | | }); |
| | | </script> |
| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <el-dialog :title="modalOptions.title" v-model="visible" @close="close"> |
| | | <Form ref="formRef"></Form> |
| | | <template #footer> |
| | | <el-button type="primary" @click="sendForm" :loading="loading"> |
| | | {{ modalOptions.confirmText }} |
| | | </el-button> |
| | | <el-button @click="closeModal">{{ modalOptions.cancelText }}</el-button> |
| | | </template> |
| | | </el-dialog> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { useModal } from "@/hooks/useModal"; |
| | | import { addLedger, editLedger } from "@/api/equipmentManagement/ledger"; |
| | | import Form from "./Form.vue"; |
| | | import { ElMessage } from "element-plus"; |
| | | const { proxy } = getCurrentInstance() |
| | | |
| | | defineOptions({ |
| | | name: "设å¤å°è´¦æ°å¢ç¼è¾", |
| | | }); |
| | | |
| | | const emits = defineEmits(["success"]); |
| | | |
| | | const formRef = ref(); |
| | | const { |
| | | id, |
| | | visible, |
| | | loading, |
| | | openModal, |
| | | modalOptions, |
| | | customOptions, |
| | | handleConfirm, |
| | | closeModal, |
| | | } = useModal({ title: "项ç®å°è´¦" }); |
| | | |
| | | const sendForm = () => { |
| | | proxy.$refs.formRef.$refs.formRef.validate(async valid => { |
| | | if (valid) { |
| | | const {code} = id.value |
| | | ? await editLedger({id: id.value, ...formRef.value.form}) |
| | | : await addLedger(formRef.value.form); |
| | | if (code == 200) { |
| | | emits("success"); |
| | | ElMessage({message: "æä½æå", type: "success"}); |
| | | close(); |
| | | } else { |
| | | loading.value = false; |
| | | } |
| | | } |
| | | }) |
| | | }; |
| | | |
| | | const close = () => { |
| | | formRef.value.resetFormAndValidate(); |
| | | closeModal(); |
| | | }; |
| | | |
| | | const loadForm = async (id) => { |
| | | openModal(id); |
| | | await nextTick(); |
| | | formRef.value.loadForm(id); |
| | | }; |
| | | |
| | | defineExpose({ |
| | | openModal, |
| | | loadForm, |
| | | }); |
| | | </script> |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-form |
| | | :model="queryParams" |
| | | ref="queryRef" |
| | | :inline="true" |
| | | v-show="showSearch" |
| | | label-width="90px" |
| | | > |
| | | <el-form-item label="èµäº§åç§°" prop="assetName"> |
| | | <el-form :model="filters" :inline="true"> |
| | | <el-form-item label="项ç®åç§°"> |
| | | <el-input |
| | | v-model="queryParams.assetName" |
| | | placeholder="请è¾å
¥èµäº§åç§°" |
| | | clearable |
| | | style="width: 220px" |
| | | @keyup.enter="handleQuery" |
| | | v-model="filters.deviceName" |
| | | style="width: 240px" |
| | | placeholder="请è¾å
¥é¡¹ç®åç§°" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="getTableData" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="èµäº§ç¼å·" prop="assetCode"> |
| | | <el-form-item label="ååç¼å·"> |
| | | <el-input |
| | | v-model="queryParams.assetCode" |
| | | placeholder="请è¾å
¥èµäº§ç¼å·" |
| | | clearable |
| | | style="width: 240px" |
| | | @keyup.enter="handleQuery" |
| | | v-model="filters.deviceModel" |
| | | style="width: 240px" |
| | | placeholder="请è¾å
¥ååç¼å·" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="getTableData" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="æå±æ¿å
å" prop="contractorId"> |
| | | <el-select |
| | | v-model="queryParams.contractorId" |
| | | placeholder="è¯·éæ©æ¿å
å" |
| | | clearable |
| | | style="width: 240px" |
| | | > |
| | | <el-option |
| | | v-for="contractor in contractorOptions" |
| | | :key="contractor.contractorId" |
| | | :label="contractor.contractorName" |
| | | :value="contractor.contractorId" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="èµäº§ç¶æ" prop="status"> |
| | | <el-select |
| | | v-model="queryParams.status" |
| | | placeholder="èµäº§ç¶æ" |
| | | clearable |
| | | style="width: 240px" |
| | | > |
| | | <el-option |
| | | v-for="dict in asset_status" |
| | | :key="dict.value" |
| | | :label="dict.label" |
| | | :value="dict.value" |
| | | /> |
| | | </el-select> |
| | | <el-form-item label="å½å
¥æ¥æ:"> |
| | | <el-date-picker v-model="filters.entryDate" value-format="YYYY-MM-DD" format="YYYY-MM-DD" type="daterange" |
| | | placeholder="è¯·éæ©" clearable @change="changeDaterange" /> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" icon="Search" @click="handleQuery" |
| | | >æç´¢</el-button |
| | | > |
| | | <el-button icon="Refresh" @click="resetQuery">éç½®</el-button> |
| | | <el-button type="primary" @click="getTableData">æç´¢</el-button> |
| | | <el-button @click="resetFilters">éç½®</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <el-row :gutter="10" class="mb8"> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="primary" |
| | | plain |
| | | icon="Plus" |
| | | @click="handleAdd" |
| | | >æ°å¢</el-button |
| | | > |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="success" |
| | | plain |
| | | icon="Edit" |
| | | :disabled="single" |
| | | @click="handleUpdate" |
| | | >ä¿®æ¹</el-button |
| | | > |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="danger" |
| | | plain |
| | | icon="Delete" |
| | | :disabled="multiple" |
| | | @click="handleDelete" |
| | | >å é¤</el-button |
| | | > |
| | | </el-col> |
| | | <right-toolbar |
| | | v-model:showSearch="showSearch" |
| | | @queryTable="getList" |
| | | :columns="columns" |
| | | ></right-toolbar> |
| | | </el-row> |
| | | |
| | | <el-table |
| | | v-loading="loading" |
| | | :data="assetList" |
| | | @selection-change="handleSelectionChange" |
| | | stripe |
| | | > |
| | | <el-table-column type="selection" width="50" align="center" /> |
| | | <el-table-column |
| | | label="èµäº§ç¼å·" |
| | | align="center" |
| | | key="assetId" |
| | | prop="assetId" |
| | | v-if="columns[0].visible" |
| | | /> |
| | | <el-table-column |
| | | label="èµäº§åç§°" |
| | | align="center" |
| | | key="assetName" |
| | | prop="assetName" |
| | | v-if="columns[1].visible" |
| | | :show-overflow-tooltip="true" |
| | | /> |
| | | <el-table-column |
| | | label="èµäº§ç¼å·" |
| | | align="center" |
| | | key="assetCode" |
| | | prop="assetCode" |
| | | v-if="columns[2].visible" |
| | | /> |
| | | <el-table-column |
| | | label="æå±æ¿å
å" |
| | | align="center" |
| | | key="contractorName" |
| | | prop="contractorName" |
| | | v-if="columns[3].visible" |
| | | :show-overflow-tooltip="true" |
| | | /> |
| | | <el-table-column |
| | | label="èµäº§ç±»å" |
| | | align="center" |
| | | key="assetType" |
| | | prop="assetType" |
| | | v-if="columns[4].visible" |
| | | > |
| | | <template #default="scope"> |
| | | {{ getAssetTypeLabel(scope.row.assetType) }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="èµäº§ä»·å¼" |
| | | align="center" |
| | | key="assetValue" |
| | | prop="assetValue" |
| | | v-if="columns[5].visible" |
| | | > |
| | | <template #default="scope"> |
| | | {{ scope.row.assetValue.toFixed(2) }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="ç¶æ" |
| | | align="center" |
| | | key="status" |
| | | v-if="columns[6].visible" |
| | | > |
| | | <template #default="scope"> |
| | | <el-switch |
| | | v-model="scope.row.status" |
| | | active-value="0" |
| | | inactive-value="1" |
| | | @change="handleStatusChange(scope.row)" |
| | | ></el-switch> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="å建æ¶é´" |
| | | align="center" |
| | | prop="createTime" |
| | | v-if="columns[7].visible" |
| | | width="160" |
| | | > |
| | | <template #default="scope"> |
| | | <span>{{ parseTime(scope.row.createTime) }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="æä½" |
| | | align="center" |
| | | width="150" |
| | | class-name="small-padding fixed-width" |
| | | > |
| | | <template #default="scope"> |
| | | <el-tooltip |
| | | content="ä¿®æ¹" |
| | | placement="top" |
| | | > |
| | | <el-button |
| | | link |
| | | type="primary" |
| | | icon="Edit" |
| | | @click="handleUpdate(scope.row)" |
| | | ></el-button> |
| | | </el-tooltip> |
| | | <el-tooltip |
| | | content="å é¤" |
| | | placement="top" |
| | | > |
| | | <el-button |
| | | link |
| | | type="primary" |
| | | <div class="table_list"> |
| | | <div class="actions"> |
| | | <div></div> |
| | | <div> |
| | | <el-button type="primary" @click="add" icon="Plus"> æ°å¢ </el-button> |
| | | <el-button |
| | | type="danger" |
| | | icon="Delete" |
| | | @click="handleDelete(scope.row)" |
| | | ></el-button> |
| | | </el-tooltip> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <pagination |
| | | v-show="total > 0" |
| | | :total="total" |
| | | v-model:page="queryParams.pageNum" |
| | | v-model:limit="queryParams.pageSize" |
| | | @pagination="getList" |
| | | /> |
| | | |
| | | <!-- æ·»å æä¿®æ¹èµäº§é
ç½®å¯¹è¯æ¡ --> |
| | | <el-dialog :title="title" v-model="open" width="600px" append-to-body> |
| | | <el-form :model="form" :rules="rules" ref="assetRef" label-width="80px"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="èµäº§åç§°" prop="assetName"> |
| | | <el-input |
| | | v-model="form.assetName" |
| | | placeholder="请è¾å
¥èµäº§åç§°" |
| | | maxlength="50" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="èµäº§ç¼å·" prop="assetCode"> |
| | | <el-input |
| | | v-model="form.assetCode" |
| | | placeholder="请è¾å
¥èµäº§ç¼å·" |
| | | maxlength="20" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æå±æ¿å
å" prop="contractorId"> |
| | | <el-select |
| | | v-model="form.contractorId" |
| | | placeholder="è¯·éæ©æ¿å
å" |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="contractor in contractorOptions" |
| | | :key="contractor.contractorId" |
| | | :label="contractor.contractorName" |
| | | :value="contractor.contractorId" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="èµäº§ç±»å" prop="assetType"> |
| | | <el-select |
| | | v-model="form.assetType" |
| | | placeholder="è¯·éæ©èµäº§ç±»å" |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="type in asset_types" |
| | | :key="type.value" |
| | | :label="type.label" |
| | | :value="type.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="èµäº§ä»·å¼" prop="assetValue"> |
| | | <el-input |
| | | v-model="form.assetValue" |
| | | placeholder="请è¾å
¥èµäº§ä»·å¼" |
| | | type="number" |
| | | step="0.01" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ç¶æ"> |
| | | <el-radio-group v-model="form.status"> |
| | | <el-radio |
| | | v-for="dict in sys_normal_disable" |
| | | :key="dict.value" |
| | | :value="dict.value" |
| | | >{{ dict.label }}</el-radio |
| | | > |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="24"> |
| | | <el-form-item label="夿³¨"> |
| | | <el-input |
| | | v-model="form.remark" |
| | | type="textarea" |
| | | placeholder="请è¾å
¥å
容" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button type="primary" @click="submitForm">ç¡® å®</el-button> |
| | | <el-button @click="cancel">å æ¶</el-button> |
| | | :disabled="multipleList.length <= 0" |
| | | @click="deleteRow(multipleList.map((item) => item.id))" |
| | | > |
| | | æ¹éå é¤ |
| | | </el-button> |
| | | </div> |
| | | </template> |
| | | </div> |
| | | <PIMTable |
| | | rowKey="id" |
| | | isSelection |
| | | :column="columns" |
| | | :tableData="dataList" |
| | | :page="{ |
| | | current: pagination.currentPage, |
| | | size: pagination.pageSize, |
| | | total: pagination.total, |
| | | }" |
| | | :isShowSummary="true" |
| | | :summaryMethod="summaryMethod" |
| | | @selection-change="handleSelectionChange" |
| | | @pagination="changePage" |
| | | > |
| | | </PIMTable> |
| | | </div> |
| | | <Modal ref="modalRef" @success="getTableData"></Modal> |
| | | <el-dialog v-model="qrDialogVisible" title="äºç»´ç " width="300px"> |
| | | <div style="text-align:center;"> |
| | | <img :src="qrCodeUrl" alt="äºç»´ç " style="width:200px;height:200px;" /> |
| | | <div style="margin:10px 0;"> |
| | | <el-button type="primary" @click="downloadQRCode">ä¸è½½äºç»´ç å¾ç</el-button> |
| | | </div> |
| | | </div> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup name="ContractorAssets"> |
| | | import { ref, reactive, toRefs, watch, onMounted } from 'vue'; |
| | | import { ElMessage } from 'element-plus'; |
| | | import { parseTime } from '@/utils/ruoyi'; |
| | | <script setup> |
| | | import { usePaginationApi } from "@/hooks/usePaginationApi"; |
| | | import { getLedgerPage, delLedger } from "@/api/equipmentManagement/ledger"; |
| | | import { onMounted, getCurrentInstance } from "vue"; |
| | | import Modal from "./Modal.vue"; |
| | | import { ElMessageBox, ElMessage } from "element-plus"; |
| | | import dayjs from "dayjs"; |
| | | import QRCode from "qrcode"; |
| | | import { ref } from "vue"; |
| | | import { summarizeTable } from "@/utils/summarizeTable"; |
| | | import {Search} from "@element-plus/icons-vue"; |
| | | |
| | | const assetList = ref([]); |
| | | const open = ref(false); |
| | | const loading = ref(true); |
| | | const showSearch = ref(true); |
| | | const ids = ref([]); |
| | | const single = ref(true); |
| | | const multiple = ref(true); |
| | | const total = ref(0); |
| | | const title = ref(""); |
| | | |
| | | // åæ¾éä¿¡æ¯ |
| | | const columns = ref([ |
| | | { key: 0, label: `èµäº§ç¼å·`, visible: true }, |
| | | { key: 1, label: `èµäº§åç§°`, visible: true }, |
| | | { key: 2, label: `èµäº§ç¼å·`, visible: true }, |
| | | { key: 3, label: `æå±æ¿å
å`, visible: true }, |
| | | { key: 4, label: `èµäº§ç±»å`, visible: true }, |
| | | { key: 5, label: `èµäº§ä»·å¼`, visible: true }, |
| | | { key: 6, label: `ç¶æ`, visible: true }, |
| | | { key: 7, label: `å建æ¶é´`, visible: true }, |
| | | ]); |
| | | |
| | | const data = reactive({ |
| | | form: { |
| | | assetId: undefined, |
| | | assetName: undefined, |
| | | assetCode: undefined, |
| | | contractorId: undefined, |
| | | contractorName: undefined, |
| | | assetType: undefined, |
| | | assetValue: 0, |
| | | status: "0", |
| | | remark: undefined, |
| | | }, |
| | | queryParams: { |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | assetName: undefined, |
| | | assetCode: undefined, |
| | | contractorId: undefined, |
| | | status: undefined, |
| | | }, |
| | | rules: { |
| | | assetName: [ |
| | | { required: true, message: "èµäº§åç§°ä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | ], |
| | | assetCode: [ |
| | | { required: true, message: "èµäº§ç¼å·ä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | ], |
| | | contractorId: [ |
| | | { required: true, message: "æå±æ¿å
åä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | ], |
| | | assetType: [ |
| | | { required: true, message: "èµäº§ç±»åä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | ], |
| | | assetValue: [ |
| | | { required: true, message: "èµäº§ä»·å¼ä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | { type: "number", message: "请è¾å
¥æ£ç¡®çæ°å", trigger: "blur" }, |
| | | ], |
| | | }, |
| | | defineOptions({ |
| | | name: "设å¤å°è´¦", |
| | | }); |
| | | |
| | | const { queryParams, form, rules } = toRefs(data); |
| | | // è¡¨æ ¼å¤éæ¡éä¸é¡¹ |
| | | const multipleList = ref([]); |
| | | const { proxy } = getCurrentInstance(); |
| | | const modalRef = ref(); |
| | | const qrDialogVisible = ref(false); |
| | | const qrCodeUrl = ref(""); |
| | | const qrRowData = ref(null); |
| | | |
| | | // æ¨¡ææ¿å
åæ°æ® |
| | | const contractorOptions = ref([ |
| | | { contractorId: 1, contractorName: "å京建工éå¢" }, |
| | | { contractorId: 2, contractorName: "䏿µ·å建éå¢" }, |
| | | { contractorId: 3, contractorName: "广å·å»ºçéå¢" }, |
| | | { contractorId: 4, contractorName: "æ·±å³å»ºå·¥éå¢" }, |
| | | { contractorId: 5, contractorName: "æå·å»ºå·¥éå¢" }, |
| | | ]); |
| | | const { |
| | | filters, |
| | | columns, |
| | | dataList, |
| | | pagination, |
| | | getTableData, |
| | | resetFilters, |
| | | onCurrentChange, |
| | | } = usePaginationApi( |
| | | getLedgerPage, |
| | | { |
| | | deviceName: undefined, |
| | | deviceModel: undefined, |
| | | supplierName: undefined, |
| | | unit: undefined, |
| | | entryDateStart: undefined, |
| | | entryDateEnd: undefined, |
| | | }, |
| | | [ |
| | | { |
| | | label: "项ç®åç§°", |
| | | align: "center", |
| | | prop: "deviceName", |
| | | }, |
| | | { |
| | | label: "ååç¼å·", |
| | | align: "center", |
| | | prop: "deviceModel", |
| | | }, |
| | | { |
| | | label: "æ¿å
å", |
| | | align: "center", |
| | | prop: "supplierName", |
| | | }, |
| | | { |
| | | label: "仿¬¾æ¹å¼", |
| | | align: "center", |
| | | prop: "unit", |
| | | }, |
| | | { |
| | | label: "æ°é", |
| | | align: "center", |
| | | prop: "number", |
| | | }, |
| | | { |
| | | label: "å«ç¨åä»·", |
| | | align: "center", |
| | | prop: "taxIncludingPriceUnit", |
| | | }, |
| | | { |
| | | label: "å«ç¨æ»ä»·", |
| | | align: "center", |
| | | prop: "taxIncludingPriceTotal", |
| | | }, |
| | | { |
| | | label: "ç¨ç", |
| | | align: "center", |
| | | prop: "taxRate", |
| | | }, |
| | | { |
| | | label: "ä¸å«ç¨æ»ä»·", |
| | | align: "center", |
| | | prop: "unTaxIncludingPriceTotal", |
| | | }, |
| | | { |
| | | label: "å½å
¥äºº", |
| | | align: "center", |
| | | prop: "createUser", |
| | | }, |
| | | { |
| | | label: "å½å
¥æ¥æ", |
| | | align: "center", |
| | | prop: "createTime", |
| | | }, |
| | | { |
| | | dataType: "action", |
| | | label: "æä½", |
| | | align: "center", |
| | | fixed: 'right', |
| | | width: 140, |
| | | operation: [ |
| | | { |
| | | name: "ç¼è¾", |
| | | type: "text", |
| | | clickFun: (row) => { |
| | | edit(row.id) |
| | | }, |
| | | }, |
| | | ], |
| | | }, |
| | | ] |
| | | ); |
| | | |
| | | // èµäº§ç±»ååå
¸ |
| | | const asset_types = ref([ |
| | | { value: "equipment", label: "设å¤" }, |
| | | { value: "material", label: "ææ" }, |
| | | { value: "vehicle", label: "车è¾" }, |
| | | { value: "tool", label: "å·¥å
·" }, |
| | | { value: "other", label: "å
¶ä»" }, |
| | | ]); |
| | | // å¤éååä»ä¹ |
| | | const handleSelectionChange = (selectionList) => { |
| | | multipleList.value = selectionList; |
| | | }; |
| | | |
| | | // èµäº§ç¶æåå
¸ |
| | | const asset_status = ref([ |
| | | { value: "0", label: "æ£å¸¸" }, |
| | | { value: "1", label: "ç¦ç¨" }, |
| | | { value: "2", label: "ç»´ä¿®ä¸" }, |
| | | { value: "3", label: "å·²æ¥åº" }, |
| | | ]); |
| | | const add = () => { |
| | | modalRef.value.openModal(); |
| | | }; |
| | | const edit = (id) => { |
| | | modalRef.value.loadForm(id); |
| | | }; |
| | | const changePage = ({ page, limit }) => { |
| | | pagination.currentPage = page; |
| | | pagination.pageSize = limit; |
| | | onCurrentChange(page); |
| | | }; |
| | | |
| | | // æ£å¸¸ç¦ç¨åå
¸ |
| | | const sys_normal_disable = ref([ |
| | | { value: "0", label: "æ£å¸¸" }, |
| | | { value: "1", label: "ç¦ç¨" }, |
| | | ]); |
| | | // åè®¡æ¹æ³ |
| | | const summaryMethod = (param) => { |
| | | return summarizeTable( |
| | | param, |
| | | ['number', 'taxIncludingPriceTotal', 'unTaxIncludingPriceTotal', 'taxIncludingPriceUnit'], |
| | | { |
| | | number: { noDecimal: true }, |
| | | taxIncludingPriceTotal: { decimalPlaces: 2 }, |
| | | unTaxIncludingPriceTotal: { decimalPlaces: 2 } |
| | | } |
| | | ); |
| | | }; |
| | | |
| | | // 模æèµäº§æ°æ® |
| | | const mockAssets = ref([ |
| | | { |
| | | assetId: 1, |
| | | assetName: "æææº", |
| | | assetCode: "ASSET001", |
| | | contractorId: 1, |
| | | contractorName: "å京建工éå¢", |
| | | assetType: "equipment", |
| | | assetValue: 500000.00, |
| | | status: "0", |
| | | createTime: "2024-01-01 10:00:00", |
| | | remark: "大忿æº", |
| | | }, |
| | | { |
| | | assetId: 2, |
| | | assetName: "æ··ååæ
ææº", |
| | | assetCode: "ASSET002", |
| | | contractorId: 2, |
| | | contractorName: "䏿µ·å建éå¢", |
| | | assetType: "equipment", |
| | | assetValue: 150000.00, |
| | | status: "0", |
| | | createTime: "2024-01-02 10:00:00", |
| | | remark: "æ··ååæ
æè®¾å¤", |
| | | }, |
| | | { |
| | | assetId: 3, |
| | | assetName: "è£
è½½æº", |
| | | assetCode: "ASSET003", |
| | | contractorId: 3, |
| | | contractorName: "广å·å»ºçéå¢", |
| | | assetType: "equipment", |
| | | assetValue: 300000.00, |
| | | status: "1", |
| | | createTime: "2024-01-03 10:00:00", |
| | | remark: "è£
è½½æºè®¾å¤", |
| | | }, |
| | | { |
| | | assetId: 4, |
| | | assetName: "è¿è¾å¡è½¦", |
| | | assetCode: "ASSET004", |
| | | contractorId: 4, |
| | | contractorName: "æ·±å³å»ºå·¥éå¢", |
| | | assetType: "vehicle", |
| | | assetValue: 400000.00, |
| | | status: "0", |
| | | createTime: "2024-01-04 10:00:00", |
| | | remark: "éåè¿è¾å¡è½¦", |
| | | }, |
| | | { |
| | | assetId: 5, |
| | | assetName: "é¢çåææº", |
| | | assetCode: "ASSET005", |
| | | contractorId: 5, |
| | | contractorName: "æå·å»ºå·¥éå¢", |
| | | assetType: "tool", |
| | | assetValue: 20000.00, |
| | | status: "0", |
| | | createTime: "2024-01-05 10:00:00", |
| | | remark: "é¢çå 工设å¤", |
| | | }, |
| | | ]); |
| | | |
| | | /** è·åèµäº§ç±»åæ ç¾ */ |
| | | function getAssetTypeLabel(value) { |
| | | const type = asset_types.value.find(item => item.value === value); |
| | | return type ? type.label : value; |
| | | } |
| | | |
| | | /** æ¥è¯¢èµäº§å表 */ |
| | | function getList() { |
| | | loading.value = true; |
| | | // 模æAPI请æ±å»¶è¿ |
| | | setTimeout(() => { |
| | | let data = [...mockAssets]; |
| | | // 模ææç´¢è¿æ»¤ |
| | | if (queryParams.value.assetName) { |
| | | data = data.filter(item => item.assetName.includes(queryParams.value.assetName)); |
| | | const deleteRow = (id) => { |
| | | ElMessageBox.confirm("æ¤æä½å°æ°¸ä¹
å é¤è¯¥æä»¶, æ¯å¦ç»§ç»?", "æç¤º", { |
| | | confirmButtonText: "ç¡®å®", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | }).then(async () => { |
| | | const { code } = await delLedger(id); |
| | | if (code == 200) { |
| | | ElMessage({ |
| | | type: "success", |
| | | message: "å 餿å", |
| | | }); |
| | | getTableData(); |
| | | } |
| | | if (queryParams.value.assetCode) { |
| | | data = data.filter(item => item.assetCode.includes(queryParams.value.assetCode)); |
| | | } |
| | | if (queryParams.value.contractorId) { |
| | | data = data.filter(item => item.contractorId === queryParams.value.contractorId); |
| | | } |
| | | if (queryParams.value.status) { |
| | | data = data.filter(item => item.status === queryParams.value.status); |
| | | } |
| | | // 模æå页 |
| | | const start = (queryParams.value.pageNum - 1) * queryParams.value.pageSize; |
| | | const end = start + queryParams.value.pageSize; |
| | | assetList.value = data.slice(start, end); |
| | | total.value = data.length; |
| | | loading.value = false; |
| | | }, 500); |
| | | } |
| | | |
| | | /** æç´¢æé®æä½ */ |
| | | function handleQuery() { |
| | | queryParams.value.pageNum = 1; |
| | | getList(); |
| | | } |
| | | |
| | | /** éç½®æé®æä½ */ |
| | | function resetQuery() { |
| | | Object.assign(queryParams.value, { |
| | | assetName: undefined, |
| | | assetCode: undefined, |
| | | contractorId: undefined, |
| | | status: undefined, |
| | | }); |
| | | handleQuery(); |
| | | } |
| | | }; |
| | | |
| | | /** å é¤æé®æä½ */ |
| | | function handleDelete(row) { |
| | | const assetIds = row.assetId || ids.value; |
| | | ElMessage.confirm(`æ¯å¦ç¡®è®¤å é¤èµäº§ç¼å·ä¸º"${assetIds}"çæ°æ®é¡¹ï¼`).then(() => { |
| | | // 模æå é¤æä½ |
| | | ElMessage.success("å 餿å"); |
| | | getList(); |
| | | }).catch(() => {}); |
| | | } |
| | | |
| | | /** ç¶æä¿®æ¹ */ |
| | | function handleStatusChange(row) { |
| | | let text = row.status === "0" ? "å¯ç¨" : "åç¨"; |
| | | ElMessage.confirm(`确认è¦"${text}""${row.assetName}"èµäº§å?`).then(() => { |
| | | // 模æç¶æä¿®æ¹ |
| | | ElMessage.success(text + "æå"); |
| | | getList(); |
| | | }).catch(() => { |
| | | row.status = row.status === "0" ? "1" : "0"; |
| | | }); |
| | | } |
| | | |
| | | /** éæ©æ¡æ° */ |
| | | function handleSelectionChange(selection) { |
| | | ids.value = selection.map((item) => item.assetId); |
| | | single.value = selection.length != 1; |
| | | multiple.value = !selection.length; |
| | | } |
| | | |
| | | /** éç½®æä½è¡¨å */ |
| | | function reset() { |
| | | form.value = { |
| | | assetId: undefined, |
| | | assetName: undefined, |
| | | assetCode: undefined, |
| | | contractorId: undefined, |
| | | contractorName: undefined, |
| | | assetType: undefined, |
| | | assetValue: 0, |
| | | status: "0", |
| | | remark: undefined, |
| | | }; |
| | | } |
| | | |
| | | /** åæ¶æé® */ |
| | | function cancel() { |
| | | open.value = false; |
| | | reset(); |
| | | } |
| | | |
| | | /** æ°å¢æé®æä½ */ |
| | | function handleAdd() { |
| | | reset(); |
| | | open.value = true; |
| | | title.value = "æ·»å èµäº§"; |
| | | } |
| | | |
| | | /** ä¿®æ¹æé®æä½ */ |
| | | function handleUpdate(row) { |
| | | reset(); |
| | | const assetId = row.assetId || ids.value; |
| | | // 模æè·å详æ
|
| | | const asset = mockAssets.find(item => item.assetId === assetId); |
| | | if (asset) { |
| | | form.value = { ...asset }; |
| | | open.value = true; |
| | | title.value = "ä¿®æ¹èµäº§"; |
| | | const changeDaterange = (value) => { |
| | | if (value) { |
| | | filters.entryDateStart = dayjs(value[0]).format("YYYY-MM-DD"); |
| | | filters.entryDateEnd = dayjs(value[1]).format("YYYY-MM-DD"); |
| | | } else { |
| | | filters.entryDateStart = undefined; |
| | | filters.entryDateEnd = undefined; |
| | | } |
| | | } |
| | | getTableData(); |
| | | }; |
| | | |
| | | /** æäº¤æé® */ |
| | | function submitForm() { |
| | | // 模æè¡¨åéªè¯ |
| | | const requiredFields = ['assetName', 'assetCode', 'contractorId', 'assetType', 'assetValue']; |
| | | const isInvalid = requiredFields.some(field => !form.value[field]); |
| | | const handleOut = () => { |
| | | ElMessageBox.confirm("éä¸çå
容å°è¢«å¯¼åºï¼æ¯å¦ç¡®è®¤å¯¼åºï¼", "导åº", { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | proxy.download(`/device/ledger/export`, {}, "设å¤å°è´¦æ¡£æ¡.xlsx"); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已忶"); |
| | | }); |
| | | }; |
| | | |
| | | if (isInvalid) { |
| | | ElMessage.error("请填åå¿
å¡«åæ®µ"); |
| | | return; |
| | | } |
| | | const showQRCode = async (row) => { |
| | | // ä½ å¯ä»¥èªå®ä¹äºç»´ç å
å®¹ï¼æ¯å¦ row.id æ row.deviceName |
| | | const qrContent = JSON.stringify(row); // æ `${row.id}` |
| | | qrCodeUrl.value = await QRCode.toDataURL(qrContent); |
| | | qrRowData.value = row; |
| | | qrDialogVisible.value = true; |
| | | }; |
| | | |
| | | // 模ææäº¤æä½ |
| | | ElMessage.success(title.value === "æ·»å èµäº§" ? "æ°å¢æå" : "ä¿®æ¹æå"); |
| | | open.value = false; |
| | | getList(); |
| | | } |
| | | const downloadQRCode = () => { |
| | | const a = document.createElement("a"); |
| | | a.href = qrCodeUrl.value; |
| | | a.download = `${qrRowData.value.deviceName || "äºç»´ç "}.png`; |
| | | a.click(); |
| | | }; |
| | | |
| | | onMounted(() => { |
| | | getList(); |
| | | filters.entryDate = [ |
| | | dayjs().format("YYYY-MM-DD"), |
| | | dayjs().add(1, "day").format("YYYY-MM-DD"), |
| | | ] |
| | | filters.entryDateStart = dayjs().format("YYYY-MM-DD") |
| | | filters.entryDateEnd = dayjs().add(1, "day").format("YYYY-MM-DD") |
| | | getTableData(); |
| | | }); |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .table_list { |
| | | margin-top: unset; |
| | | } |
| | | .actions { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | margin-bottom: 10px; |
| | | } |
| | | </style> |
| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div> |
| | | <el-dialog |
| | | v-model="dialogFormVisible" |
| | | :title="operationType === 'add' ? 'æ°å¢å
¥è' : 'ç¼è¾äººå'" |
| | | width="70%" |
| | | @close="closeDia" |
| | | > |
| | | <el-form :model="form" label-width="140px" label-position="top" :rules="rules" ref="formRef"> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="åè§åç§°ï¼" prop="staffName"> |
| | | <el-input v-model="form.staffName" placeholder="请è¾å
¥" clearable/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="åè§ç¼å·ï¼" prop="staffNo"> |
| | | <el-input v-model="form.staffNo" placeholder="请è¾å
¥" clearable :disabled="operationType !== 'add'"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æå±æ¿å
åï¼" prop="nativePlace"> |
| | | <el-select v-model="form.nativePlace" placeholder="è¯·éæ©" clearable style="width: 100%"> |
| | | <el-option v-for="item in customerDataList" :key="item.id" :label="item.customerName + '(' + item.taxpayerIdentificationNumber + ')'" :value="item.customerName"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="åè§ç±»åï¼" prop="postJob"> |
| | | <el-select v-model="form.postJob" placeholder="è¯·éæ©" clearable style="width: 100%"> |
| | | <el-option |
| | | v-for="item in ruleList" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æææå¼å§ï¼" prop="contractStartTime"> |
| | | <el-date-picker |
| | | v-model="form.contractStartTime" |
| | | type="date" |
| | | placeholder="è¯·éæ©æ¥æ" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | clearable |
| | | style="width: 100%" |
| | | @change="calculateContractTerm" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æææç»æï¼" prop="contractEndTime"> |
| | | <el-date-picker |
| | | v-model="form.contractEndTime" |
| | | type="date" |
| | | placeholder="è¯·éæ©æ¥æ" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | clearable |
| | | style="width: 100%" |
| | | @change="calculateContractTerm" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="24"> |
| | | <el-form-item label="夿³¨ï¼" prop="adress"> |
| | | <el-input type="textarea" :rows="2" v-model="form.adress" placeholder="请è¾å
¥" clearable/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button type="primary" @click="submitForm">确认</el-button> |
| | | <el-button @click="closeDia">åæ¶</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import {ref, reactive, toRefs} from "vue"; |
| | | import {getStaffJoinInfo, staffJoinAdd, staffJoinUpdate} from "@/api/personnelManagement/onboarding.js"; |
| | | import {customerList} from "@/api/salesManagement/salesLedger.js"; |
| | | const { proxy } = getCurrentInstance() |
| | | const emit = defineEmits(['close']) |
| | | |
| | | const dialogFormVisible = ref(false); |
| | | const operationType = ref('') |
| | | const customerDataList = ref([]) |
| | | const data = reactive({ |
| | | form: { |
| | | staffNo: "", |
| | | staffName: "", |
| | | sex: "", |
| | | nativePlace: "", |
| | | postJob: "", |
| | | adress: "", |
| | | firstStudy: "", |
| | | profession: "", |
| | | identityCard: "", |
| | | age: 0, |
| | | phone: "", |
| | | emergencyContact: "", |
| | | emergencyContactPhone: "", |
| | | contractTerm: 0, |
| | | contractStartTime: "", |
| | | contractEndTime: "", |
| | | staffState: "", |
| | | probationPeriod: 3, // é»è®¤è¯ç¨æ3个æ |
| | | }, |
| | | ruleList: [ |
| | | {label:'许å¯è¯',value:'许å¯è¯'}, |
| | | {label:'è¯ä¹¦',value:'è¯ä¹¦'}, |
| | | {label:'æ³è§éµå¾ª',value:'æ³è§éµå¾ª'}, |
| | | {label:'æ ååè§',value:'æ ååè§'}, |
| | | {label:'å
¶ä»',value:'å
¶ä»'}, |
| | | ], |
| | | |
| | | rules: { |
| | | staffNo: [{ required: true, message: "请è¾å
¥", trigger: "blur" },], |
| | | staffName: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | sex: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | nativePlace: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | postJob: [{ required: true, message: "è¯·éæ©", trigger: "change" }], |
| | | firstStudy: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | profession: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | identityCard: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | age: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | phone: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | emergencyContact: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | emergencyContactPhone: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | contractTerm: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | contractStartTime: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | contractEndTime: [{ required: true, message: "请è¾å
¥", trigger: "blur" }], |
| | | }, |
| | | }); |
| | | const { form,ruleList, rules } = toRefs(data); |
| | | |
| | | // æå¼å¼¹æ¡ |
| | | const openDialog = (type, row) => { |
| | | customerList().then(res=>{ |
| | | customerDataList.value = res |
| | | }) |
| | | operationType.value = type; |
| | | dialogFormVisible.value = true; |
| | | if (operationType.value === 'edit') { |
| | | getStaffJoinInfo(row.id).then(res => { |
| | | form.value = {...res.data} |
| | | // ç¼è¾æ¶ä¹è®¡ç®ä¸æ¬¡ååå¹´é |
| | | calculateContractTerm(); |
| | | }) |
| | | } |
| | | } |
| | | // æäº¤äº§å表å |
| | | const submitForm = () => { |
| | | proxy.$refs.formRef.validate(valid => { |
| | | if (valid) { |
| | | form.value.staffState = 1 |
| | | if (operationType.value === "add") { |
| | | staffJoinAdd(form.value).then(res => { |
| | | proxy.$modal.msgSuccess("æäº¤æå"); |
| | | closeDia(); |
| | | }) |
| | | } else { |
| | | staffJoinUpdate(form.value).then(res => { |
| | | proxy.$modal.msgSuccess("æäº¤æå"); |
| | | closeDia(); |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | // 计ç®ååå¹´é |
| | | const calculateContractTerm = () => { |
| | | if (form.value.contractStartTime && form.value.contractEndTime) { |
| | | const startDate = new Date(form.value.contractStartTime); |
| | | const endDate = new Date(form.value.contractEndTime); |
| | | |
| | | if (endDate > startDate) { |
| | | // 计ç®å¹´ä»½å·® |
| | | const yearDiff = endDate.getFullYear() - startDate.getFullYear(); |
| | | const monthDiff = endDate.getMonth() - startDate.getMonth(); |
| | | const dayDiff = endDate.getDate() - startDate.getDate(); |
| | | |
| | | let years = yearDiff; |
| | | |
| | | // å¦æç»ææ¥æçææ¥å°äºå¼å§æ¥æçææ¥ï¼ååå»1å¹´ |
| | | if (monthDiff < 0 || (monthDiff === 0 && dayDiff < 0)) { |
| | | years = yearDiff - 1; |
| | | } |
| | | |
| | | form.value.contractTerm = Math.max(0, years); |
| | | } else { |
| | | form.value.contractTerm = 0; |
| | | } |
| | | } else { |
| | | form.value.contractTerm = 0; |
| | | } |
| | | }; |
| | | |
| | | // å
³éå¼¹æ¡ |
| | | const closeDia = () => { |
| | | proxy.resetForm("formRef"); |
| | | dialogFormVisible.value = false; |
| | | emit('close') |
| | | }; |
| | | defineExpose({ |
| | | openDialog, |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped> |
| | | |
| | | </style> |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-form |
| | | :model="queryParams" |
| | | ref="queryRef" |
| | | :inline="true" |
| | | v-show="showSearch" |
| | | label-width="90px" |
| | | > |
| | | <el-form-item label="åè§åç§°" prop="complianceName"> |
| | | <div class="search_form"> |
| | | <div> |
| | | <span class="search_title">åè§åç§°ï¼</span> |
| | | <el-input |
| | | v-model="queryParams.complianceName" |
| | | placeholder="请è¾å
¥åè§åç§°" |
| | | clearable |
| | | style="width: 220px" |
| | | @keyup.enter="handleQuery" |
| | | v-model="searchForm.staffName" |
| | | style="width: 240px" |
| | | placeholder="请è¾å
¥åè§åç§°" |
| | | @change="handleQuery" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="åè§ç¼å·" prop="complianceCode"> |
| | | <el-input |
| | | v-model="queryParams.complianceCode" |
| | | placeholder="请è¾å
¥åè§ç¼å·" |
| | | clearable |
| | | style="width: 240px" |
| | | @keyup.enter="handleQuery" |
| | | <span style="margin-left: 10px;" class="search_title">æææå¼å§ï¼</span> |
| | | <el-date-picker |
| | | v-model="searchForm.entryDateStart" |
| | | type="date" |
| | | placeholder="è¯·éæ©" |
| | | size="default" |
| | | @change="(date) => handleDateChange(date,1)" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="æå±æ¿å
å" prop="contractorId"> |
| | | <el-select |
| | | v-model="queryParams.contractorId" |
| | | placeholder="è¯·éæ©æ¿å
å" |
| | | clearable |
| | | style="width: 240px" |
| | | <span style="margin-left: 10px;" class="search_title">æææç»æï¼</span> |
| | | <el-date-picker |
| | | v-model="searchForm.entryDateEnd" |
| | | type="date" |
| | | placeholder="è¯·éæ©" |
| | | size="default" |
| | | @change="(date) => handleDateChange(date,2)" |
| | | /> |
| | | <el-button type="primary" @click="handleQuery" style="margin-left: 10px" |
| | | >æç´¢</el-button |
| | | > |
| | | <el-option |
| | | v-for="contractor in contractorOptions" |
| | | :key="contractor.contractorId" |
| | | :label="contractor.contractorName" |
| | | :value="contractor.contractorId" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="åè§ç¶æ" prop="status"> |
| | | <el-select |
| | | v-model="queryParams.status" |
| | | placeholder="åè§ç¶æ" |
| | | clearable |
| | | style="width: 240px" |
| | | > |
| | | <el-option |
| | | v-for="dict in compliance_status" |
| | | :key="dict.value" |
| | | :label="dict.label" |
| | | :value="dict.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" icon="Search" @click="handleQuery" |
| | | >æç´¢</el-button |
| | | > |
| | | <el-button icon="Refresh" @click="resetQuery">éç½®</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <el-row :gutter="10" class="mb8"> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="primary" |
| | | plain |
| | | icon="Plus" |
| | | @click="handleAdd" |
| | | >æ°å¢</el-button |
| | | > |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="success" |
| | | plain |
| | | icon="Edit" |
| | | :disabled="single" |
| | | @click="handleUpdate" |
| | | >ä¿®æ¹</el-button |
| | | > |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="danger" |
| | | plain |
| | | icon="Delete" |
| | | :disabled="multiple" |
| | | @click="handleDelete" |
| | | >å é¤</el-button |
| | | > |
| | | </el-col> |
| | | <right-toolbar |
| | | v-model:showSearch="showSearch" |
| | | @queryTable="getList" |
| | | :columns="columns" |
| | | ></right-toolbar> |
| | | </el-row> |
| | | |
| | | <el-table |
| | | v-loading="loading" |
| | | :data="complianceList" |
| | | @selection-change="handleSelectionChange" |
| | | stripe |
| | | > |
| | | <el-table-column type="selection" width="50" align="center" /> |
| | | <el-table-column |
| | | label="åè§ID" |
| | | align="center" |
| | | key="complianceId" |
| | | prop="complianceId" |
| | | v-if="columns[0].visible" |
| | | /> |
| | | <el-table-column |
| | | label="åè§åç§°" |
| | | align="center" |
| | | key="complianceName" |
| | | prop="complianceName" |
| | | v-if="columns[1].visible" |
| | | :show-overflow-tooltip="true" |
| | | /> |
| | | <el-table-column |
| | | label="åè§ç¼å·" |
| | | align="center" |
| | | key="complianceCode" |
| | | prop="complianceCode" |
| | | v-if="columns[2].visible" |
| | | /> |
| | | <el-table-column |
| | | label="æå±æ¿å
å" |
| | | align="center" |
| | | key="contractorName" |
| | | prop="contractorName" |
| | | v-if="columns[3].visible" |
| | | :show-overflow-tooltip="true" |
| | | /> |
| | | <el-table-column |
| | | label="åè§ç±»å" |
| | | align="center" |
| | | key="complianceType" |
| | | prop="complianceType" |
| | | v-if="columns[4].visible" |
| | | > |
| | | <template #default="scope"> |
| | | {{ getComplianceTypeLabel(scope.row.complianceType) }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="æææå¼å§" |
| | | align="center" |
| | | key="validStartDate" |
| | | prop="validStartDate" |
| | | v-if="columns[5].visible" |
| | | width="140" |
| | | /> |
| | | <el-table-column |
| | | label="æææç»æ" |
| | | align="center" |
| | | key="validEndDate" |
| | | prop="validEndDate" |
| | | v-if="columns[6].visible" |
| | | width="140" |
| | | /> |
| | | <el-table-column |
| | | label="ç¶æ" |
| | | align="center" |
| | | key="status" |
| | | v-if="columns[7].visible" |
| | | > |
| | | <template #default="scope"> |
| | | <el-switch |
| | | v-model="scope.row.status" |
| | | active-value="0" |
| | | inactive-value="1" |
| | | @change="handleStatusChange(scope.row)" |
| | | ></el-switch> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="å建æ¶é´" |
| | | align="center" |
| | | prop="createTime" |
| | | v-if="columns[8].visible" |
| | | width="160" |
| | | > |
| | | <template #default="scope"> |
| | | <span>{{ parseTime(scope.row.createTime) }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="æä½" |
| | | align="center" |
| | | width="150" |
| | | class-name="small-padding fixed-width" |
| | | > |
| | | <template #default="scope"> |
| | | <el-tooltip |
| | | content="ä¿®æ¹" |
| | | placement="top" |
| | | > |
| | | <el-button |
| | | link |
| | | type="primary" |
| | | icon="Edit" |
| | | @click="handleUpdate(scope.row)" |
| | | ></el-button> |
| | | </el-tooltip> |
| | | <el-tooltip |
| | | content="å é¤" |
| | | placement="top" |
| | | > |
| | | <el-button |
| | | link |
| | | type="primary" |
| | | icon="Delete" |
| | | @click="handleDelete(scope.row)" |
| | | ></el-button> |
| | | </el-tooltip> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <pagination |
| | | v-show="total > 0" |
| | | :total="total" |
| | | v-model:page="queryParams.pageNum" |
| | | v-model:limit="queryParams.pageSize" |
| | | @pagination="getList" |
| | | /> |
| | | |
| | | <!-- æ·»å æä¿®æ¹åè§é
ç½®å¯¹è¯æ¡ --> |
| | | <el-dialog :title="title" v-model="open" width="600px" append-to-body> |
| | | <el-form :model="form" :rules="rules" ref="complianceRef" label-width="80px"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="åè§åç§°" prop="complianceName"> |
| | | <el-input |
| | | v-model="form.complianceName" |
| | | placeholder="请è¾å
¥åè§åç§°" |
| | | maxlength="50" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="åè§ç¼å·" prop="complianceCode"> |
| | | <el-input |
| | | v-model="form.complianceCode" |
| | | placeholder="请è¾å
¥åè§ç¼å·" |
| | | maxlength="20" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æå±æ¿å
å" prop="contractorId"> |
| | | <el-select |
| | | v-model="form.contractorId" |
| | | placeholder="è¯·éæ©æ¿å
å" |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="contractor in contractorOptions" |
| | | :key="contractor.contractorId" |
| | | :label="contractor.contractorName" |
| | | :value="contractor.contractorId" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="åè§ç±»å" prop="complianceType"> |
| | | <el-select |
| | | v-model="form.complianceType" |
| | | placeholder="è¯·éæ©åè§ç±»å" |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="type in compliance_types" |
| | | :key="type.value" |
| | | :label="type.label" |
| | | :value="type.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æææå¼å§" prop="validStartDate"> |
| | | <el-date-picker |
| | | v-model="form.validStartDate" |
| | | type="date" |
| | | placeholder="éæ©å¼å§æ¥æ" |
| | | value-format="YYYY-MM-DD" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æææç»æ" prop="validEndDate"> |
| | | <el-date-picker |
| | | v-model="form.validEndDate" |
| | | type="date" |
| | | placeholder="éæ©ç»ææ¥æ" |
| | | value-format="YYYY-MM-DD" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ç¶æ"> |
| | | <el-radio-group v-model="form.status"> |
| | | <el-radio |
| | | v-for="dict in sys_normal_disable" |
| | | :key="dict.value" |
| | | :value="dict.value" |
| | | >{{ dict.label }}</el-radio |
| | | > |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="24"> |
| | | <el-form-item label="夿³¨"> |
| | | <el-input |
| | | v-model="form.remark" |
| | | type="textarea" |
| | | placeholder="请è¾å
¥å
容" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button type="primary" @click="submitForm">ç¡® å®</el-button> |
| | | <el-button @click="cancel">å æ¶</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | <div> |
| | | <el-button type="primary" @click="openForm('add')">æ°å¢</el-button> |
| | | <el-button type="danger" plain @click="handleDelete">å é¤</el-button> |
| | | </div> |
| | | </div> |
| | | <div class="table_list"> |
| | | <PIMTable |
| | | rowKey="id" |
| | | :column="tableColumn" |
| | | :tableData="tableData" |
| | | :page="page" |
| | | :isSelection="true" |
| | | @selection-change="handleSelectionChange" |
| | | :tableLoading="tableLoading" |
| | | @pagination="pagination" |
| | | :total="page.total" |
| | | ></PIMTable> |
| | | </div> |
| | | <form-dia ref="formDia" @close="handleQuery"></form-dia> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup name="ContractorCompliance"> |
| | | import { ref, reactive, toRefs, watch, onMounted } from 'vue'; |
| | | import { ElMessage } from 'element-plus'; |
| | | import { parseTime } from '@/utils/ruoyi'; |
| | | |
| | | const complianceList = ref([]); |
| | | const open = ref(false); |
| | | const loading = ref(true); |
| | | const showSearch = ref(true); |
| | | const ids = ref([]); |
| | | const single = ref(true); |
| | | const multiple = ref(true); |
| | | const total = ref(0); |
| | | const title = ref(""); |
| | | |
| | | // åæ¾éä¿¡æ¯ |
| | | const columns = ref([ |
| | | { key: 0, label: `åè§ID`, visible: true }, |
| | | { key: 1, label: `åè§åç§°`, visible: true }, |
| | | { key: 2, label: `åè§ç¼å·`, visible: true }, |
| | | { key: 3, label: `æå±æ¿å
å`, visible: true }, |
| | | { key: 4, label: `åè§ç±»å`, visible: true }, |
| | | { key: 5, label: `æææå¼å§`, visible: true }, |
| | | { key: 6, label: `æææç»æ`, visible: true }, |
| | | { key: 7, label: `ç¶æ`, visible: true }, |
| | | { key: 8, label: `å建æ¶é´`, visible: true }, |
| | | ]); |
| | | <script setup> |
| | | import { Search } from "@element-plus/icons-vue"; |
| | | import {onMounted, ref} from "vue"; |
| | | import FormDia from "@/views/contractor/compliance/components/formDia.vue"; |
| | | import {staffJoinDel, staffJoinListPage} from "@/api/personnelManagement/onboarding.js"; |
| | | import {ElMessageBox} from "element-plus"; |
| | | import dayjs from "dayjs"; |
| | | |
| | | const data = reactive({ |
| | | form: { |
| | | complianceId: undefined, |
| | | complianceName: undefined, |
| | | complianceCode: undefined, |
| | | contractorId: undefined, |
| | | contractorName: undefined, |
| | | complianceType: undefined, |
| | | validStartDate: undefined, |
| | | validEndDate: undefined, |
| | | status: "0", |
| | | remark: undefined, |
| | | }, |
| | | queryParams: { |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | complianceName: undefined, |
| | | complianceCode: undefined, |
| | | contractorId: undefined, |
| | | status: undefined, |
| | | }, |
| | | rules: { |
| | | complianceName: [ |
| | | { required: true, message: "åè§åç§°ä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | ], |
| | | complianceCode: [ |
| | | { required: true, message: "åè§ç¼å·ä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | ], |
| | | contractorId: [ |
| | | { required: true, message: "æå±æ¿å
åä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | ], |
| | | complianceType: [ |
| | | { required: true, message: "åè§ç±»åä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | ], |
| | | validStartDate: [ |
| | | { required: true, message: "æææå¼å§ä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | ], |
| | | validEndDate: [ |
| | | { required: true, message: "æææç»æä¸è½ä¸ºç©º", trigger: "blur" }, |
| | | ], |
| | | searchForm: { |
| | | staffName: "", |
| | | }, |
| | | }); |
| | | |
| | | const { queryParams, form, rules } = toRefs(data); |
| | | |
| | | // æ¨¡ææ¿å
åæ°æ® |
| | | const contractorOptions = ref([ |
| | | { contractorId: 1, contractorName: "å京建工éå¢" }, |
| | | { contractorId: 2, contractorName: "䏿µ·å建éå¢" }, |
| | | { contractorId: 3, contractorName: "广å·å»ºçéå¢" }, |
| | | { contractorId: 4, contractorName: "æ·±å³å»ºå·¥éå¢" }, |
| | | { contractorId: 5, contractorName: "æå·å»ºå·¥éå¢" }, |
| | | ]); |
| | | |
| | | // åè§ç±»ååå
¸ |
| | | const compliance_types = ref([ |
| | | { value: "license", label: "许å¯è¯" }, |
| | | { value: "certificate", label: "è¯ä¹¦" }, |
| | | { value: "regulation", label: "æ³è§éµå¾ª" }, |
| | | { value: "standard", label: "æ ååè§" }, |
| | | { value: "other", label: "å
¶ä»" }, |
| | | ]); |
| | | |
| | | // åè§ç¶æåå
¸ |
| | | const compliance_status = ref([ |
| | | { value: "0", label: "æ£å¸¸" }, |
| | | { value: "1", label: "ç¦ç¨" }, |
| | | { value: "2", label: "å³å°è¿æ" }, |
| | | { value: "3", label: "å·²è¿æ" }, |
| | | ]); |
| | | |
| | | // æ£å¸¸ç¦ç¨åå
¸ |
| | | const sys_normal_disable = ref([ |
| | | { value: "0", label: "æ£å¸¸" }, |
| | | { value: "1", label: "ç¦ç¨" }, |
| | | ]); |
| | | |
| | | // 模æåè§æ°æ® |
| | | const mockCompliances = ref([ |
| | | const { searchForm } = toRefs(data); |
| | | const tableColumn = ref([ |
| | | { |
| | | complianceId: 1, |
| | | complianceName: "å»ºçæ½å·¥è®¸å¯è¯", |
| | | complianceCode: "COMP001", |
| | | contractorId: 1, |
| | | contractorName: "å京建工éå¢", |
| | | complianceType: "license", |
| | | validStartDate: "2024-01-01", |
| | | validEndDate: "2025-12-31", |
| | | status: "0", |
| | | createTime: "2024-01-01 10:00:00", |
| | | remark: "å»ºçæ½å·¥è®¸å¯è¯", |
| | | label: "åè§åç§°", |
| | | prop: "staffName", |
| | | }, |
| | | { |
| | | complianceId: 2, |
| | | complianceName: "å®å
¨ç产许å¯è¯", |
| | | complianceCode: "COMP002", |
| | | contractorId: 2, |
| | | contractorName: "䏿µ·å建éå¢", |
| | | complianceType: "license", |
| | | validStartDate: "2024-01-02", |
| | | validEndDate: "2025-12-31", |
| | | status: "0", |
| | | createTime: "2024-01-02 10:00:00", |
| | | remark: "å®å
¨ç产许å¯è¯", |
| | | label: "åè§ç¼å·", |
| | | prop: "staffNo", |
| | | }, |
| | | { |
| | | complianceId: 3, |
| | | complianceName: "è´¨é管çä½ç³»è®¤è¯", |
| | | complianceCode: "COMP003", |
| | | contractorId: 3, |
| | | contractorName: "广å·å»ºçéå¢", |
| | | complianceType: "certificate", |
| | | validStartDate: "2024-01-03", |
| | | validEndDate: "2025-12-31", |
| | | status: "1", |
| | | createTime: "2024-01-03 10:00:00", |
| | | remark: "ISO9001è´¨é管çä½ç³»è®¤è¯", |
| | | label: "æå±æ¿å
å", |
| | | prop: "nativePlace", |
| | | }, |
| | | { |
| | | complianceId: 4, |
| | | complianceName: "ç¯å¢ç®¡çä½ç³»è®¤è¯", |
| | | complianceCode: "COMP004", |
| | | contractorId: 4, |
| | | contractorName: "æ·±å³å»ºå·¥éå¢", |
| | | complianceType: "certificate", |
| | | validStartDate: "2024-01-04", |
| | | validEndDate: "2025-12-31", |
| | | status: "0", |
| | | createTime: "2024-01-04 10:00:00", |
| | | remark: "ISO14001ç¯å¢ç®¡çä½ç³»è®¤è¯", |
| | | label: "åè§ç±»å", |
| | | prop: "postJob", |
| | | }, |
| | | { |
| | | complianceId: 5, |
| | | complianceName: "èä¸å¥åº·å®å
¨ç®¡çä½ç³»è®¤è¯", |
| | | complianceCode: "COMP005", |
| | | contractorId: 5, |
| | | contractorName: "æå·å»ºå·¥éå¢", |
| | | complianceType: "certificate", |
| | | validStartDate: "2024-01-05", |
| | | validEndDate: "2025-12-31", |
| | | status: "0", |
| | | createTime: "2024-01-05 10:00:00", |
| | | remark: "ISO45001èä¸å¥åº·å®å
¨ç®¡çä½ç³»è®¤è¯", |
| | | label: "ååå¼å§æ¥æ", |
| | | prop: "contractStartTime", |
| | | width: 120 |
| | | }, |
| | | { |
| | | label: "ååç»ææ¥æ", |
| | | prop: "contractEndTime", |
| | | width: 120 |
| | | }, |
| | | { |
| | | label: "夿³¨", |
| | | prop: "postJob", |
| | | }, |
| | | { |
| | | dataType: "action", |
| | | label: "æä½", |
| | | align: "center", |
| | | fixed: 'right', |
| | | operation: [ |
| | | { |
| | | name: "ç¼è¾", |
| | | type: "text", |
| | | clickFun: (row) => { |
| | | openForm("edit", row); |
| | | }, |
| | | }, |
| | | ], |
| | | }, |
| | | ]); |
| | | const tableData = ref([]); |
| | | const selectedRows = ref([]); |
| | | const tableLoading = ref(false); |
| | | const page = reactive({ |
| | | current: 1, |
| | | size: 100, |
| | | total: 0, |
| | | }); |
| | | const formDia = ref() |
| | | const { proxy } = getCurrentInstance() |
| | | |
| | | /** è·ååè§ç±»åæ ç¾ */ |
| | | function getComplianceTypeLabel(value) { |
| | | const type = compliance_types.value.find(item => item.value === value); |
| | | return type ? type.label : value; |
| | | } |
| | | |
| | | /** æ¥è¯¢åè§å表 */ |
| | | function getList() { |
| | | loading.value = true; |
| | | // 模æAPI请æ±å»¶è¿ |
| | | setTimeout(() => { |
| | | let data = [...mockCompliances.value]; |
| | | // 模ææç´¢è¿æ»¤ |
| | | if (queryParams.value.complianceName) { |
| | | data = data.filter(item => item.complianceName.includes(queryParams.value.complianceName)); |
| | | const handleDateChange = (value,type) => { |
| | | searchForm.value.entryDateEnd = null |
| | | searchForm.value.entryDateStart = null |
| | | if(type === 1){ |
| | | if (value) { |
| | | searchForm.value.entryDateStart = dayjs(value).format("YYYY-MM-DD"); |
| | | } |
| | | if (queryParams.value.complianceCode) { |
| | | data = data.filter(item => item.complianceCode.includes(queryParams.value.complianceCode)); |
| | | }else{ |
| | | if (value) { |
| | | searchForm.value.entryDateEnd = dayjs(value).format("YYYY-MM-DD"); |
| | | } |
| | | if (queryParams.value.contractorId) { |
| | | data = data.filter(item => item.contractorId === queryParams.value.contractorId); |
| | | } |
| | | if (queryParams.value.status) { |
| | | data = data.filter(item => item.status === queryParams.value.status); |
| | | } |
| | | // 模æå页 |
| | | const start = (queryParams.value.pageNum - 1) * queryParams.value.pageSize; |
| | | const end = start + queryParams.value.pageSize; |
| | | complianceList.value = data.slice(start, end); |
| | | total.value = data.length; |
| | | loading.value = false; |
| | | }, 500); |
| | | } |
| | | |
| | | /** æç´¢æé®æä½ */ |
| | | function handleQuery() { |
| | | queryParams.value.pageNum = 1; |
| | | getList(); |
| | | } |
| | | |
| | | /** éç½®æé®æä½ */ |
| | | function resetQuery() { |
| | | Object.assign(queryParams.value, { |
| | | complianceName: undefined, |
| | | complianceCode: undefined, |
| | | contractorId: undefined, |
| | | status: undefined, |
| | | }); |
| | | handleQuery(); |
| | | } |
| | | |
| | | /** å é¤æé®æä½ */ |
| | | function handleDelete(row) { |
| | | const complianceIds = row.complianceId || ids.value; |
| | | ElMessage.confirm(`æ¯å¦ç¡®è®¤å é¤åè§ç¼å·ä¸º"${complianceIds}"çæ°æ®é¡¹ï¼`).then(() => { |
| | | // 模æå é¤æä½ |
| | | ElMessage.success("å 餿å"); |
| | | getList(); |
| | | }).catch(() => {}); |
| | | } |
| | | |
| | | /** ç¶æä¿®æ¹ */ |
| | | function handleStatusChange(row) { |
| | | let text = row.status === "0" ? "å¯ç¨" : "åç¨"; |
| | | ElMessage.confirm(`确认è¦"${text}""${row.complianceName}"åè§è®°å½å?`).then(() => { |
| | | // 模æç¶æä¿®æ¹ |
| | | ElMessage.success(text + "æå"); |
| | | getList(); |
| | | }).catch(() => { |
| | | row.status = row.status === "0" ? "1" : "0"; |
| | | }); |
| | | } |
| | | |
| | | /** éæ©æ¡æ° */ |
| | | function handleSelectionChange(selection) { |
| | | ids.value = selection.map((item) => item.complianceId); |
| | | single.value = selection.length != 1; |
| | | multiple.value = !selection.length; |
| | | } |
| | | |
| | | /** éç½®æä½è¡¨å */ |
| | | function reset() { |
| | | form.value = { |
| | | complianceId: undefined, |
| | | complianceName: undefined, |
| | | complianceCode: undefined, |
| | | contractorId: undefined, |
| | | contractorName: undefined, |
| | | complianceType: undefined, |
| | | validStartDate: undefined, |
| | | validEndDate: undefined, |
| | | status: "0", |
| | | remark: undefined, |
| | | }; |
| | | } |
| | | |
| | | /** åæ¶æé® */ |
| | | function cancel() { |
| | | open.value = false; |
| | | reset(); |
| | | } |
| | | |
| | | /** æ°å¢æé®æä½ */ |
| | | function handleAdd() { |
| | | reset(); |
| | | open.value = true; |
| | | title.value = "æ·»å åè§è®°å½"; |
| | | } |
| | | |
| | | /** ä¿®æ¹æé®æä½ */ |
| | | function handleUpdate(row) { |
| | | reset(); |
| | | const complianceId = row.complianceId || ids.value; |
| | | // 模æè·å详æ
|
| | | const compliance = mockCompliances.find(item => item.complianceId === complianceId); |
| | | if (compliance) { |
| | | form.value = { ...compliance }; |
| | | open.value = true; |
| | | title.value = "ä¿®æ¹åè§è®°å½"; |
| | | } |
| | | } |
| | | getList(); |
| | | }; |
| | | // æ¥è¯¢å表 |
| | | /** æç´¢æé®æä½ */ |
| | | const handleQuery = () => { |
| | | page.current = 1; |
| | | getList(); |
| | | }; |
| | | const pagination = (obj) => { |
| | | page.current = obj.page; |
| | | page.size = obj.limit; |
| | | getList(); |
| | | }; |
| | | const getList = () => { |
| | | tableLoading.value = true; |
| | | staffJoinListPage({...page, ...searchForm.value, staffState: 1}).then(res => { |
| | | tableLoading.value = false; |
| | | tableData.value = res.data.records |
| | | page.total = res.data.total; |
| | | |
| | | /** æäº¤æé® */ |
| | | function submitForm() { |
| | | // 模æè¡¨åéªè¯ |
| | | const requiredFields = ['complianceName', 'complianceCode', 'contractorId', 'complianceType', 'validStartDate', 'validEndDate']; |
| | | const isInvalid = requiredFields.some(field => !form.value[field]); |
| | | // æ£æ¥æ¯å¦æä¸´è¿è½¬æ£çå工并æé |
| | | checkProbationEnding(tableData.value); |
| | | }).catch(err => { |
| | | tableLoading.value = false; |
| | | }) |
| | | }; |
| | | // æ£æ¥ä¸´è¿è½¬æ£çå工并æé |
| | | const checkProbationEnding = (data) => { |
| | | const probationEndingSoon = []; |
| | | |
| | | if (isInvalid) { |
| | | ElMessage.error("请填åå¿
å¡«åæ®µ"); |
| | | data.forEach(item => { |
| | | // ä¿®æ¹ä¸ºä½¿ç¨ååå¼å§æ¥ææ£æ¥ |
| | | if (item.contractStartTime && item.probationPeriod) { |
| | | const probationEndDate = dayjs(item.contractStartTime).add(item.probationPeriod, 'month'); |
| | | const daysUntilProbationEnd = probationEndDate.diff(dayjs(), 'day'); |
| | | |
| | | if (daysUntilProbationEnd >= 0 && daysUntilProbationEnd <= 7) { |
| | | probationEndingSoon.push({ |
| | | staffName: item.staffName, |
| | | probationEndDate: probationEndDate.format('YYYY-MM-DD'), |
| | | daysLeft: daysUntilProbationEnd |
| | | }); |
| | | } |
| | | } |
| | | }); |
| | | |
| | | if (probationEndingSoon.length > 0) { |
| | | let message = '以ä¸åå·¥å°å¨7天å
转æ£ï¼\n'; |
| | | probationEndingSoon.forEach(item => { |
| | | message += `${item.staffName}ï¼${item.probationEndDate}ï¼è¿æ${item.daysLeft}天ï¼\n`; |
| | | }); |
| | | |
| | | // æ¾ç¤ºæéæ¶æ¯ |
| | | proxy.$modal.msgInfo(message); |
| | | } |
| | | }; |
| | | // è¡¨æ ¼éæ©æ°æ® |
| | | const handleSelectionChange = (selection) => { |
| | | selectedRows.value = selection; |
| | | }; |
| | | |
| | | // æå¼å¼¹æ¡ |
| | | const openForm = (type, row) => { |
| | | nextTick(() => { |
| | | formDia.value?.openDialog(type, row) |
| | | }) |
| | | }; |
| | | |
| | | // å é¤ |
| | | const handleDelete = () => { |
| | | let ids = []; |
| | | if (selectedRows.value.length > 0) { |
| | | ids = selectedRows.value.map((item) => item.id); |
| | | } else { |
| | | proxy.$modal.msgWarning("è¯·éæ©æ°æ®"); |
| | | return; |
| | | } |
| | | |
| | | // 模ææäº¤æä½ |
| | | ElMessage.success(title.value === "æ·»å åè§è®°å½" ? "æ°å¢æå" : "ä¿®æ¹æå"); |
| | | open.value = false; |
| | | getList(); |
| | | } |
| | | |
| | | ElMessageBox.confirm("éä¸çå
容å°è¢«å é¤ï¼æ¯å¦ç¡®è®¤å é¤ï¼", "导åº", { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | staffJoinDel(ids).then((res) => { |
| | | proxy.$modal.msgSuccess("å 餿å"); |
| | | getList(); |
| | | }); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已忶"); |
| | | }); |
| | | }; |
| | | // å¯¼åº |
| | | const handleOut = () => { |
| | | ElMessageBox.confirm("éä¸çå
容å°è¢«å¯¼åºï¼æ¯å¦ç¡®è®¤å¯¼åºï¼", "导åº", { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | proxy.download("/staff/staffJoinLeaveRecord/export", {staffState: 1}, "人åå
¥è.xlsx"); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已忶"); |
| | | }); |
| | | }; |
| | | onMounted(() => { |
| | | getList(); |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped></style> |
| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <el-form :model="form" label-width="100px" :rules="formRules" ref="formRef"> |
| | | <el-form-item label="模æ¿ç±»å" prop="incomeType"> |
| | | <el-select |
| | | v-model="form.incomeType" |
| | | placeholder="è¯·éæ©" |
| | | clearable |
| | | > |
| | | <el-option :label="item.label" :value="item.value" v-for="(item,index) in income_types" :key="index" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="模æ¿åç§°" prop="customerName"> |
| | | <el-input v-model="form.customerName" placeholder="请è¾å
¥" /> |
| | | </el-form-item> |
| | | <el-form-item label="模æ¿ç¼å·" prop="incomeDescribed"> |
| | | <el-input v-model="form.incomeDescribed" placeholder="请è¾å
¥" /> |
| | | </el-form-item> |
| | | <el-form-item label="çæ¬å·" prop="invoiceNumber"> |
| | | <el-input v-model="form.invoiceNumber" placeholder="请è¾å
¥" /> |
| | | </el-form-item> |
| | | <el-form-item label="夿³¨" prop="note"> |
| | | <el-input |
| | | v-model="form.note" |
| | | placeholder="夿³¨" |
| | | /> |
| | | </el-form-item> |
| | | |
| | | </el-form> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import useFormData from "@/hooks/useFormData"; |
| | | import { getAccountIncome } from "@/api/financialManagement/revenueManagement"; |
| | | import {ref} from "vue"; |
| | | const { proxy } = getCurrentInstance(); |
| | | |
| | | |
| | | defineOptions({ |
| | | name: "æ°å¢æ¶å
¥", |
| | | }); |
| | | const income_types = ref([ |
| | | { label: "综åè¯ä»·", value: "综åè¯ä»·" }, |
| | | { label: "å®å
¨ç产è¯ä»·", value: "å®å
¨ç产è¯ä»·" }, |
| | | { label: "履约è½åè¯ä»·", value: "履约è½åè¯ä»·" }, |
| | | { label: "èµè´¨åè§è¯ä»·", value: "èµè´¨åè§è¯ä»·" }, |
| | | { label: "ç¹ç§è®¾å¤ç»´ä¿è¯ä»·", value: "ç¹ç§è®¾å¤ç»´ä¿è¯ä»·" }, |
| | | { label: "å·¥ç¨æ½å·¥å®å
¨è¯ä»·", value: "å·¥ç¨æ½å·¥å®å
¨è¯ä»·" } |
| | | ]); |
| | | const { payment_methods } = proxy.useDict("payment_methods"); |
| | | const formRef = ref(null); |
| | | const formRules = { |
| | | customerName: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | incomeMoney: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | incomeDescribed: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | incomeDate: [{ required: true, trigger: "change", message: "è¯·éæ©" }], |
| | | incomeType: [{ required: true, trigger: "change", message: "è¯·éæ©" }], |
| | | incomeMethod: [{ required: true, trigger: "change", message: "è¯·éæ©" }], |
| | | } |
| | | |
| | | const { form, resetForm } = useFormData({ |
| | | incomeDate: undefined, // æ¶å
¥æ¥æ |
| | | incomeType: undefined, // æ¶å
¥ç±»å |
| | | customerName: undefined, // 客æ·åç§° |
| | | incomeMoney: undefined, // æ¶å
¥éé¢ |
| | | incomeDescribed: undefined, // æ¶å
¥æè¿° |
| | | incomeMethod: undefined, // æ¶æ¬¾æ¹å¼ |
| | | invoiceNumber: undefined, // å票å·ç |
| | | note: undefined, // 夿³¨ |
| | | }); |
| | | |
| | | const loadForm = async (id) => { |
| | | const { code, data } = await getAccountIncome(id); |
| | | if (code == 200) { |
| | | form.incomeDate = data.incomeDate; |
| | | form.incomeType = data.incomeType; |
| | | form.customerName = data.customerName; |
| | | form.incomeMoney = data.incomeMoney; |
| | | form.incomeDescribed = data.incomeDescribed; |
| | | form.incomeMethod = data.incomeMethod; |
| | | form.invoiceNumber = data.invoiceNumber; |
| | | form.note = data.note; |
| | | } |
| | | }; |
| | | |
| | | // æ¸
é¤è¡¨åæ ¡éªç¶æ |
| | | const clearValidate = () => { |
| | | formRef.value?.clearValidate(); |
| | | }; |
| | | |
| | | // éç½®è¡¨åæ°æ®åæ ¡éªç¶æ |
| | | const resetFormAndValidate = () => { |
| | | resetForm(); |
| | | clearValidate(); |
| | | }; |
| | | |
| | | defineExpose({ |
| | | form, |
| | | loadForm, |
| | | resetForm, |
| | | clearValidate, |
| | | resetFormAndValidate, |
| | | formRef, |
| | | }); |
| | | </script> |
| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <el-dialog :title="modalOptions.title" v-model="visible" @close="close" width="30%"> |
| | | <Form ref="formRef"></Form> |
| | | <template #footer> |
| | | <el-button type="primary" @click="sendForm" :loading="loading"> |
| | | {{ modalOptions.confirmText }} |
| | | </el-button> |
| | | <el-button @click="closeModal">{{ modalOptions.cancelText }}</el-button> |
| | | </template> |
| | | </el-dialog> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { useModal } from "@/hooks/useModal"; |
| | | import { add, update } from "@/api/financialManagement/revenueManagement"; |
| | | import Form from "./Form.vue"; |
| | | import { ElMessage } from "element-plus"; |
| | | import dayjs from "dayjs"; |
| | | const { proxy } = getCurrentInstance() |
| | | |
| | | defineOptions({ |
| | | name: "æ¶å
¥æ°å¢ç¼è¾", |
| | | }); |
| | | |
| | | const emits = defineEmits(["success"]); |
| | | |
| | | const formRef = ref(); |
| | | const { |
| | | id, |
| | | visible, |
| | | loading, |
| | | openModal, |
| | | modalOptions, |
| | | handleConfirm, |
| | | closeModal, |
| | | } = useModal({ title: "æ¶å
¥" }); |
| | | |
| | | const sendForm = () => { |
| | | proxy.$refs.formRef.$refs.formRef.validate(async valid => { |
| | | if (valid) { |
| | | formRef.value.form.incomeDate = dayjs(new Date()).format("YYYY-MM-DD") |
| | | const {code} = id.value |
| | | ? await update({id: id.value, ...formRef.value.form}) |
| | | : await add(formRef.value.form); |
| | | if (code == 200) { |
| | | emits("success"); |
| | | ElMessage({message: "æä½æå", type: "success"}); |
| | | close(); |
| | | } else { |
| | | loading.value = false; |
| | | } |
| | | } |
| | | }) |
| | | }; |
| | | |
| | | const close = () => { |
| | | formRef.value.resetFormAndValidate(); |
| | | closeModal(); |
| | | }; |
| | | |
| | | const loadForm = async (id) => { |
| | | openModal(id); |
| | | await nextTick(); |
| | | formRef.value.loadForm(id); |
| | | }; |
| | | |
| | | defineExpose({ |
| | | openModal, |
| | | loadForm, |
| | | }); |
| | | </script> |
| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-form :model="filters" :inline="true"> |
| | | <el-form-item label="å½å
¥æ¥æ:"> |
| | | <el-date-picker v-model="filters.entryDate" value-format="YYYY-MM-DD" format="YYYY-MM-DD" type="daterange" |
| | | placeholder="è¯·éæ©" clearable @change="changeDaterange" /> |
| | | </el-form-item> |
| | | <el-form-item label="模æ¿ç±»å:"> |
| | | <el-select |
| | | v-model="filters.incomeMethod" |
| | | placeholder="è¯·éæ©" |
| | | clearable |
| | | style="width: 200px;" |
| | | > |
| | | <el-option |
| | | v-for="item in income_types" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" @click="getTableData">æç´¢</el-button> |
| | | <el-button @click="resetFilters">éç½®</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div class="table_list"> |
| | | <div class="actions"> |
| | | <div></div> |
| | | <div> |
| | | <el-button type="primary" @click="add" icon="Plus"> æ°å¢ </el-button> |
| | | <el-button |
| | | type="danger" |
| | | icon="Delete" |
| | | :disabled="multipleList.length <= 0" |
| | | @click="deleteRow(multipleList.map((item) => item.id))" |
| | | > |
| | | æ¹éå é¤ |
| | | </el-button> |
| | | </div> |
| | | </div> |
| | | <PIMTable |
| | | rowKey="id" |
| | | isSelection |
| | | :column="columns" |
| | | :tableData="dataList" |
| | | :page="{ |
| | | current: pagination.currentPage, |
| | | size: pagination.pageSize, |
| | | total: pagination.total, |
| | | }" |
| | | @selection-change="handleSelectionChange" |
| | | @pagination="changePage" |
| | | > |
| | | <template #operation="{ row }"> |
| | | <el-button type="primary" text @click="edit(row.id)" icon="editPen"> |
| | | ç¼è¾ |
| | | </el-button> |
| | | </template> |
| | | </PIMTable> |
| | | </div> |
| | | <Modal ref="modalRef" @success="getTableData"></Modal> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { usePaginationApi } from "@/hooks/usePaginationApi"; |
| | | import { listPage, delAccountIncome } from "@/api/financialManagement/revenueManagement"; |
| | | import { onMounted, getCurrentInstance } from "vue"; |
| | | import Modal from "./Modal.vue"; |
| | | import { ElMessageBox, ElMessage } from "element-plus"; |
| | | import dayjs from "dayjs"; |
| | | |
| | | defineOptions({ |
| | | name: "æ¶å
¥ç®¡ç", |
| | | }); |
| | | |
| | | // è¡¨æ ¼å¤éæ¡éä¸é¡¹ |
| | | const multipleList = ref([]); |
| | | const { proxy } = getCurrentInstance(); |
| | | const modalRef = ref(); |
| | | const income_types = ref([ |
| | | { label: "综åè¯ä»·", value: "综åè¯ä»·" }, |
| | | { label: "å®å
¨ç产è¯ä»·", value: "å®å
¨ç产è¯ä»·" }, |
| | | { label: "履约è½åè¯ä»·", value: "履约è½åè¯ä»·" }, |
| | | { label: "èµè´¨åè§è¯ä»·", value: "èµè´¨åè§è¯ä»·" }, |
| | | { label: "ç¹ç§è®¾å¤ç»´ä¿è¯ä»·", value: "ç¹ç§è®¾å¤ç»´ä¿è¯ä»·" }, |
| | | { label: "å·¥ç¨æ½å·¥å®å
¨è¯ä»·", value: "å·¥ç¨æ½å·¥å®å
¨è¯ä»·" } |
| | | ]); |
| | | |
| | | const { |
| | | filters, |
| | | columns, |
| | | dataList, |
| | | pagination, |
| | | getTableData, |
| | | resetFilters, |
| | | onCurrentChange, |
| | | } = usePaginationApi( |
| | | listPage, |
| | | { |
| | | incomeMethod: undefined, |
| | | }, |
| | | [ |
| | | { |
| | | label: "模æ¿ç±»å", |
| | | align: "center", |
| | | prop: "incomeType", |
| | | }, |
| | | { |
| | | label: "模æ¿åç§°", |
| | | align: "center", |
| | | prop: "customerName", |
| | | |
| | | }, |
| | | { |
| | | label: "模æ¿ç¼å·", |
| | | align: "center", |
| | | prop: "incomeDescribed", |
| | | |
| | | }, |
| | | { |
| | | label: "çæ¬å·", |
| | | align: "center", |
| | | prop: "invoiceNumber", |
| | | |
| | | }, |
| | | { |
| | | label: "夿³¨", |
| | | align: "center", |
| | | prop: "note", |
| | | |
| | | }, |
| | | { |
| | | label: "å½å
¥äºº", |
| | | align: "center", |
| | | prop: "inputUser", |
| | | }, |
| | | { |
| | | label: "å½å
¥æ¥æ", |
| | | align: "center", |
| | | prop: "inputTime", |
| | | |
| | | }, |
| | | { |
| | | fixed: "right", |
| | | label: "æä½", |
| | | dataType: "slot", |
| | | slot: "operation", |
| | | align: "center", |
| | | width: "200px", |
| | | }, |
| | | ] |
| | | ); |
| | | |
| | | // å¤éååä»ä¹ |
| | | const handleSelectionChange = (selectionList) => { |
| | | multipleList.value = selectionList; |
| | | }; |
| | | |
| | | const add = () => { |
| | | modalRef.value.openModal(); |
| | | }; |
| | | const edit = (id) => { |
| | | modalRef.value.loadForm(id); |
| | | }; |
| | | const changePage = ({ page, limit }) => { |
| | | pagination.currentPage = page; |
| | | pagination.pageSize = limit; |
| | | onCurrentChange(page); |
| | | }; |
| | | const deleteRow = (id) => { |
| | | ElMessageBox.confirm("æ¤æä½å°æ°¸ä¹
å é¤è¯¥æ°æ®, æ¯å¦ç»§ç»?", "æç¤º", { |
| | | confirmButtonText: "ç¡®å®", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | }).then(async () => { |
| | | const { code } = await delAccountIncome(id); |
| | | if (code == 200) { |
| | | ElMessage({ |
| | | type: "success", |
| | | message: "å 餿å", |
| | | }); |
| | | getTableData(); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | const changeDaterange = (value) => { |
| | | if (value) { |
| | | filters.entryDateStart = dayjs(value[0]).format("YYYY-MM-DD"); |
| | | filters.entryDateEnd = dayjs(value[1]).format("YYYY-MM-DD"); |
| | | } else { |
| | | filters.entryDateStart = undefined; |
| | | filters.entryDateEnd = undefined; |
| | | } |
| | | getTableData(); |
| | | }; |
| | | |
| | | const handleOut = () => { |
| | | ElMessageBox.confirm("éä¸çå
容å°è¢«å¯¼åºï¼æ¯å¦ç¡®è®¤å¯¼åºï¼", "导åº", { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | proxy.download(`/account/accountIncome/export`, {}, "æ¶å
¥å°è´¦.xlsx"); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已忶"); |
| | | }); |
| | | }; |
| | | |
| | | onMounted(() => { |
| | | filters.entryDate = [ |
| | | dayjs().format("YYYY-MM-DD"), |
| | | dayjs().add(1, "day").format("YYYY-MM-DD"), |
| | | ] |
| | | filters.entryDateStart = dayjs().format("YYYY-MM-DD") |
| | | filters.entryDateEnd = dayjs().add(1, "day").format("YYYY-MM-DD") |
| | | getTableData(); |
| | | }); |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .table_list { |
| | | margin-top: unset; |
| | | } |
| | | .actions { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | margin-bottom: 10px; |
| | | } |
| | | </style> |