diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index c9a0237..6ac8c83 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -135,6 +135,10 @@
   padding: 20px;
 }
 
+.publicContainer{
+  padding: 20px;
+}
+
 .components-container {
   margin: 30px 50px;
   position: relative;

diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index c9a0237..6ac8c83 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -135,6 +135,10 @@
   padding: 20px;
 }
 
+.publicContainer{
+  padding: 20px;
+}
+
 .components-container {
   margin: 30px 50px;
   position: relative;
diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index 162ee42..cccc0ab 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -22,7 +22,8 @@
 .app-main {
   /* 50= navbar  50  */
   // min-height: calc(100vh - 50px);
-  min-height: 100vh;
+  // min-height: 100vh;
+  height: 100vh;
   width: 100%;
   position: relative;
   overflow: hidden;
@@ -35,7 +36,8 @@
 .hasTagsView {
   .app-main {
     /* 84 = navbar + tags-view = 50 + 34 */
-    min-height: calc(100vh - 84px);
+    // min-height: calc(100vh - 84px);
+    height: calc(100vh - 84px);
   }
 
   .fixed-header + .app-main {

diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index c9a0237..6ac8c83 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -135,6 +135,10 @@
   padding: 20px;
 }
 
+.publicContainer{
+  padding: 20px;
+}
+
 .components-container {
   margin: 30px 50px;
   position: relative;
diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index 162ee42..cccc0ab 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -22,7 +22,8 @@
 .app-main {
   /* 50= navbar  50  */
   // min-height: calc(100vh - 50px);
-  min-height: 100vh;
+  // min-height: 100vh;
+  height: 100vh;
   width: 100%;
   position: relative;
   overflow: hidden;
@@ -35,7 +36,8 @@
 .hasTagsView {
   .app-main {
     /* 84 = navbar + tags-view = 50 + 34 */
-    min-height: calc(100vh - 84px);
+    // min-height: calc(100vh - 84px);
+    height: calc(100vh - 84px);
   }
 
   .fixed-header + .app-main {
diff --git a/src/store/modules/permission.js b/src/store/modules/permission.js
index ec0a7b4..ec653de 100644
--- a/src/store/modules/permission.js
+++ b/src/store/modules/permission.js
@@ -33,7 +33,7 @@
     generateRoutes(roles) {
       return new Promise((resolve) => {
         // 向后端请求路由数据
-        getRouters("system,rcloud,fxzb,zhwh,voice").then((res) => {
+        getRouters("system,rcloud,fxzb,zhwh,voice,order").then((res) => {
           const sdata = JSON.parse(JSON.stringify(res.data));
           const rdata = JSON.parse(JSON.stringify(res.data));
           const defaultData = JSON.parse(JSON.stringify(res.data));

diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index c9a0237..6ac8c83 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -135,6 +135,10 @@
   padding: 20px;
 }
 
+.publicContainer{
+  padding: 20px;
+}
+
 .components-container {
   margin: 30px 50px;
   position: relative;
diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index 162ee42..cccc0ab 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -22,7 +22,8 @@
 .app-main {
   /* 50= navbar  50  */
   // min-height: calc(100vh - 50px);
-  min-height: 100vh;
+  // min-height: 100vh;
+  height: 100vh;
   width: 100%;
   position: relative;
   overflow: hidden;
@@ -35,7 +36,8 @@
 .hasTagsView {
   .app-main {
     /* 84 = navbar + tags-view = 50 + 34 */
-    min-height: calc(100vh - 84px);
+    // min-height: calc(100vh - 84px);
+    height: calc(100vh - 84px);
   }
 
   .fixed-header + .app-main {
diff --git a/src/store/modules/permission.js b/src/store/modules/permission.js
index ec0a7b4..ec653de 100644
--- a/src/store/modules/permission.js
+++ b/src/store/modules/permission.js
@@ -33,7 +33,7 @@
     generateRoutes(roles) {
       return new Promise((resolve) => {
         // 向后端请求路由数据
-        getRouters("system,rcloud,fxzb,zhwh,voice").then((res) => {
+        getRouters("system,rcloud,fxzb,zhwh,voice,order").then((res) => {
           const sdata = JSON.parse(JSON.stringify(res.data));
           const rdata = JSON.parse(JSON.stringify(res.data));
           const defaultData = JSON.parse(JSON.stringify(res.data));
diff --git a/src/views/order/workOrderProcessing/index.vue b/src/views/order/workOrderProcessing/index.vue
new file mode 100644
index 0000000..604c354
--- /dev/null
+++ b/src/views/order/workOrderProcessing/index.vue
@@ -0,0 +1,141 @@
+<template>
+  <div class="workOrderProcessing publicContainer">
+    <div class="orderTop">
+      <div class="orderTitle" v-for="(item, index) in orderTitleList" :key="index">
+        <div class="orderName">{{ item.title }}</div>
+        <div class="orderNum" v-if="index != 0">{{ '( ' + item.num + ' )' }}</div>
+      </div>
+    </div>
+    <div class="orderBottom">
+      <el-row>
+        <el-col :span="7" class="flex flex-align-center chooseTime">
+          <span class="title">监测时间：</span>
+          <el-date-picker
+            v-model="dateRange"
+            type="datetimerange"
+            range-separator="To"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          />
+        </el-col>
+        <el-col :span="5" class="flex flex-align-center chooseType">
+          <span class="title">工单类型：</span>
+          <el-select v-model="value" placeholder="Select" style="width: 240px">
+            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </el-col>
+        <el-col :span="6">
+          <el-button type="primary">查询</el-button>
+          <el-button type="primary">导出</el-button>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<script setup name="workOrderProcessing">
+const dateRange = ref([]);
+const value = ref('');
+
+const options = [
+  {
+    value: 'Option1',
+    label: 'Option1',
+  },
+  {
+    value: 'Option2',
+    label: 'Option2',
+  },
+  {
+    value: 'Option3',
+    label: 'Option3',
+  },
+  {
+    value: 'Option4',
+    label: 'Option4',
+  },
+  {
+    value: 'Option5',
+    label: 'Option5',
+  },
+];
+const orderTitleList = ref([
+  {
+    title: '登记工单',
+    num: '1',
+  },
+  {
+    title: '工单查询',
+    num: '0',
+  },
+  {
+    title: '工单提交',
+    num: '0',
+  },
+  {
+    title: '工单分派',
+    num: '0',
+  },
+  {
+    title: '工单响应',
+    num: '0',
+  },
+  {
+    title: '工单上报',
+    num: '0',
+  },
+  {
+    title: '工单核实',
+    num: '0',
+  },
+  {
+    title: '工单结案',
+    num: '0',
+  },
+]);
+</script>
+
+<style lang="scss" scoped>
+.workOrderProcessing {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+//   border: 1px solid red;
+  .orderTop {
+    display: flex;
+    // justify-content: space-between;
+    align-items: center;
+    .orderTitle {
+      width: 150px;
+      height: 70px;
+      background-color: rgb(22, 155, 213);
+      margin-right: 30px;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      border-radius: 10px;
+      color: #fff;
+      .orderName {
+        font-size: 24px;
+      }
+      .orderNum {
+        font-size: 20px;
+      }
+    }
+  }
+  .orderBottom {
+    padding-top: 20px;
+    width: 100%;
+    height: calc(100% - 70px);
+    // border: 1px solid red;
+    box-sizing: border-box;
+    .chooseType{
+        margin-left: 20px;
+    }
+    .title{
+        font-size: 16px;
+    }
+  }
+}
+</style>

diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index c9a0237..6ac8c83 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -135,6 +135,10 @@
   padding: 20px;
 }
 
+.publicContainer{
+  padding: 20px;
+}
+
 .components-container {
   margin: 30px 50px;
   position: relative;
diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index 162ee42..cccc0ab 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -22,7 +22,8 @@
 .app-main {
   /* 50= navbar  50  */
   // min-height: calc(100vh - 50px);
-  min-height: 100vh;
+  // min-height: 100vh;
+  height: 100vh;
   width: 100%;
   position: relative;
   overflow: hidden;
@@ -35,7 +36,8 @@
 .hasTagsView {
   .app-main {
     /* 84 = navbar + tags-view = 50 + 34 */
-    min-height: calc(100vh - 84px);
+    // min-height: calc(100vh - 84px);
+    height: calc(100vh - 84px);
   }
 
   .fixed-header + .app-main {
diff --git a/src/store/modules/permission.js b/src/store/modules/permission.js
index ec0a7b4..ec653de 100644
--- a/src/store/modules/permission.js
+++ b/src/store/modules/permission.js
@@ -33,7 +33,7 @@
     generateRoutes(roles) {
       return new Promise((resolve) => {
         // 向后端请求路由数据
-        getRouters("system,rcloud,fxzb,zhwh,voice").then((res) => {
+        getRouters("system,rcloud,fxzb,zhwh,voice,order").then((res) => {
           const sdata = JSON.parse(JSON.stringify(res.data));
           const rdata = JSON.parse(JSON.stringify(res.data));
           const defaultData = JSON.parse(JSON.stringify(res.data));
diff --git a/src/views/order/workOrderProcessing/index.vue b/src/views/order/workOrderProcessing/index.vue
new file mode 100644
index 0000000..604c354
--- /dev/null
+++ b/src/views/order/workOrderProcessing/index.vue
@@ -0,0 +1,141 @@
+<template>
+  <div class="workOrderProcessing publicContainer">
+    <div class="orderTop">
+      <div class="orderTitle" v-for="(item, index) in orderTitleList" :key="index">
+        <div class="orderName">{{ item.title }}</div>
+        <div class="orderNum" v-if="index != 0">{{ '( ' + item.num + ' )' }}</div>
+      </div>
+    </div>
+    <div class="orderBottom">
+      <el-row>
+        <el-col :span="7" class="flex flex-align-center chooseTime">
+          <span class="title">监测时间：</span>
+          <el-date-picker
+            v-model="dateRange"
+            type="datetimerange"
+            range-separator="To"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          />
+        </el-col>
+        <el-col :span="5" class="flex flex-align-center chooseType">
+          <span class="title">工单类型：</span>
+          <el-select v-model="value" placeholder="Select" style="width: 240px">
+            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </el-col>
+        <el-col :span="6">
+          <el-button type="primary">查询</el-button>
+          <el-button type="primary">导出</el-button>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<script setup name="workOrderProcessing">
+const dateRange = ref([]);
+const value = ref('');
+
+const options = [
+  {
+    value: 'Option1',
+    label: 'Option1',
+  },
+  {
+    value: 'Option2',
+    label: 'Option2',
+  },
+  {
+    value: 'Option3',
+    label: 'Option3',
+  },
+  {
+    value: 'Option4',
+    label: 'Option4',
+  },
+  {
+    value: 'Option5',
+    label: 'Option5',
+  },
+];
+const orderTitleList = ref([
+  {
+    title: '登记工单',
+    num: '1',
+  },
+  {
+    title: '工单查询',
+    num: '0',
+  },
+  {
+    title: '工单提交',
+    num: '0',
+  },
+  {
+    title: '工单分派',
+    num: '0',
+  },
+  {
+    title: '工单响应',
+    num: '0',
+  },
+  {
+    title: '工单上报',
+    num: '0',
+  },
+  {
+    title: '工单核实',
+    num: '0',
+  },
+  {
+    title: '工单结案',
+    num: '0',
+  },
+]);
+</script>
+
+<style lang="scss" scoped>
+.workOrderProcessing {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+//   border: 1px solid red;
+  .orderTop {
+    display: flex;
+    // justify-content: space-between;
+    align-items: center;
+    .orderTitle {
+      width: 150px;
+      height: 70px;
+      background-color: rgb(22, 155, 213);
+      margin-right: 30px;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      border-radius: 10px;
+      color: #fff;
+      .orderName {
+        font-size: 24px;
+      }
+      .orderNum {
+        font-size: 20px;
+      }
+    }
+  }
+  .orderBottom {
+    padding-top: 20px;
+    width: 100%;
+    height: calc(100% - 70px);
+    // border: 1px solid red;
+    box-sizing: border-box;
+    .chooseType{
+        margin-left: 20px;
+    }
+    .title{
+        font-size: 16px;
+    }
+  }
+}
+</style>
diff --git a/src/views/order/workOrderQuery/index.vue b/src/views/order/workOrderQuery/index.vue
new file mode 100644
index 0000000..5e84083
--- /dev/null
+++ b/src/views/order/workOrderQuery/index.vue
@@ -0,0 +1,10 @@
+<template>
+  <div class="workOrderQuery publicContainer">workOrderQuery</div>
+</template>
+
+<script setup name="workOrderQuery"></script>
+
+<style lang="scss" scoped>
+.workOrderQuery {
+}
+</style>