房屋详情，单元变更

src/views/system/Sdb/SdbTopupRecord/index.vue

@@ -6,9 +6,10 @@
         <el-row :gutter="10" style="font-size: 0.8rem; font-weight: 450">
           <el-col :span="4"> 设备号： {{ routeid }} </el-col>
           <el-col :span="4"> 房屋号： {{ housename }} </el-col>
-          <el-col :span="14"></el-col>
-          <el-col :span="2">
+          <el-col :span="12"></el-col>
+          <el-col :span="4" class="flex">
             <el-button @click="confinem">返回</el-button>
+            <el-button type="warning" @click="handleExport">导出数据</el-button>
           </el-col>
         </el-row>
       </template>
@@ -35,6 +36,7 @@ import { TopupRecordVO, TopupRecordQuery, TopupRecordForm } from '@/api/system/S
 
 const router = useRouter();
 const route = useRoute();
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 
 const routeid = ref(null);
 const topupRecordList = ref<TopupRecordVO[]>([]);
@@ -46,6 +48,7 @@ const initFormData: TopupRecordForm = {
   deviceCode: undefined,
   type: undefined
 };
+
 const data = reactive<PageData<TopupRecordForm, TopupRecordQuery>>({
   form: { ...initFormData },
   queryParams: {
@@ -82,6 +85,17 @@ onMounted(() => {
 const confinem = () => {
   router.back();
 };
+
+/** 导出按钮操作 */
+const handleExport = () => {
+  proxy?.download(
+    '/topupRecord/export',
+    {
+      ...queryParams.value
+    },
+    `${queryParams.value.type === '2' ? '水表' : '电表'}—${routeid.value}-充值记录.xlsx`
+  );
+};
 </script>
 
 <style lang="scss" scoped>