fix: 完成设备远程监控,车辆信息采集审批页面编写,接口联调
| ¶Ô±ÈÐÂÎļþ |
| | |
| | | import request from "@/utils/request"; |
| | | |
| | | // æ¥è¯¢è½¦è¾ä¿¡æ¯å页å表 |
| | | export function listVehicleInfo(query) { |
| | | return request({ |
| | | // 两级路å¾ï¼æ¨¡å + å
·ä½åè½å |
| | | url: "/environmentAccess/vehicleInfoPage", |
| | | method: "get", |
| | | params: query, |
| | | }); |
| | | } |
| | | |
| | | // æ°å¢è½¦è¾ä¿¡æ¯ |
| | | export function addVehicleInfo(data) { |
| | | return request({ |
| | | url: "/environmentAccess/vehicleInfoAdd", |
| | | method: "post", |
| | | data, |
| | | }); |
| | | } |
| | | |
| | | // ä¿®æ¹è½¦è¾ä¿¡æ¯ |
| | | export function updateVehicleInfo(data) { |
| | | return request({ |
| | | url: "/environmentAccess/vehicleInfoUpdate", |
| | | method: "put", |
| | | data, |
| | | }); |
| | | } |
| | | |
| | | // å é¤è½¦è¾ä¿¡æ¯ï¼æ¯ææ¹éï¼ |
| | | export function delVehicleInfo(ids) { |
| | | return request({ |
| | | url: "/environmentAccess/vehicleInfoDelete", |
| | | method: "delete", |
| | | data: ids, |
| | | }); |
| | | } |
| | | |
| | | // å®¡æ ¸è½¦è¾ä¿¡æ¯ |
| | | export function reviewVehicleInfo(data) { |
| | | return request({ |
| | | // å®¡æ ¸åç¬èµæºï¼vehicleInfoReview |
| | | url: "/environmentAccess/vehicleInfoReview", |
| | | method: "post", |
| | | data, |
| | | }); |
| | | } |
| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <div class="search_form"> |
| | | <div> |
| | | <span class="search_title">车çå·ç ï¼</span> |
| | | <el-input |
| | | v-model="searchForm.plateNo" |
| | | style="width: 240px" |
| | | placeholder="请è¾å
¥è½¦çå·ç " |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="handleQuery" |
| | | /> |
| | | <el-button type="primary" @click="handleQuery" style="margin-left: 10px"> |
| | | æç´¢ |
| | | </el-button> |
| | | </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" |
| | | :tableLoading="tableLoading" |
| | | @selection-change="handleSelectionChange" |
| | | @pagination="pagination" |
| | | /> |
| | | </div> |
| | | |
| | | <!-- æ°å¢/ç¼è¾è½¦è¾ä¿¡æ¯å¼¹çª --> |
| | | <el-dialog |
| | | v-model="dialogVisible" |
| | | :title="operationType === 'add' ? 'æ°å¢è½¦è¾ä¿¡æ¯' : 'ç¼è¾è½¦è¾ä¿¡æ¯'" |
| | | width="70%" |
| | | @close="closeFormDialog" |
| | | > |
| | | <el-form |
| | | ref="formRef" |
| | | :model="form" |
| | | :rules="rules" |
| | | label-width="140px" |
| | | label-position="top" |
| | | > |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="车çå·ç " prop="plateNo"> |
| | | <el-input v-model="form.plateNo" placeholder="请è¾å
¥è½¦çå·ç " clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å·çé¢è²" prop="plateColor"> |
| | | <el-input v-model="form.plateColor" placeholder="请è¾å
¥å·çé¢è²" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="车è¾ç±»å" prop="carType"> |
| | | <el-input v-model="form.carType" placeholder="请è¾å
¥è½¦è¾ç±»å" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="车è¾è¯å«ä»£ç (VIN)" prop="carVin"> |
| | | <el-input v-model="form.carVin" placeholder="请è¾å
¥ VIN ç " clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="车è¾åå·" prop="carModel"> |
| | | <el-input v-model="form.carModel" placeholder="请è¾å
¥è½¦è¾åå·" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å卿ºåå·" prop="engineModel"> |
| | | <el-input v-model="form.engineModel" placeholder="请è¾å
¥å卿ºåå·" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å卿ºç产å" prop="engineProductFactory"> |
| | | <el-input v-model="form.engineProductFactory" placeholder="请è¾å
¥å卿ºç产å" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å卿ºç¼å·" prop="engineNo"> |
| | | <el-input v-model="form.engineNo" placeholder="请è¾å
¥å卿ºç¼å·" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ææ¾æ å" prop="emissionStandard"> |
| | | <el-input v-model="form.emissionStandard" placeholder="请è¾å
¥ææ¾æ å" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="注åç»è®°æ¥æ" prop="registeDate"> |
| | | <el-date-picker |
| | | v-model="form.registeDate" |
| | | type="date" |
| | | style="width: 100%" |
| | | value-format="YYYY-MM-DD" |
| | | placeholder="è¯·éæ©æ³¨åç»è®°æ¥æ" |
| | | clearable |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ä½¿ç¨æ§è´¨" prop="natureOfUse"> |
| | | <el-input v-model="form.natureOfUse" placeholder="请è¾å
¥ä½¿ç¨æ§è´¨" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="çæç±»å" prop="fuelType"> |
| | | <el-input v-model="form.fuelType" 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="closeFormDialog">åæ¶</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | |
| | | <!-- å®¡æ ¸å¼¹çª --> |
| | | <el-dialog |
| | | v-model="auditDialogVisible" |
| | | title="车è¾ä¿¡æ¯å®¡æ ¸" |
| | | width="500px" |
| | | @close="closeAuditDialog" |
| | | > |
| | | <el-form :model="auditForm" label-width="100px"> |
| | | <el-form-item label="å®¡æ ¸ç»æ" prop="status"> |
| | | <el-radio-group v-model="auditForm.status"> |
| | | <el-radio label="approved">éè¿</el-radio> |
| | | <el-radio label="rejected">ä¸éè¿</el-radio> |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | <el-form-item label="å®¡æ ¸æè§" prop="comment"> |
| | | <el-input |
| | | v-model="auditForm.comment" |
| | | type="textarea" |
| | | :rows="3" |
| | | placeholder="请è¾å
¥å®¡æ ¸æè§ï¼éå¡«ï¼" |
| | | /> |
| | | </el-form-item> |
| | | </el-form> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button type="primary" @click="submitAudit">确认</el-button> |
| | | <el-button @click="closeAuditDialog">åæ¶</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { ref, reactive } from "vue"; |
| | | import { Search } from "@element-plus/icons-vue"; |
| | | import { ElMessage, ElMessageBox } from "element-plus"; |
| | | import PIMTable from "@/components/PIMTable/PIMTable.vue"; |
| | | import { |
| | | listVehicleInfo, |
| | | addVehicleInfo, |
| | | updateVehicleInfo, |
| | | delVehicleInfo, |
| | | reviewVehicleInfo, |
| | | } from "@/api/environmentAccess/vehicleInfo"; |
| | | |
| | | // æ¥è¯¢æ¡ä»¶ |
| | | const searchForm = reactive({ |
| | | plateNo: "", |
| | | }); |
| | | |
| | | // è¡¨æ ¼åé
ç½® |
| | | const tableColumn = ref([ |
| | | { |
| | | label: "车çå·ç ", |
| | | prop: "plateNo", |
| | | align: "center", |
| | | width: 140, |
| | | }, |
| | | { |
| | | label: "å·çé¢è²", |
| | | prop: "plateColor", |
| | | align: "center", |
| | | width: 100, |
| | | }, |
| | | { |
| | | label: "车è¾ç±»å", |
| | | prop: "carType", |
| | | align: "center", |
| | | width: 120, |
| | | }, |
| | | { |
| | | label: "车è¾è¯å«ä»£ç (VIN)", |
| | | prop: "carVin", |
| | | align: "center", |
| | | minWidth: 200, |
| | | showOverflowTooltip: true, |
| | | }, |
| | | { |
| | | label: "车è¾åå·", |
| | | prop: "carModel", |
| | | align: "center", |
| | | width: 140, |
| | | }, |
| | | { |
| | | label: "å卿ºåå·", |
| | | prop: "engineModel", |
| | | align: "center", |
| | | width: 140, |
| | | }, |
| | | { |
| | | label: "å卿ºç产å", |
| | | prop: "engineProductFactory", |
| | | align: "center", |
| | | width: 160, |
| | | }, |
| | | { |
| | | label: "å卿ºç¼å·", |
| | | prop: "engineNo", |
| | | align: "center", |
| | | width: 140, |
| | | }, |
| | | { |
| | | label: "ææ¾æ å", |
| | | prop: "emissionStandard", |
| | | align: "center", |
| | | width: 120, |
| | | }, |
| | | { |
| | | label: "注åç»è®°æ¥æ", |
| | | prop: "registeDate", |
| | | align: "center", |
| | | width: 140, |
| | | }, |
| | | { |
| | | label: "ä½¿ç¨æ§è´¨", |
| | | prop: "natureOfUse", |
| | | align: "center", |
| | | width: 120, |
| | | }, |
| | | { |
| | | label: "çæç±»å", |
| | | prop: "fuelType", |
| | | align: "center", |
| | | width: 120, |
| | | }, |
| | | { |
| | | label: "å®¡æ ¸ç¶æ", |
| | | prop: "reviewStatus", |
| | | align: "center", |
| | | dataType: "tag", |
| | | width: 120, |
| | | formatData: (value) => { |
| | | if (value === "approved") return "å·²éè¿"; |
| | | if (value === "rejected") return "æªéè¿"; |
| | | if (value === "pending") return "å¾
å®¡æ ¸"; |
| | | return "æªæäº¤"; |
| | | }, |
| | | formatType: (value) => { |
| | | if (value === "approved") return "success"; |
| | | if (value === "rejected") return "danger"; |
| | | if (value === "pending") return "warning"; |
| | | return ""; |
| | | }, |
| | | }, |
| | | { |
| | | dataType: "action", |
| | | label: "æä½", |
| | | align: "center", |
| | | fixed: "right", |
| | | width: 220, |
| | | operation: [ |
| | | { |
| | | name: "ç¼è¾", |
| | | type: "text", |
| | | clickFun: (row) => openForm("edit", row), |
| | | }, |
| | | { |
| | | name: "å®¡æ ¸", |
| | | type: "text", |
| | | clickFun: (row) => openAuditDialog(row), |
| | | }, |
| | | { |
| | | name: "å é¤", |
| | | type: "text", |
| | | clickFun: (row) => deleteRow(row), |
| | | }, |
| | | ], |
| | | }, |
| | | ]); |
| | | |
| | | // è¡¨æ ¼æ°æ® |
| | | const tableData = ref([]); |
| | | const tableLoading = ref(false); |
| | | const selectedRows = ref([]); |
| | | |
| | | // å页 |
| | | const page = reactive({ |
| | | current: 1, |
| | | size: 10, |
| | | total: 0, |
| | | }); |
| | | |
| | | // 表åç¸å
³ |
| | | const dialogVisible = ref(false); |
| | | const operationType = ref("add"); |
| | | const formRef = ref(null); |
| | | const form = reactive(createEmptyForm()); |
| | | |
| | | function createEmptyForm() { |
| | | return { |
| | | id: undefined, |
| | | plateNo: "", |
| | | plateColor: "", |
| | | carType: "", |
| | | carVin: "", |
| | | carModel: "", |
| | | engineModel: "", |
| | | engineProductFactory: "", |
| | | engineNo: "", |
| | | emissionStandard: "", |
| | | registeDate: "", |
| | | natureOfUse: "", |
| | | fuelType: "", |
| | | reviewStatus: "pending", |
| | | }; |
| | | } |
| | | |
| | | const rules = { |
| | | plateNo: [{ required: true, message: "请è¾å
¥è½¦çå·ç ", trigger: "blur" }], |
| | | carVin: [{ required: true, message: "请è¾å
¥ VIN ç ", trigger: "blur" }], |
| | | }; |
| | | |
| | | // å®¡æ ¸ç¸å
³ |
| | | const auditDialogVisible = ref(false); |
| | | const currentAuditRow = ref(null); |
| | | const auditForm = reactive({ |
| | | status: "approved", |
| | | comment: "", |
| | | }); |
| | | |
| | | // æ¥è¯¢ |
| | | function handleQuery() { |
| | | page.current = 1; |
| | | loadTableData(); |
| | | } |
| | | |
| | | // å è½½æ°æ® |
| | | function loadTableData() { |
| | | tableLoading.value = true; |
| | | listVehicleInfo({ |
| | | pageNum: page.current, |
| | | pageSize: page.size, |
| | | ...searchForm, |
| | | }) |
| | | .then((res) => { |
| | | const { records, total } = res.data; |
| | | tableData.value = records || []; |
| | | page.total = total || 0; |
| | | }) |
| | | .finally(() => { |
| | | tableLoading.value = false; |
| | | }); |
| | | } |
| | | |
| | | // å页åå |
| | | function pagination({ page: current, limit }) { |
| | | page.current = current; |
| | | page.size = limit; |
| | | loadTableData(); |
| | | } |
| | | |
| | | // éæ©è¡ |
| | | function handleSelectionChange(selection) { |
| | | selectedRows.value = selection; |
| | | } |
| | | |
| | | // æå¼è¡¨å |
| | | function openForm(type, row) { |
| | | operationType.value = type; |
| | | if (type === "edit" && row) { |
| | | Object.assign(form, row); |
| | | } else { |
| | | Object.assign(form, createEmptyForm()); |
| | | } |
| | | dialogVisible.value = true; |
| | | } |
| | | |
| | | function closeFormDialog() { |
| | | dialogVisible.value = false; |
| | | formRef.value?.resetFields(); |
| | | } |
| | | |
| | | // æäº¤è¡¨å |
| | | function submitForm() { |
| | | formRef.value?.validate((valid) => { |
| | | if (!valid) return; |
| | | |
| | | const api = operationType.value === "add" ? addVehicleInfo : updateVehicleInfo; |
| | | api({ ...form }) |
| | | .then(() => { |
| | | ElMessage.success(operationType.value === "add" ? "æ°å¢æå" : "ç¼è¾æå"); |
| | | dialogVisible.value = false; |
| | | loadTableData(); |
| | | }) |
| | | .catch(() => {}); |
| | | }); |
| | | } |
| | | |
| | | // å é¤åæ¡ |
| | | function deleteRow(row) { |
| | | ElMessageBox.confirm("确认å é¤è¯¥è½¦è¾ä¿¡æ¯åï¼", "æç¤º", { |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | delVehicleInfo([row.id]).then(() => { |
| | | ElMessage.success("å 餿å"); |
| | | loadTableData(); |
| | | }); |
| | | }) |
| | | .catch(() => {}); |
| | | } |
| | | |
| | | // æ¹éå é¤ |
| | | function handleDelete() { |
| | | if (!selectedRows.value.length) { |
| | | ElMessage.warning("请å
éæ©è¦å é¤çè®°å½"); |
| | | return; |
| | | } |
| | | ElMessageBox.confirm("确认å é¤éä¸ç车è¾ä¿¡æ¯åï¼", "æç¤º", { |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | const ids = selectedRows.value.map((item) => item.id); |
| | | delVehicleInfo(ids).then(() => { |
| | | ElMessage.success("å 餿å"); |
| | | loadTableData(); |
| | | }); |
| | | }) |
| | | .catch(() => {}); |
| | | } |
| | | |
| | | // æå¼å®¡æ ¸å¼¹çª |
| | | function openAuditDialog(row) { |
| | | currentAuditRow.value = row; |
| | | auditForm.status = row.reviewStatus || "pending"; |
| | | auditForm.comment = row.auditComment || ""; |
| | | auditDialogVisible.value = true; |
| | | } |
| | | |
| | | function closeAuditDialog() { |
| | | auditDialogVisible.value = false; |
| | | } |
| | | |
| | | // æäº¤å®¡æ ¸ |
| | | function submitAudit() { |
| | | if (!currentAuditRow.value) return; |
| | | |
| | | reviewVehicleInfo({ |
| | | id: currentAuditRow.value.id, |
| | | reviewStatus: auditForm.status, |
| | | auditComment: auditForm.comment, |
| | | }) |
| | | .then(() => { |
| | | ElMessage.success("å®¡æ ¸å®æ"); |
| | | auditDialogVisible.value = false; |
| | | loadTableData(); |
| | | }) |
| | | .catch(() => {}); |
| | | } |
| | | |
| | | // åå§å |
| | | loadTableData(); |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | .table_list { |
| | | margin-top: 20px; |
| | | } |
| | | </style> |
| | | |
| | |
| | | <template> |
| | | <el-form :model="form" label-width="100px" :rules="formRules" ref="formRef"> |
| | | <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 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 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-input v-model="form.supplierName" placeholder="请è¾å
¥ä¾åºå" /> |
| | | <el-form-item label="ååçæµåæ°" prop="supplierName"> |
| | | <el-input v-model="form.supplierName" placeholder="请è¾å
¥ååçæµåæ°" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="åä½" prop="unit"> |
| | | <el-input v-model="form.unit" placeholder="请è¾å
¥åä½" /> |
| | | <el-form-item label="è½èçæµåæ°" prop="unit"> |
| | | <el-input v-model="form.unit" placeholder="请è¾å
¥è½èçæµåæ°" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å«ç¨åä»·" prop="taxIncludingPriceUnit"> |
| | | <el-form-item label="çæ§éå¼ä¸é" prop="taxIncludingPriceUnit"> |
| | | <el-input-number :step="0.01" :min="0" style="width: 100%" |
| | | v-model="form.taxIncludingPriceUnit" |
| | | placeholder="请è¾å
¥å«ç¨åä»·" |
| | | placeholder="请è¾å
¥çæ§éå¼ä¸é" |
| | | maxlength="10" |
| | | @change="mathNum" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å«ç¨æ»ä»·" prop="taxIncludingPriceTotal"> |
| | | <el-form-item label="çæ§éå¼ä¸é" prop="taxIncludingPriceTotal"> |
| | | <el-input |
| | | v-model="form.taxIncludingPriceTotal" |
| | | placeholder="èªå¨çæ" |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ç¨ç(%)" prop="taxRate"> |
| | | <!-- <el-input |
| | | v-model="form.taxRate" |
| | | placeholder="请è¾å
¥ç¨ç" |
| | | type="number" |
| | | > |
| | | <template #append> % </template> |
| | | </el-input> --> |
| | | <el-form-item label="宿¶çæµå¼" prop="taxRate"> |
| | | <el-select |
| | | v-model="form.taxRate" |
| | | placeholder="è¯·éæ©" |
| | | placeholder="è¯·éæ©å®æ¶çæµå¼" |
| | | clearable |
| | | @change="mathNum" |
| | | > |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ä¸å«ç¨æ»ä»·" prop="unTaxIncludingPriceTotal"> |
| | | <el-form-item label="累计è½è" prop="unTaxIncludingPriceTotal"> |
| | | <el-input |
| | | v-model="form.unTaxIncludingPriceTotal" |
| | | placeholder="èªå¨çæ" |
| | |
| | | </el-form-item> |
| | | </el-col> --> |
| | | <el-col :span="12"> |
| | | <el-form-item label="å½å
¥æ¥æ" prop="createTime"> |
| | | <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="è¯·éæ©å½å
¥æ¥æ" |
| | | placeholder="è¯·éæ©çæ§æ¥æ" |
| | | clearable |
| | | /> |
| | | </el-form-item> |
| | |
| | | |
| | | const mathNum = () => { |
| | | if (!form.taxIncludingPriceUnit) { |
| | | ElMessage.error("请è¾å
¥åä»·"); |
| | | ElMessage.error("请è¾å
¥çæ§éå¼ä¸é"); |
| | | return; |
| | | } |
| | | if (!form.number) { |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <!-- 页é¢åè½è¯´æï¼ä»
ä½ä¸ºæè¿°ï¼ä¸ä½ä¸ºå
·ä½å段 --> |
| | | <el-form :model="filters" :inline="true"> |
| | | <el-form-item label="设å¤åç§°"> |
| | | <!-- çæ§è®¾å¤åºç¡ä¿¡æ¯çé --> |
| | | <el-form-item label="çæ§è®¾å¤åç§°"> |
| | | <el-input |
| | | v-model="filters.deviceName" |
| | | style="width: 240px" |
| | | placeholder="请è¾å
¥è®¾å¤åç§°" |
| | | placeholder="请è¾å
¥çæ§è®¾å¤åç§°" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="getTableData" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="è§æ ¼åå·"> |
| | | <!-- æ¸©åº¦çæµåæ®µï¼è±æå段 deviceModel ä¸åï¼ --> |
| | | <el-form-item label="æ¸©åº¦çæµåæ°"> |
| | | <el-input |
| | | v-model="filters.deviceModel" |
| | | style="width: 240px" |
| | | placeholder="请è¾å
¥è§æ ¼åå·" |
| | | placeholder="请è¾å
¥æ¸©åº¦ç¸å
³çæµåæ°" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="getTableData" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="ä¾åºå"> |
| | | <!-- ååçæµåæ®µï¼è±æå段 supplierName ä¸åï¼ --> |
| | | <el-form-item label="ååçæµåæ°"> |
| | | <el-input |
| | | v-model="filters.supplierName" |
| | | style="width: 240px" |
| | | placeholder="请è¾å
¥ä¾åºå" |
| | | placeholder="请è¾å
¥ååç¸å
³çæµåæ°" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="getTableData" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="åä½"> |
| | | <!-- è½èçæµåæ®µï¼è±æå段 unit ä¸åï¼ --> |
| | | <el-form-item label="è½èçæµåæ°"> |
| | | <el-input |
| | | v-model="filters.unit" |
| | | style="width: 240px" |
| | | placeholder="请è¾å
¥åä½" |
| | | placeholder="请è¾å
¥è½èç¸å
³çæµåæ°" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="getTableData" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="å½å
¥æ¥æ:"> |
| | | <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> |
| | |
| | | <div></div> |
| | | <div> |
| | | <el-button type="primary" @click="add" icon="Plus"> æ°å¢ </el-button> |
| | | <el-button @click="handleOut" icon="download">导åº</el-button> |
| | | <!-- <el-button @click="handleOut" icon="download">导åº</el-button> --> |
| | | <el-button |
| | | type="danger" |
| | | icon="Delete" |
| | |
| | | import {Search} from "@element-plus/icons-vue"; |
| | | |
| | | defineOptions({ |
| | | name: "设å¤å°è´¦", |
| | | // 页é¢åè½ï¼è®¾å¤è¿ç¨çæ§ |
| | | name: "设å¤è¿ç¨çæ§", |
| | | }); |
| | | |
| | | // è¡¨æ ¼å¤éæ¡éä¸é¡¹ |
| | |
| | | }, |
| | | [ |
| | | { |
| | | label: "设å¤åç§°", |
| | | label: "çæ§è®¾å¤åç§°", |
| | | align: "center", |
| | | prop: "deviceName", |
| | | }, |
| | | { |
| | | label: "è§æ ¼åå·", |
| | | // ä½¿ç¨ deviceModel åæ®µæ¿è½½æ¸©åº¦çæµç¸å
³åæ° |
| | | label: "æ¸©åº¦çæµåæ°", |
| | | align: "center", |
| | | prop: "deviceModel", |
| | | }, |
| | | { |
| | | label: "ä¾åºå", |
| | | // ä½¿ç¨ supplierName åæ®µæ¿è½½ååçæµç¸å
³åæ° |
| | | label: "ååçæµåæ°", |
| | | align: "center", |
| | | prop: "supplierName", |
| | | }, |
| | | { |
| | | label: "åä½", |
| | | // ä½¿ç¨ unit åæ®µæ¿è½½è½èçæµç¸å
³åæ° |
| | | label: "è½èçæµåæ°", |
| | | align: "center", |
| | | prop: "unit", |
| | | }, |
| | |
| | | prop: "number", |
| | | }, |
| | | { |
| | | label: "å«ç¨åä»·", |
| | | // ä½¿ç¨ taxIncludingPriceUnit åæ®µæ¿è½½çæ§éå¼ä¸é |
| | | label: "çæ§éå¼ä¸é", |
| | | align: "center", |
| | | prop: "taxIncludingPriceUnit", |
| | | }, |
| | | { |
| | | label: "å«ç¨æ»ä»·", |
| | | // ä½¿ç¨ taxIncludingPriceTotal åæ®µæ¿è½½çæ§éå¼ä¸é |
| | | label: "çæ§éå¼ä¸é", |
| | | align: "center", |
| | | prop: "taxIncludingPriceTotal", |
| | | }, |
| | | { |
| | | label: "ç¨ç", |
| | | // ä½¿ç¨ taxRate åæ®µåç°å®æ¶çæµå¼/å½åè¯»æ° |
| | | label: "宿¶çæµå¼", |
| | | align: "center", |
| | | prop: "taxRate", |
| | | }, |
| | | { |
| | | label: "ä¸å«ç¨æ»ä»·", |
| | | // ä½¿ç¨ unTaxIncludingPriceTotal åæ®µæ¿è½½ç´¯è®¡è½è/çæ§ç»è®¡å¼ |
| | | label: "累计è½è", |
| | | align: "center", |
| | | prop: "unTaxIncludingPriceTotal", |
| | | }, |
| | | { |
| | | label: "å½å
¥äºº", |
| | | label: "çæ§äºº", |
| | | align: "center", |
| | | prop: "createUser", |
| | | }, |
| | | { |
| | | label: "å½å
¥æ¥æ", |
| | | label: "çæ§æ¥æ", |
| | | align: "center", |
| | | prop: "createTime", |
| | | }, |
| | |
| | | edit(row.id) |
| | | }, |
| | | }, |
| | | { |
| | | name: "çæäºç»´ç ", |
| | | type: "text", |
| | | clickFun: (row) => { |
| | | showQRCode(row) |
| | | }, |
| | | }, |
| | | // { |
| | | // name: "çæäºç»´ç ", |
| | | // type: "text", |
| | | // clickFun: (row) => { |
| | | // showQRCode(row) |
| | | // }, |
| | | // }, |
| | | ], |
| | | }, |
| | | ] |
| | |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | proxy.download(`/device/ledger/export`, {}, "设å¤å°è´¦æ¡£æ¡.xlsx"); |
| | | // å¯¼åºæä»¶åæ¹ä¸ºè®¾å¤è¿ç¨çæ§ |
| | | proxy.download(`/device/ledger/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") |
| | | // 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> |
| | |
| | | justify-content: space-between; |
| | | margin-bottom: 10px; |
| | | } |
| | | |
| | | .feature-desc { |
| | | margin-bottom: 16px; |
| | | padding: 10px 12px; |
| | | background: #f5f7fa; |
| | | border-radius: 4px; |
| | | color: #606266; |
| | | font-size: 13px; |
| | | } |
| | | </style> |