diff --git a/src/views/mechanical_files/maintenance/add.vue b/src/views/mechanical_files/maintenance/add.vue
new file mode 100644
index 0000000..b1430fe
--- /dev/null
+++ b/src/views/mechanical_files/maintenance/add.vue
@@ -0,0 +1,374 @@
+<template>
+    <layout-card>
+        <el-form ref="formRef" :rules="rules" :model="form" label-width="140px">
+            <el-row :gutter="20">
+                <el-col :span="24">
+                    <el-divider content-position="left">车辆选择</el-divider>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保车辆" prop="VEHICLE">
+                        <el-select v-model="form.VEHICLE" @change="getBusInfo">
+                            <el-option
+                                    v-for="item in data.vehicleList"
+                                    :key="item.ID"
+                                    :label="item.PLATE_NUMBER"
+                                    :value="item.ID"
+                            />
+                        </el-select>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="24">
+                    <el-divider content-position="left">基本信息</el-divider>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="行驶证照片" prop="DRIVING_LICENSE_IMG">
+                        <layout-upload
+                                v-model:file-list="data.busInfo.DRIVING_LICENSE_IMG"
+                                list-type="picture-card"
+                                accept=".jpg,.jpeg,.png"
+                                delete-to-server
+                                disabled
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车牌号" prop="PLATE_NUMBER">
+                        <el-input v-model="data.busInfo.PLATE_NUMBER" disabled />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车架号" prop="VIN">
+                        <el-input v-model="data.busInfo.VIN" disabled/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车辆类型" prop="TRAILER_TYPE">
+                        <el-input v-model="data.busInfo.TRAILER_TYPE" disabled/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车主/业户" prop="CAR_OWNERS ">
+                        <el-input v-model="data.busInfo.CAR_OWNERS " disabled/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车主电话" prop="CAR_OWNERS_TEL">
+                        <el-input v-model="data.busInfo.CAR_OWNERS_TEL" disabled/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="初登日期" prop="INITIAL_REGISTRATION_DATE">
+                        <el-date-picker
+                                v-model="data.busInfo.INITIAL_REGISTRATION_DATE"
+                                value-format="YYYY-MM-DD"
+                                format="YYYY-MM-DD"
+                                type="date"
+                                disabled
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="所属区域" prop="COMPANY_AREA">
+                        <el-input v-model="data.busInfo.COMPANY_AREA" disabled/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="24">
+                    <el-divider content-position="left">维保信息</el-divider>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="编号" prop="NUM">
+                        <el-input v-model="form.NUM"  maxlength="50" show-word-limit/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车主业户" prop="CAR_OWNERS">
+                        <el-input v-model="form.CAR_OWNERS"  maxlength="50" show-word-limit/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="联系电话" prop="TELEPHONE">
+                        <el-input v-model="form.TELEPHONE"  maxlength="11" show-word-limit/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="登记人" prop="REGISTRANT">
+                        <el-input v-model="form.REGISTRANT"  maxlength="50" show-word-limit/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保等级" prop="MAINTENANCE_LEVEL">
+                        <el-select v-model="form.MAINTENANCE_LEVEL">
+                            <el-option
+                                    v-for="item in MAINTENANCE_LEVEL_LIST"
+                                    :key="item.ID"
+                                    :label="item.NAME"
+                                    :value="item.ID"
+                            />
+                        </el-select>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保周期" prop="MAINTENANCE_CYCLE">
+                        <el-input v-model.number="form.MAINTENANCE_CYCLE" type="number" maxlength="50" show-word-limit @change="getDueDate"/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保公里数" prop="KILOMETERS">
+                        <el-input v-model.number="form.KILOMETERS" maxlength="50" show-word-limit />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="办理日期" prop="PROCESSING_DATE">
+                        <el-date-picker
+                                v-model="form.PROCESSING_DATE"
+                                value-format="YYYY-MM-DD"
+                                format="YYYY-MM-DD"
+                                type="date"
+                                @change="getDueDate"
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="到期日期" prop="DUE_DATE">
+                        <el-date-picker
+                                v-model="form.DUE_DATE"
+                                value-format="YYYY-MM-DD"
+                                format="YYYY-MM-DD"
+                                type="date"
+                                disabled
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="协议编号" prop="AGREEMENT_NUM">
+                        <el-input v-model="form.AGREEMENT_NUM"  maxlength="50" show-word-limit />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保单位" prop="MAINTENANCE_COMPANY">
+                        <el-input v-model="form.MAINTENANCE_COMPANY"  maxlength="50" show-word-limit />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="提醒天数" prop="REMINDER_DAYS">
+                        <el-input v-model.number="form.REMINDER_DAYS"  maxlength="50" show-word-limit @change="getRemiderDate"/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="提醒日期" prop="REMINDER_DATE">
+                        <el-date-picker
+                                v-model="form.REMINDER_DATE"
+                                value-format="YYYY-MM-DD"
+                                format="YYYY-MM-DD"
+                                type="date"
+                                disabled
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="提醒状态" prop="REMINDER_STATUS">
+                        <el-switch
+                                v-model="form.REMINDER_STATUS"
+                                inline-prompt
+                                active-text="开"
+                                inactive-text="关"
+                                active-value="1"
+                                inactive-value="0"
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保资料" prop="MAINTENANCEINFO">
+                        <layout-upload
+                                v-model:file-list="form.MAINTENANCEINFO"
+                                list-type="picture-card"
+                                accept=".jpg,.jpeg,.png"
+                                :limit="99"
+                                delete-to-server
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="备注" prop="NOTES">
+                        <el-input
+                                v-model="form.NOTES"
+                                type="textarea"
+                                :autosize="{ minRows: 3 }"
+                                maxlength="250" show-word-limit
+                        />
+                    </el-form-item>
+                </el-col>
+            </el-row>
+        </el-form>
+        <div class="mt-10 tc">
+            <el-button type="primary" @click="fnSubmit">保存</el-button>
+        </div>
+    </layout-card>
+</template>
+
+<script setup>
+    import LayoutUpload from "@/components/upload/index.vue";
+    import { ref ,reactive} from "vue";
+    import { debounce } from "throttle-debounce";
+    import {getMaintenanceView, setMaintenanceAdd ,setMaintenanceEdit,getTrailerList} from "@/request/mechanical_files.js";
+    import {MAINTENANCE_LEVEL_LIST} from "@/assets/js/constant.js"
+    import { setUploadImg } from "@/request/api.js";
+    import { ElMessage } from "element-plus";
+    import { useRoute, useRouter, } from "vue-router";
+    import useFormValidate from "@/assets/js/useFormValidate.js";
+    import { addingPrefixToFile ,subtractDaysFromDate} from "@/assets/js/utils.js";
+    const route = useRoute();
+    const router = useRouter();
+    const MAINTENANCE_ID = route.query.MAINTENANCE_ID
+    const formRef = ref(null);
+    const form = ref({
+        VEHICLE : '',
+        NUM:'',
+        CAR_OWNERS : '',
+        TELEPHONE : '',
+        REGISTRANT : '',
+        PROCESSING_DATE : '',
+        MAINTENANCE_LEVEL : '',      
+        MAINTENANCE_CYCLE : '',
+        KILOMETERS : '',
+        DUE_DATE : '',
+        AGREEMENT_NUM : '',
+        MAINTENANCE_COMPANY : '',
+        REMINDER_DAYS : '',
+        REMINDER_DATE : '',
+        REMINDER_STATUS : '',
+        MAINTENANCEINFO : []
+    });
+    const data = reactive({
+        vehicleList: [],
+        busInfo:{
+            DRIVING_LICENSE_IMG : [],
+            PLATE_NUMBER : '',
+            VIN : '',
+            TRAILER_TYPE : '',
+            CAR_OWNERS : '',
+            CAR_OWNERS_TEL : '',
+            INITIAL_REGISTRATION_DATE : '',
+            COMPANY_AREA:'',
+        }
+    });
+    const rules = {
+        VEHICLE: [{ required: true, message: "请输入", trigger: "blur" }],
+        CAR_OWNERS: [{ required: true, message: "请输入", trigger: "blur" }],
+        TELEPHONE: [
+            { required: true, message: "请输入", trigger: "blur" },
+            { min: 11, max: 11, message: "请输入11位手机号码", trigger: "blur" },
+            {
+                pattern:
+                    /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[189]))\d{8}$/,
+                message: "请输入正确的手机号码",
+            },
+        ],
+        REGISTRANT: [{ required: true, message: "请输入", trigger: "blur" }],
+        PROCESSING_DATE: [{ required: true, message: "请输入", trigger: "blur" }],
+        MAINTENANCE_LEVEL: [{ required: true, message: "请选择", trigger: "blur" }],
+        MAINTENANCE_CYCLE: [{ required: true, message: "请输入", trigger: "blur" }],
+        DUE_DATE: [{ required: true, message: "请输入", trigger: "blur" }],
+        REMINDER_DAYS: [{ required: true, message: "请输入", trigger: "blur" }],
+        REMINDER_DATE: [{ required: true, message: "请输入", trigger: "blur" }],
+    }
+    const getDueDate = ()=>{
+        if(form.value.PROCESSING_DATE&&form.value.MAINTENANCE_CYCLE){
+            form.value.DUE_DATE = subtractDaysFromDate(form.value.PROCESSING_DATE,form.value.MAINTENANCE_CYCLE,true)
+            if(form.value.REMINDER_DAYS){
+                form.value.REMINDER_DATE = subtractDaysFromDate(form.value.DUE_DATE,form.value.REMINDER_DAYS)
+            }
+        }else {
+            form.value.DUE_DATE = ''
+            form.value.REMINDER_DATE = ''
+        }
+    }
+    const getRemiderDate = (val)=>{
+        if(val){
+            if(form.value.DUE_DATE){
+                form.value.REMINDER_DATE = subtractDaysFromDate(form.value.DUE_DATE,val)
+            }
+        }else {
+            form.value.REMINDER_DATE = ''
+        }
+    }
+    const getVehicle = async (event) =>{
+        const resData = await getTrailerList({TRAFFIC_TYPE:event})
+        data.vehicleList = resData.list
+        form.value.VEHICLE = ''
+        data.busInfo.DRIVING_LICENSE_IMG = []
+        data.busInfo.PLATE_NUMBER = ''
+        data.busInfo.VIN = ''
+        data.busInfo.TRAILER_TYPE = ''
+        data.busInfo.CAR_OWNERS = ''
+        data.busInfo.CAR_OWNERS_TEL = ''
+        data.busInfo.INITIAL_REGISTRATION_DATE = ''
+        data.busInfo.DRIVING_LICENSE_IMG = addingPrefixToFile(
+            []
+        );
+    }
+    getVehicle('1')
+    const fnBusChange = async (event) => {
+        const resData = await getTrailerList({ID:event})
+        data.busInfo = resData.list[0]
+        data.busInfo.DRIVING_LICENSE_IMG = addingPrefixToFile(
+            resData.drivingLicenseImgs
+        );
+    };
+    const getBusInfo = (val)=>{
+        console.log(val)
+        if(val){
+            fnBusChange(val)
+        }else {
+            data.busInfo.DRIVING_LICENSE_IMG = []
+            data.busInfo.PLATE_NUMBER = ''
+            data.busInfo.VIN = ''
+            data.busInfo.TRAILER_TYPE = ''
+            data.busInfo.CAR_OWNERS = ''
+            data.busInfo.CAR_OWNERS_TEL = ''
+            data.busInfo.INITIAL_REGISTRATION_DATE = ''
+            data.busInfo.COMPANY_AREA = ''
+            data.busInfo.DRIVING_LICENSE_IMG = addingPrefixToFile(
+                []
+            );
+        }
+    }
+    const fnGetData = async () => {
+        if (!MAINTENANCE_ID) return;
+        const resData = await getMaintenanceView({ MAINTENANCE_ID });
+        form.value = resData.pd;
+        form.value.MAINTENANCEINFO = []
+        fnBusChange(form.value.VEHICLE)
+        form.value.MAINTENANCEINFO = addingPrefixToFile(
+            resData.maintenanceinfoImgs
+        );
+    };
+    fnGetData();
+
+    const fnSubmit = debounce(
+        1000,
+        async () => {
+            await useFormValidate(formRef);
+            const resData = !MAINTENANCE_ID
+                ? await setMaintenanceAdd({ ...form.value })
+                : await setMaintenanceEdit({ ...form.value ,MAINTENANCE_ID:MAINTENANCE_ID});
+            const currentId =resData.pd.MAINTENANCE_ID
+            for (let i = 0; i < form.value.MAINTENANCEINFO.length; i++) {
+                if (form.value.MAINTENANCEINFO[i].raw)
+                    await fnUploadImage(currentId, form.value.MAINTENANCEINFO[i].raw, 127);
+            }
+            ElMessage.success("保存成功");
+            router.back();
+        },
+        { atBegin: true }
+    );
+    const fnUploadImage = async (HIDDEN_ID, FFILE, TYPE) => {
+        const formData = new FormData();
+        formData.append("FOREIGN_KEY", HIDDEN_ID);
+        formData.append("TYPE", TYPE);
+        formData.append("FFILE", FFILE);
+        await setUploadImg(formData);
+    };
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/mechanical_files/maintenance/components/export_excel.vue b/src/views/mechanical_files/maintenance/components/export_excel.vue
new file mode 100644
index 0000000..f2388fa
--- /dev/null
+++ b/src/views/mechanical_files/maintenance/components/export_excel.vue
@@ -0,0 +1,135 @@
+<template>
+  <el-dialog v-model="visible" title="导出" :on-close="fnClose">
+    <el-checkbox
+      :indeterminate="isIndeterminate"
+      v-model="checkAll"
+      @change="fnCheckAllChange"
+    >
+      全选
+    </el-checkbox>
+    <el-checkbox v-model="havePicture">
+      导出带图片的excel(最多10条)
+    </el-checkbox>
+    <el-divider />
+    <el-checkbox-group v-model="checkOptions" @change="fnCheckedChange">
+      <el-row>
+        <el-col v-for="(item, index) in options" :span="4" :key="index">
+          <el-checkbox :label="item" :value="item" />
+        </el-col>
+      </el-row>
+    </el-checkbox-group>
+    <template #footer>
+      <el-button @click="fnClose">取 消</el-button>
+      <el-button type="primary" @click="fnSubmit">导 出</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { useVModel } from "@vueuse/core";
+import { ref } from "vue";
+import { debounce } from "throttle-debounce";
+import { ElMessage } from "element-plus";
+import useDownloadBlob from "@/assets/js/useDownloadBlob.js";
+import QS from "qs";
+
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    required: true,
+    default: false,
+  },
+  searchForm: {
+    type: Object,
+    required: true,
+    default: () => {},
+  },
+  ids: {
+    type: Array,
+    required: true,
+    default: () => [],
+  },
+});
+const emits = defineEmits(["update:visible"]);
+const visible = useVModel(props, "visible", emits);
+const options = [
+  "自编号",
+  "车牌号",
+  "车架号",
+  "挂车类型",
+  "营运证号",
+  "运输企业",
+  "归属部门",
+  "车主/业户",
+  "车主电话",
+  "联系人",
+  "联系电话",
+  "初登日期",
+  "发证日期",
+  "到期日期",
+  "挂车品牌",
+  "挂车型号",
+  "核定总质量",
+  "核定载质量",
+  "容积/体积",
+  "备注",
+  "挂车照片",
+  "行驶证照片",
+  "运营证照片",
+  "挂车资料",
+];
+const checkAll = ref(true);
+const isIndeterminate = ref(false);
+const checkOptions = ref(options);
+const havePicture = ref(false);
+const fnCheckAllChange = (val) => {
+  checkOptions.value = val ? options : [];
+  isIndeterminate.value = false;
+};
+const fnCheckedChange = (value) => {
+  const checkedCount = value.length;
+  checkAll.value = checkedCount === options.length;
+  isIndeterminate.value = checkedCount > 0 && checkedCount < options.length;
+};
+const fnClose = () => {
+  visible.value = false;
+  checkOptions.value = options;
+  isIndeterminate.value = false;
+  checkAll.value = true;
+  havePicture.value = false;
+};
+const fnSubmit = debounce(
+  1000,
+  () => {
+    let data = {
+      havePicture: havePicture.value ? "1" : "0",
+      options: JSON.stringify(checkOptions.value),
+    };
+    if (havePicture.value) {
+      const ids = props.ids;
+      if (ids.length === 0) {
+        ElMessage.warning("请选择要导出的数据");
+        return;
+      }
+      if (ids.length > 10) {
+        ElMessage.warning("选择的数据超过10条");
+        return;
+      }
+      data = {
+        ...data, FREIGHTTRAILER_IDs: ids.join(","),
+      };
+    } else {
+      const searchForm = props.searchForm;
+      data = {
+        ...data,
+        PLATE_NUMBER: searchForm.PLATE_NUMBER,
+        VIN: searchForm.VIN,
+      };
+    }
+    useDownloadBlob("/freightTrailer/excel" + "?" + QS.stringify(data));
+  },
+  { atBegin: true }
+);
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/mechanical_files/maintenance/edit.vue b/src/views/mechanical_files/maintenance/edit.vue
new file mode 100644
index 0000000..d56148e
--- /dev/null
+++ b/src/views/mechanical_files/maintenance/edit.vue
@@ -0,0 +1,374 @@
+<template>
+    <layout-card>
+        <el-form ref="formRef" :rules="rules" :model="form" label-width="140px">
+            <el-row :gutter="20">
+                <el-col :span="24">
+                    <el-divider content-position="left">车辆选择</el-divider>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保车辆" prop="VEHICLE">
+                        <el-select v-model="form.VEHICLE" @change="getBusInfo">
+                            <el-option
+                                    v-for="item in data.vehicleList"
+                                    :key="item.ID"
+                                    :label="item.PLATE_NUMBER"
+                                    :value="item.ID"
+                            />
+                        </el-select>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="24">
+                    <el-divider content-position="left">基本信息</el-divider>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="行驶证照片" prop="DRIVING_LICENSE_IMG">
+                        <layout-upload
+                                v-model:file-list="data.busInfo.DRIVING_LICENSE_IMG"
+                                list-type="picture-card"
+                                accept=".jpg,.jpeg,.png"
+                                delete-to-server
+                                disabled
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车牌号" prop="PLATE_NUMBER">
+                        <el-input v-model="data.busInfo.PLATE_NUMBER" disabled />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车架号" prop="VIN">
+                        <el-input v-model="data.busInfo.VIN" disabled/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车辆类型" prop="TRAILER_TYPE">
+                        <el-input v-model="data.busInfo.TRAILER_TYPE" disabled/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车主/业户" prop="CAR_OWNERS ">
+                        <el-input v-model="data.busInfo.CAR_OWNERS " disabled/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车主电话" prop="CAR_OWNERS_TEL">
+                        <el-input v-model="data.busInfo.CAR_OWNERS_TEL" disabled/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="初登日期" prop="INITIAL_REGISTRATION_DATE">
+                        <el-date-picker
+                                v-model="data.busInfo.INITIAL_REGISTRATION_DATE"
+                                value-format="YYYY-MM-DD"
+                                format="YYYY-MM-DD"
+                                type="date"
+                                disabled
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="所属区域" prop="COMPANY_AREA">
+                        <el-input v-model="data.busInfo.COMPANY_AREA" disabled/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="24">
+                    <el-divider content-position="left">维保信息</el-divider>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="编号" prop="NUM">
+                        <el-input v-model="form.NUM"  maxlength="50" show-word-limit/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="车主业户" prop="CAR_OWNERS">
+                        <el-input v-model="form.CAR_OWNERS"  maxlength="50" show-word-limit/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="联系电话" prop="TELEPHONE">
+                        <el-input v-model="form.TELEPHONE"  maxlength="11" show-word-limit/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="登记人" prop="REGISTRANT">
+                        <el-input v-model="form.REGISTRANT"  maxlength="50" show-word-limit/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保等级" prop="MAINTENANCE_LEVEL">
+                        <el-select v-model="form.MAINTENANCE_LEVEL">
+                            <el-option
+                                    v-for="item in MAINTENANCE_LEVEL_LIST"
+                                    :key="item.ID"
+                                    :label="item.NAME"
+                                    :value="item.ID"
+                            />
+                        </el-select>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保周期" prop="MAINTENANCE_CYCLE">
+                        <el-input v-model.number="form.MAINTENANCE_CYCLE" type="number" maxlength="50" show-word-limit @change="getDueDate"/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保公里数" prop="KILOMETERS">
+                        <el-input v-model.number="form.KILOMETERS" maxlength="50" show-word-limit />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="办理日期" prop="PROCESSING_DATE">
+                        <el-date-picker
+                                v-model="form.PROCESSING_DATE"
+                                value-format="YYYY-MM-DD"
+                                format="YYYY-MM-DD"
+                                type="date"
+                                @change="getDueDate"
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="到期日期" prop="DUE_DATE">
+                        <el-date-picker
+                                v-model="form.DUE_DATE"
+                                value-format="YYYY-MM-DD"
+                                format="YYYY-MM-DD"
+                                type="date"
+                                disabled
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="协议编号" prop="AGREEMENT_NUM">
+                        <el-input v-model="form.AGREEMENT_NUM"  maxlength="50" show-word-limit />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保单位" prop="MAINTENANCE_COMPANY">
+                        <el-input v-model="form.MAINTENANCE_COMPANY"  maxlength="50" show-word-limit />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="提醒天数" prop="REMINDER_DAYS">
+                        <el-input v-model.number="form.REMINDER_DAYS"  maxlength="50" show-word-limit @change="getRemiderDate"/>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="提醒日期" prop="REMINDER_DATE">
+                        <el-date-picker
+                                v-model="form.REMINDER_DATE"
+                                value-format="YYYY-MM-DD"
+                                format="YYYY-MM-DD"
+                                type="date"
+                                disabled
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="提醒状态" prop="REMINDER_STATUS">
+                        <el-switch
+                                v-model="form.REMINDER_STATUS"
+                                inline-prompt
+                                active-text="开"
+                                inactive-text="关"
+                                active-value="1"
+                                inactive-value="0"
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="维保资料" prop="MAINTENANCEINFO">
+                        <layout-upload
+                                v-model:file-list="form.MAINTENANCEINFO"
+                                list-type="picture-card"
+                                accept=".jpg,.jpeg,.png"
+                                :limit="99"
+                                delete-to-server
+                        />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                    <el-form-item label="备注" prop="NOTES">
+                        <el-input
+                                v-model="form.NOTES"
+                                type="textarea"
+                                :autosize="{ minRows: 3 }"
+                                maxlength="250" show-word-limit
+                        />
+                    </el-form-item>
+                </el-col>
+            </el-row>
+        </el-form>
+        <div class="mt-10 tc">
+            <el-button type="primary" @click="fnSubmit">保存</el-button>
+        </div>
+    </layout-card>
+</template>
+
+<script setup>
+    import LayoutUpload from "@/components/upload/index.vue";
+    import { ref ,reactive} from "vue";
+    import { debounce } from "throttle-debounce";
+    import {getMaintenanceView, setMaintenanceAdd ,setMaintenanceEdit,getTrailerList} from "@/request/mechanical_files.js";
+    import {MAINTENANCE_LEVEL_LIST} from "@/assets/js/constant.js"
+    import { setUploadImg } from "@/request/api.js";
+    import { ElMessage } from "element-plus";
+    import { useRoute, useRouter, } from "vue-router";
+    import useFormValidate from "@/assets/js/useFormValidate.js";
+    import { addingPrefixToFile ,subtractDaysFromDate} from "@/assets/js/utils.js";
+    const route = useRoute();
+    const router = useRouter();
+    const MAINTENANCE_ID = route.query.MAINTENANCE_ID
+    const formRef = ref(null);
+    const form = ref({
+        VEHICLE : '',
+        NUM:'',
+        CAR_OWNERS : '',
+        TELEPHONE : '',
+        REGISTRANT : '',
+        PROCESSING_DATE : '',
+        MAINTENANCE_LEVEL : '',
+        MAINTENANCE_CYCLE : '',
+        KILOMETERS : '',
+        DUE_DATE : '',
+        AGREEMENT_NUM : '',
+        MAINTENANCE_COMPANY : '',
+        REMINDER_DAYS : '',
+        REMINDER_DATE : '',
+        REMINDER_STATUS : '',
+        MAINTENANCEINFO : []
+    });
+    const data = reactive({
+        vehicleList: [],
+        busInfo:{
+            DRIVING_LICENSE_IMG : [],
+            PLATE_NUMBER : '',
+            VIN : '',
+            TRAILER_TYPE : '',
+            CAR_OWNERS : '',
+            CAR_OWNERS_TEL : '',
+            INITIAL_REGISTRATION_DATE : '',
+            COMPANY_AREA:'',
+        }
+    });
+    const rules = {
+        VEHICLE: [{ required: true, message: "请输入", trigger: "blur" }],
+        CAR_OWNERS: [{ required: true, message: "请输入", trigger: "blur" }],
+        TELEPHONE: [
+            { required: true, message: "请输入", trigger: "blur" },
+            { min: 11, max: 11, message: "请输入11位手机号码", trigger: "blur" },
+            {
+                pattern:
+                    /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[189]))\d{8}$/,
+                message: "请输入正确的手机号码",
+            },
+        ],
+        REGISTRANT: [{ required: true, message: "请输入", trigger: "blur" }],
+        PROCESSING_DATE: [{ required: true, message: "请输入", trigger: "blur" }],
+        MAINTENANCE_LEVEL: [{ required: true, message: "请选择", trigger: "blur" }],
+        MAINTENANCE_CYCLE: [{ required: true, message: "请输入", trigger: "blur" }],
+        DUE_DATE: [{ required: true, message: "请输入", trigger: "blur" }],
+        REMINDER_DAYS: [{ required: true, message: "请输入", trigger: "blur" }],
+        REMINDER_DATE: [{ required: true, message: "请输入", trigger: "blur" }],
+    }
+    const getDueDate = ()=>{
+        if(form.value.PROCESSING_DATE&&form.value.MAINTENANCE_CYCLE){
+            form.value.DUE_DATE = subtractDaysFromDate(form.value.PROCESSING_DATE,form.value.MAINTENANCE_CYCLE,true)
+            if(form.value.REMINDER_DAYS){
+                form.value.REMINDER_DATE = subtractDaysFromDate(form.value.DUE_DATE,form.value.REMINDER_DAYS)
+            }
+        }else {
+            form.value.DUE_DATE = ''
+            form.value.REMINDER_DATE = ''
+        }
+    }
+    const getRemiderDate = (val)=>{
+        if(val){
+            if(form.value.DUE_DATE){
+                form.value.REMINDER_DATE = subtractDaysFromDate(form.value.DUE_DATE,val)
+            }
+        }else {
+            form.value.REMINDER_DATE = ''
+        }
+    }
+    const getVehicle = async (event) =>{
+        const resData = await getTrailerList({TRAFFIC_TYPE:event})
+        data.vehicleList = resData.list
+        form.value.VEHICLE = ''
+        data.busInfo.DRIVING_LICENSE_IMG = []
+        data.busInfo.PLATE_NUMBER = ''
+        data.busInfo.VIN = ''
+        data.busInfo.TRAILER_TYPE = ''
+        data.busInfo.CAR_OWNERS = ''
+        data.busInfo.CAR_OWNERS_TEL = ''
+        data.busInfo.INITIAL_REGISTRATION_DATE = ''
+        data.busInfo.DRIVING_LICENSE_IMG = addingPrefixToFile(
+            []
+        );
+    }
+    getVehicle('1')
+    const fnBusChange = async (event) => {
+        const resData = await getTrailerList({ID:event})
+        data.busInfo = resData.list[0]
+        data.busInfo.DRIVING_LICENSE_IMG = addingPrefixToFile(
+            resData.drivingLicenseImgs
+        );
+    };
+    const getBusInfo = (val)=>{
+        console.log(val)
+        if(val){
+            fnBusChange(val)
+        }else {
+            data.busInfo.DRIVING_LICENSE_IMG = []
+            data.busInfo.PLATE_NUMBER = ''
+            data.busInfo.VIN = ''
+            data.busInfo.TRAILER_TYPE = ''
+            data.busInfo.CAR_OWNERS = ''
+            data.busInfo.CAR_OWNERS_TEL = ''
+            data.busInfo.INITIAL_REGISTRATION_DATE = ''
+            data.busInfo.COMPANY_AREA = ''
+            data.busInfo.DRIVING_LICENSE_IMG = addingPrefixToFile(
+                []
+            );
+        }
+    }
+    const fnGetData = async () => {
+        if (!MAINTENANCE_ID) return;
+        const resData = await getMaintenanceView({ MAINTENANCE_ID });
+        form.value = resData.pd;
+        form.value.MAINTENANCEINFO = []
+        fnBusChange(form.value.VEHICLE)
+        form.value.MAINTENANCEINFO = addingPrefixToFile(
+            resData.maintenanceinfoImgs
+        );
+    };
+    fnGetData();
+
+    const fnSubmit = debounce(
+        1000,
+        async () => {
+            await useFormValidate(formRef);
+            const resData = !MAINTENANCE_ID
+                ? await setMaintenanceAdd({ ...form.value })
+                : await setMaintenanceEdit({ ...form.value ,MAINTENANCE_ID:MAINTENANCE_ID});
+            const currentId =resData.pd.MAINTENANCE_ID
+            for (let i = 0; i < form.value.MAINTENANCEINFO.length; i++) {
+                if (form.value.MAINTENANCEINFO[i].raw)
+                    await fnUploadImage(currentId, form.value.MAINTENANCEINFO[i].raw, 127);
+            }
+            ElMessage.success("保存成功");
+            router.back();
+        },
+        { atBegin: true }
+    );
+    const fnUploadImage = async (HIDDEN_ID, FFILE, TYPE) => {
+        const formData = new FormData();
+        formData.append("FOREIGN_KEY", HIDDEN_ID);
+        formData.append("TYPE", TYPE);
+        formData.append("FFILE", FFILE);
+        await setUploadImg(formData);
+    };
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/mechanical_files/maintenance/index.vue b/src/views/mechanical_files/maintenance/index.vue
new file mode 100644
index 0000000..63b24ed
--- /dev/null
+++ b/src/views/mechanical_files/maintenance/index.vue
@@ -0,0 +1,249 @@
+<template>
+    <div>
+        <el-card>
+            <el-form
+                    :model="searchForm"
+                    label-width="100px"
+                    @submit.prevent="fnResetPaginationTransfer"
+            >
+                <el-row>
+                    <el-col :span="6">
+                        <el-form-item label="车牌号" prop="PLATE_NUMBER">
+                            <el-input v-model="searchForm.PLATE_NUMBER" />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="6">
+                        <el-form-item label="车主业户" prop="CAR_OWNERS">
+                            <el-input v-model="searchForm.CAR_OWNERS" />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="6">
+                        <el-form-item label="登记人" prop="REGISTRANT">
+                            <el-input v-model="searchForm.REGISTRANT" />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="6">
+                        <el-form-item label="到期日期" prop="DUE_DATE">
+                            <el-date-picker
+                                    v-model="searchForm.DUE_DATE"
+                                    value-format="YYYY-MM-DD"
+                                    format="YYYY-MM-DD"
+                                    type="date"
+                            />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="6">
+                        <el-form-item label="到期状态" prop="DUE_DATE_TYPE">
+                            <el-select v-model="searchForm.DUE_DATE_TYPE">
+                                <el-option
+                                        v-for="item in DUE_STATUS_LIST"
+                                        :key="item.ID"
+                                        :label="item.NAME"
+                                        :value="item.ID"
+                                />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="6">
+                        <el-form-item label="提醒状态" prop="REMINDER_STATUS">
+                            <el-select v-model="searchForm.REMINDER_STATUS">
+                                <el-option
+                                        v-for="item in REMINDER_STATUS_LIST"
+                                        :key="item.ID"
+                                        :label="item.NAME"
+                                        :value="item.ID"
+                                />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="4">
+                        <el-form-item label-width="10px">
+                            <el-button type="primary" native-type="submit">搜索</el-button>
+                            <el-button native-type="reset" @click="fnResetPaginationTransfer">
+                                重置
+                            </el-button>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="2">
+                        <el-form-item label-width="10px" class="end">
+                            <el-button @click="fnExport">导出</el-button>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+            </el-form>
+        </el-card>
+        <layout-card>
+            <layout-table
+                    :data="list"
+                    @get-data="fnGetDataTransfer"
+                    v-model:pagination="pagination"
+                    ref="tableRef"
+                    row-key="MAINTENANCE_ID"
+            >
+                <el-table-column reserve-selection type="selection" width="55" />
+                <el-table-column label="序号" width="60">
+                    <template #default="{ $index }">
+                        {{ serialNumber(pagination, $index) }}
+                    </template>
+                </el-table-column>
+                <el-table-column prop="NUM" label="编号" width="150"/>
+                <el-table-column prop="PLATE_NUMBER" label="车牌号" width="150"/>
+                <el-table-column prop="CAR_OWNERS" label="车主业户" width="150"/>
+                <el-table-column prop="TELEPHONE" label="联系电话" width="150"/>
+                <el-table-column prop="MAINTENANCE_LEVEL" label="维保等级" width="150">
+                    <template #default="{ row }">
+                        {{translationStatus(row.MAINTENANCE_LEVEL,MAINTENANCE_LEVEL_LIST)}}
+                    </template>
+                </el-table-column>
+                <el-table-column prop="PROCESSING_DATE" label="办理日期" width="150"/>
+                <el-table-column prop="MAINTENANCE_CYCLE" label="维保周期" width="150"/>
+                <el-table-column prop="DUE_DATE" label="到期日期" width="150"/>
+                <el-table-column prop="REGISTRANT" label="登记人" width="150"/>
+                <!--<el-table-column prop="CONTACTS" label="经营企业" width="150"/>-->
+                <el-table-column prop="REMINDER_STATUS" label="提醒状态" width="150">
+                    <template #default="{ row }">
+                        <span v-if="row.REMINDER_STATUS==='1'">开启</span>
+                        <span v-else-if="row.REMINDER_STATUS==='0'">关闭</span>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="DUE_DATE_TYPE" label="到期状态" width="150">
+                    <template #default="{ row }">
+                        <span v-if="row.DUE_DATE_TYPE===1">未到期</span>
+                        <span v-else-if="row.DUE_DATE_TYPE===0">已到期</span>
+                        <span v-else-if="row.DUE_DATE_TYPE===2">即将到期</span>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="ARCHIVES_TYPE" label="档案状态" width="150"/>
+                <el-table-column prop="CREATTIME" label="创建时间" width="150"/>
+                <el-table-column prop="OPERATTIME" label="修改时间" width="150"/>
+                <el-table-column label="操作" width="250">
+                    <template #default="{ row }">
+                        <el-button
+                                type="primary"
+                                text
+                                link
+                                @click="router.push({path: '/mechanical_files/maintenance/view',query: { MAINTENANCE_ID: row.MAINTENANCE_ID },})">
+                            查看
+                        </el-button>
+                        <el-button
+                                type="primary"
+                                text
+                                link
+                                @click="router.push({path: '/mechanical_files/maintenance/edit',query: { MAINTENANCE_ID: row.MAINTENANCE_ID },})">
+                            编辑
+                        </el-button>
+                        <el-button
+                                type="primary"
+                                text
+                                link
+                                @click="fnDelete(row.MAINTENANCE_ID)">
+                            删除
+                        </el-button>
+                        <el-button
+                                v-if="row.REMINDER_STATUS==='0'"
+                                type="primary"
+                                text
+                                link
+                                @click="fnStatusChange(row.MAINTENANCE_ID,'1')">
+                            开启
+                        </el-button>
+                        <el-button
+                                v-if="row.REMINDER_STATUS==='1'"
+                                type="primary"
+                                text
+                                link
+                                @click="fnStatusChange(row.MAINTENANCE_ID,'0')">
+                            关闭
+                        </el-button>
+                    </template>
+                </el-table-column>
+                <template #button>
+                    <el-button
+                            v-if="buttonJurisdiction.add"
+                            type="primary"
+                            @click="router.push({ path: '/mechanical_files/maintenance/add' })">
+                        新增
+                    </el-button>
+                </template>
+            </layout-table>
+        </layout-card>
+        <export-excel
+                v-model:visible="data.exportExcelDialog.visible"
+                :search-form="searchForm"
+                :ids="data.exportExcelDialog.ids"
+        />
+    </div>
+</template>
+
+<script setup>
+    import { useRouter } from "vue-router";
+    import { serialNumber ,translationStatus} from "@/assets/js/utils";
+    import useButtonJurisdiction from "@/assets/js/useButtonJurisdiction.js";
+    import useListData from "@/assets/js/useListData.js";
+    import { getMaintenanceList ,setMaintenanceDelete,setMaintenanceEdit2} from "@/request/mechanical_files.js";
+    import ExportExcel from "./components/export_excel.vue";
+    import { reactive } from "vue";
+    import { debounce } from "throttle-debounce";
+    import { ElMessageBox ,ElMessage} from "element-plus";
+    import {MAINTENANCE_LEVEL_LIST,DUE_STATUS_LIST,REMINDER_STATUS_LIST} from "@/assets/js/constant.js"
+    const router = useRouter();
+    const data = reactive({
+        exportExcelDialog: {
+            visible: false,
+            ids: [],
+        },
+    });
+    const { list, pagination, searchForm, fnGetData, fnResetPagination, tableRef } =
+        useListData(getMaintenanceList);
+    const fnGetDataTransfer = () => {
+        fnGetData({
+            PLATE_NUMBER: searchForm.value.PLATE_NUMBER,
+            CAR_OWNERS: searchForm.value.CAR_OWNERS,
+            REGISTRANT: searchForm.value.REGISTRANT,
+            DUE_DATE: searchForm.value.DUE_DATE,
+            VEHICLE_MODEL: searchForm.value.VEHICLE_MODEL,
+            DUE_DATE_TYPE: searchForm.value.DUE_DATE_TYPE,
+            REMINDER_STATUS:searchForm.value.REMINDER_STATUS
+        });
+    };
+    const fnResetPaginationTransfer = () => {
+        fnResetPagination({
+            PLATE_NUMBER: searchForm.value.PLATE_NUMBER,
+            CAR_OWNERS: searchForm.value.CAR_OWNERS,
+            REGISTRANT: searchForm.value.REGISTRANT,
+            DUE_DATE: searchForm.value.DUE_DATE,
+            VEHICLE_MODEL: searchForm.value.VEHICLE_MODEL,
+            DUE_DATE_TYPE: searchForm.value.DUE_DATE_TYPE,
+            REMINDER_STATUS:searchForm.value.REMINDER_STATUS
+        });
+    };
+    const fnDelete = debounce(
+        1000,
+        async (MAINTENANCE_ID) => {
+            await ElMessageBox.confirm("确定要删除吗？", { type: "warning" });
+            await setMaintenanceDelete({ MAINTENANCE_ID });
+            ElMessage.success("删除成功");
+            fnResetPaginationTransfer();
+        },
+        { atBegin: true }
+    );
+    const fnStatusChange = debounce(
+        1000,
+        async (MAINTENANCE_ID,REMINDER_STATUS) => {
+            const msg = REMINDER_STATUS==='0'?'关闭':'开启'
+            await ElMessageBox.confirm("确定要"+msg+"提醒吗？", { type: "warning" });
+            await setMaintenanceEdit2({ MAINTENANCE_ID ,REMINDER_STATUS});
+            ElMessage.success(msg+"成功");
+            fnResetPaginationTransfer();
+        },
+        { atBegin: true }
+    );
+    const buttonJurisdiction = await useButtonJurisdiction("hidden");
+    const fnExport = () => {
+        const selectionData = tableRef.value.getSelectionRows();
+        data.exportExcelDialog.ids = selectionData.map((item) => item.MAINTENANCE_ID);
+        data.exportExcelDialog.visible = true;
+    };
+</script>
+
+<style scoped></style>
diff --git a/src/views/mechanical_files/maintenance/view.vue b/src/views/mechanical_files/maintenance/view.vue
new file mode 100644
index 0000000..a5a9244
--- /dev/null
+++ b/src/views/mechanical_files/maintenance/view.vue
@@ -0,0 +1,140 @@
+<template>
+    <layout-card>
+        <div id="printContainer">
+            <el-divider content-position="left">{{data.busInfo.PLATE_NUMBER}}车辆档案</el-divider>
+            <el-descriptions :column="2" border>
+                <el-descriptions-item label-class-name="width_200"  label="登记编号">
+                    {{ info.NUM }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="车牌号">
+                    {{ data.busInfo.PLATE_NUMBER }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="车架号">
+                    {{ data.busInfo.VIN }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="车辆类型">
+                    {{ data.busInfo.TRAILER_TYPE }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="车辆型号">
+                    {{ data.busInfo.VEHICLE_MODEL }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="车辆品牌">
+                    {{ data.busInfo.VEHICLE_BRAND }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="车主业户">
+                    {{ data.busInfo.CAR_OWNERS }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="联系电话">
+                    {{ data.busInfo.CAR_OWNERS_TEL }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="初登日期">
+                    {{ data.busInfo.INITIAL_REGISTRATION_DATE }}
+                </el-descriptions-item>
+                <!--<el-descriptions-item label-class-name="width_200"  label="经营企业">-->
+                    <!--{{ info.CAR_OWNERS }}-->
+                <!--</el-descriptions-item>-->
+            </el-descriptions>
+            <el-divider content-position="left">维保信息</el-divider>
+            <el-descriptions :column="2" border>
+                <el-descriptions-item label-class-name="width_200"  label="登记人">
+                    {{ info.REGISTRANT }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="维保等级">
+                    {{ translationStatus(info.MAINTENANCE_LEVEL,MAINTENANCE_LEVEL_LIST) }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="协议编号">
+                    {{ info.AGREEMENT_NUM }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="维保公里数">
+                    {{ info.KILOMETERS }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="维保周期">
+                    {{ info.MAINTENANCE_CYCLE }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="办理日期">
+                    {{ info.PROCESSING_DATE }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="到期日期">
+                    {{ info.DUE_DATE }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="提醒天数">
+                    {{ info.REMINDER_DAYS }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="提醒日期">
+                    {{ info.REMINDER_DATE }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="提醒状态">
+                    {{ info.REMINDER_STATUS==='1'?'开启':'关闭' }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="维保资料" span="2">
+                    <img
+                            v-for="item in info.MAINTENANCEINFO"
+                            :key="item.FILEPATH"
+                            v-viewer
+                            :src="item.url"
+                            width="100"
+                            height="100"
+                            alt=""
+                            class="ml-10"
+                    />
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="width_200"  label="备注" span=2>
+                    {{ info.NOTES }}
+                </el-descriptions-item>
+            </el-descriptions>
+
+        </div>
+        <div class="mt-10 tc">
+            <el-button v-print="'#printContainer'" type="primary">打印</el-button>
+        </div>
+        <div v-html="PRINT_STYLE" />
+    </layout-card>
+</template>
+
+<script setup>
+    import { ref ,reactive} from "vue";
+    import { getMaintenanceView, getTrailerList} from "@/request/mechanical_files.js";
+    import { useRoute } from "vue-router";
+    import { addingPrefixToFile,translationStatus} from "@/assets/js/utils.js";
+    import {MAINTENANCE_LEVEL_LIST} from "@/assets/js/constant.js"
+    const route = useRoute();
+    const MAINTENANCE_ID = route.query;
+    const info = ref({});
+    const data = reactive({
+        busInfo:{
+            NUM:'',
+            PLATE_NUMBER:'',
+            VIN:'',
+            TRAILER_TYPE:'',
+            VEHICLE_MODEL:'',
+            VEHICLE_BRAND:'',
+            CAR_OWNERS:'',
+            CAR_OWNERS_TEL:'',
+            INITIAL_REGISTRATION_DATE:'',
+        }
+    });
+    const fnBusChange = async (event) => {
+        const resData = await getTrailerList({ID:event})
+        data.busInfo = resData.list[0]
+        data.busInfo.DRIVING_LICENSE_IMG = addingPrefixToFile(
+            resData.drivingLicenseImgs
+        );
+    };
+    const fnGetData = async () => {
+        if (!MAINTENANCE_ID) return;
+        const resData = await getMaintenanceView(MAINTENANCE_ID);
+        info.value = resData.pd;
+        info.value.MAINTENANCEINFO = []
+        fnBusChange(resData.pd.VEHICLE)
+        info.value.MAINTENANCEINFO = addingPrefixToFile(
+            resData.maintenanceinfoImgs
+        );
+    };
+    fnGetData();
+</script>
+
+<style lang="scss" scoped>
+    .width_200{
+        width: 200px;
+    }
+</style>