diff --git a/src/views/onlineHome/homestead/supervision/supervisionDetail.vue b/src/views/onlineHome/homestead/supervision/supervisionDetail.vue
new file mode 100644
index 00000000..c13978b4
--- /dev/null
+++ b/src/views/onlineHome/homestead/supervision/supervisionDetail.vue
@@ -0,0 +1,127 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+      >
+        <template #title>
+          <p style="font-weight: bold;">违法监管详情</p>
+        </template>
+      </van-nav-bar>
+      <p class="main_title">基本信息</p>
+      <div class="main_box">
+        <van-field readonly label="是否在建建筑物" v-model="sfzjjzw" input-align="right" label-width="auto" />
+        <van-field readonly label="宅基地代码" v-model="jgList.zjddm" input-align="right" label-width="auto" />
+        <van-field readonly label="监管类型" v-model="jglx" input-align="right"/>
+        <van-field readonly label="立案时间" v-model="jgList.lasj" input-align="right" />
+        <van-field readonly label="巡查人" v-model="jgList.inspector" input-align="right" label-width="auto"/>
+        <van-field readonly label="巡查时间" v-model="jgList.inspectorTime" input-align="right" />
+        <van-field readonly label="违法用地类型" v-model="wfydlx" input-align="right" />
+        <van-field readonly label="违法用地面积" v-model="jgList.wfydmj" input-align="right" label-width="auto"/>
+        <van-field readonly label="罚没款金额" v-model="jgList.fmkje" input-align="right" label-width="auto"/>
+        <van-field readonly label="请输入面积" v-model="jgList.msmj" input-align="right" label-width="auto"/>
+        <van-field readonly label="拆除面积" v-model="jgList.ccmj" input-align="right" label-width="auto"/>
+        <van-field readonly label="整改截止时间" v-model="jgList.reformDeadline" input-align="right" />
+        <van-field readonly label="备注" v-model="jgList.bz" input-align="right" label-width="auto"/>
+      </div>
+
+      <template v-if="jgList.status == 2">
+        <p class="main_title">结案信息</p>
+        <div class="main_box">
+          <van-field readonly label="结案时间" v-model="jgList.jasj" input-align="right" />
+          <van-field readonly v-model="jgList.zfrxm" label="执法人姓名" placeholder="请输入姓名" input-align="right" label-width="auto"/>
+          <van-field readonly v-model="jgList.zfdw" label="执法单位" placeholder="请输入执法单位" input-align="right" label-width="auto"/>
+          <van-field readonly v-model="jgList.qtjgyy" label="其他监管原因" placeholder="请输入监管原因" input-align="right" label-width="auto"/>
+          <van-field readonly v-model="jgList.qtjgjg" label="其他监管结果" placeholder="请输入监管结果" input-align="right" label-width="auto"/>
+        </div>
+      </template>
+    </div>
+</template>
+
+<script>
+import { getSupervision, } from "@/api/onlineHome/homestead/supervision";
+export default {
+  name: "supervisionDetail",
+  data() {
+    return {
+      currentDate: new Date(),
+      jgList:{},
+
+      sfzjjzw:'',
+      jglx:'',
+      wfydlx:'',
+
+      wfydlxDictionaries:[],
+      jglxDictionaries:[],
+      sysDictionaries:[],
+    };
+  },
+  created() {
+    this.getTaskGet();
+  },
+  computed: {
+    allowCUD: function () {
+      return this.$store.getters.businessLevel == '2'
+    },
+  },
+  methods: {
+    getTaskGet(){
+      getSupervision(this.$route.query.id).then(response => {
+        console.log(response)
+        //违法用地类型
+        this.houseGetDicts("villations_type").then((res) => {
+          for(var i = 0 ; i < res.data.length ; i++){
+            this.wfydlxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+          }
+          this.wfydlx = this.selectDictLabel(res.data, response.data.wfydlx);
+        });
+        //监管类型
+        this.houseGetDicts("jglx").then((res) => {
+          for(var i = 0 ; i < res.data.length ; i++){
+            this.jglxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+          }
+          this.jglx = this.selectDictLabel(res.data, response.data.jglx);
+        });
+        //是否在建建筑物
+        this.houseGetDicts("sys_yes_no").then((res) => {
+          for(var i = 0 ; i < res.data.length ; i++){
+            this.sysDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+          }
+          this.sfzjjzw = this.selectDictLabel(res.data, response.data.sfzjjzw);
+        });
+        this.jgList = response.data;
+      });
+    },
+    goBack(){
+      window.history.go(-1)
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+  }
+</style>