diff --git a/src/api/disasterInfo/index.js b/src/api/disasterInfo/index.js
index 9b0212b..d418187 100644
--- a/src/api/disasterInfo/index.js
+++ b/src/api/disasterInfo/index.js
@@ -79,6 +79,16 @@ export function submit(data) {
   });
 }
 
+export function deleteDisasterInfoManage(id) {
+  return request({
+    url: '/api/' + moduleName + '/ui/disasterInfo/deleteDisasterInfoManage',
+    method: 'get',
+    params: {
+      id
+    }
+  });
+}
+
 export function responseEndedDisasterInfo(id) {
   return request({
     url: '/api/' + moduleName + '/ui/disasterInfo/responseEndedDisasterInfo',
@@ -88,6 +98,7 @@ export function responseEndedDisasterInfo(id) {
     }
   });
 }
+
 export function deleteByIds(ids) {
   return request({
     url: '/api/' + moduleName + '/ui/disasterInfo/deleteByIds',
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 5b84aee..aa69963 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,142 +1,116 @@
 <template>
-  <div class="home-container layout-pd">
-    <el-row :gutter="15"
-            class="home-card-one mb15" style="margin-left:0">
-      <el-date-picker style=""
-          v-model="state.year"
-          type="year"
-          placeholder="Select year"
-           />
-      <el-button style="margin-left: 10px;"
-                    @click="getDashBoradData">Search</el-button>
-    </el-row>
-    <!-- 第一行 -->
-    <el-row :gutter="15"
-            class="home-card-one mb15">
-      <el-col :xs="24"
-              :sm="12"
-              :md="12"
-              :lg="6"
-              :xl="6"
-              v-for="(v, k) in state.homeOne"
-              :key="k"
-              :class="{ 'home-media home-media-lg': k > 1, 'home-media-sm': k === 1 }">
-        <div class="home-card-item flex">
-          <div class="flex-margin flex w100"
-               :class="` home-one-animation${k}`">
-            <div class="flex-auto">
-              <span class="font30">{{ v.num1 }}</span>
-              <span class="ml5 font16"
-                    :style="{ color: v.color1 }">{{ v.num2 }}</span>
-              <div class="mt10">{{ v.num3 }}</div>
-            </div>
-            <div class="home-card-item-icon flex"
-                 :style="{ background: `var(${v.color2})` }">
-              <i class="flex-margin font32"
-                 :class="v.num4"
-                 :style="{ color: `var(${v.color3})`,width:'44px',height:'44px',background:'url(\'/home/'+(k+1)+'.png\') no-repeat',
-                 backgroundSize: '70% 70%', backgroundPosition:'center'}"></i>
-            </div>
-          </div>
-        </div>
-      </el-col>
-    </el-row>
-    <!-- 第二行 -->
-    <el-row :gutter="15"
-            class="home-card-two mb15">
-      <!-- 响应和发起量统计 -->
-      <el-col :xs="24"
-              :sm="12"
-              :md="12"
-              :lg="12"
-              :xl="12">
-        <div class="home-card-item">
-          <div style="height: 100%" ref="homeLineRef"></div>
-        </div>
-      </el-col>
-      <!-- 全年用户访问量和下载量 -->
-      <el-col :xs="24"
-              :sm="12"
-              :md="12"
-              :lg="12"
-              :xl="12">
-        <div class="home-card-item">
-          <div style="height: 100%"
-               ref="homeVandDRef"></div>
-        </div>
-      </el-col>
-    </el-row>
-    <!-- 第三行 -->
-    <el-row :gutter="15"
-            class="home-card-three mb15">
-      <!-- chief管理 -->
-      <el-col :xs="24"
-              :sm="24"
-              :md="24"
-              :lg="12"
-              :xl="12">
-        <div class="home-card-item">
-          <div style="height: 100%"
-               ref="homeUploadRef"></div>
-        </div>
-      </el-col>
-      <!-- administrators管理 -->
-      <el-col :xs="24"
-              :sm="24"
-              :md="24"
-              :lg="12"
-              :xl="12">
-        <div class="home-card-item">
-          <div style="height: 100%"
-               ref="homeBarRef"></div>
-        </div>
-      </el-col>
-    </el-row>
-    <!-- 第四行 -->
-    <el-row :gutter="15"
-            class="home-card-four mb15">
-      <!-- 灾害发生区域占比 饼图-->
-      <el-col :xs="24"
-              :sm="24"
-              :md="24"
-              :lg="24"
-              :xl="24">
-        <div class="home-card-item" style="display: flex;height: 460px;">
-          <div style="height: 100%;width: 58%;"
-               ref="homePieRef2"></div>
-               <div style="height: 100%;width: 42%;overflow-y: auto;">
-            <el-table :data="state.typeTable" style="width: 100%">
-              <el-table-column type="index" label="TOP" width="100"  align="center"/>
-              <el-table-column prop="name" label="Disaster Type" show-overflow-tooltip align="center"></el-table-column>
-              <el-table-column prop="value" label="Number" show-overflow-tooltip align="center"></el-table-column>
-            </el-table>
-          </div>
-        </div>
-      </el-col>
-    </el-row>
-    <!-- 第五行 -->
-    <el-row :gutter="15"
-            class="home-card-five mb15">
-      <!-- 灾害发生区域占比 饼图-->
-      <el-col :xs="24"
-              :sm="24"
-              :md="24"
-              :lg="24"
-              :xl="24">
-        <div class="home-card-item" style="display: flex;height: 554px;">
-          <div style="height: 100%;width: 58%;"
-               ref="homePieRef"></div>
-          <div style="height: 100%;width: 42%;overflow-y: auto;">
-            <el-table :data="state.countryTable" style="width: 100%">
-              <el-table-column type="index" label="TOP" width="100"  align="center"/>
-              <el-table-column prop="name" label="Country" show-overflow-tooltip align="center"></el-table-column>
-              <el-table-column prop="value" label="Number" show-overflow-tooltip align="center"></el-table-column>
-            </el-table>
-          </div>
-        </div>
-      </el-col>
-    </el-row>
-  </div>
+	<div class="home-container layout-pd">
+		<el-row :gutter="15" class="home-card-one mb15" style="margin-left: 0">
+			<el-date-picker style="" v-model="state.year" type="year" placeholder="Select year" />
+			<el-button style="margin-left: 10px" @click="getDashBoradData">Search</el-button>
+		</el-row>
+		<!-- 第一行 -->
+		<el-row :gutter="15" class="home-card-one mb15">
+			<el-col
+				:xs="24"
+				:sm="12"
+				:md="12"
+				:lg="6"
+				:xl="6"
+				v-for="(v, k) in state.homeOne"
+				:key="k"
+				:class="{ 'home-media home-media-lg': k > 1, 'home-media-sm': k === 1 }"
+			>
+				<div class="home-card-item flex">
+					<div class="flex-margin flex w100" :class="` home-one-animation${k}`">
+						<div class="flex-auto">
+							<span class="font30">{{ v.num1 }}</span>
+							<span class="ml5 font16" :style="{ color: v.color1 }">{{ v.num2 }}</span>
+							<div class="mt10">{{ v.num3 }}</div>
+						</div>
+						<div class="home-card-item-icon flex" :style="{ background: `var(${v.color2})` }">
+							<i
+								class="flex-margin font32"
+								:class="v.num4"
+								:style="{
+									color: `var(${v.color3})`,
+									width: '44px',
+									height: '44px',
+									background: 'url(\'/home/' + (k + 1) + '.png\') no-repeat',
+									backgroundSize: '70% 70%',
+									backgroundPosition: 'center',
+								}"
+							></i>
+						</div>
+					</div>
+				</div>
+			</el-col>
+		</el-row>
+		<!-- 第二行 -->
+		<el-row :gutter="15" class="home-card-two mb15">
+			<!-- 响应和发起量统计 -->
+			<!-- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+				<div class="home-card-item">
+					<div style="height: 100%" ref="homeLineRef"></div>
+				</div>
+			</el-col> -->
+			<!-- 全年用户访问量和下载量 -->
+			
+		</el-row>
+
+		<!-- 第四行 -->
+		<el-row :gutter="15" class="home-card-four mb15">
+			<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+				<div class="home-card-item" style="display: flex; height: 460px">
+					<div class="home-card-item">
+						<div style="height: 100%; width: 100%" ref="homeTypeDRef"></div>
+					</div>
+				</div>
+			</el-col>
+		</el-row>
+
+		<el-row :gutter="15" class="home-card-two mb15">
+			<!-- 全年用户访问量和下载量 -->
+			<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+				<div class="home-card-item">
+					<div style="height: 100%; width: 100%" ref="homeVandDRef"></div>
+				</div>
+			</el-col>
+			<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+				<div class="home-card-item">
+					<div style="height: 100%; width: 90%" ref="homePieRef2"></div>
+				</div>
+			</el-col>
+		</el-row>
+
+		<!-- 第三行 -->
+		<el-row :gutter="15" class="home-card-three mb15">
+			<!-- chief管理 -->
+			<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+				<div class="home-card-item">
+					<div style="height: 100%" ref="homeUploadRef"></div>
+				</div>
+			</el-col>
+			<!-- administrators管理 -->
+			<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+				<div class="home-card-item">
+					<div style="height: 100%" ref="homeBarRef"></div>
+				</div>
+			</el-col>
+		</el-row>
+
+		<!-- 第五行 -->
+		<el-row :gutter="15" class="home-card-five mb15">
+			<!-- 灾害发生区域占比 饼图-->
+			<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+				<div class="home-card-item" style="display: flex; height: 554px">
+					<div style="height: 100%; width: 58%" ref="homePieRef"></div>
+					<div style="height: 100%; width: 42%; overflow-y: auto">
+						<el-table :data="state.countryTable" style="width: 100%">
+							<el-table-column type="index" label="TOP" width="100" align="center" />
+							<el-table-column prop="name" label="Country" show-overflow-tooltip align="center"></el-table-column>
+							<el-table-column prop="value" label="Number" show-overflow-tooltip align="center"></el-table-column>
+						</el-table>
+					</div>
+				</div>
+			</el-col>
+		</el-row>
+	</div>
 </template>
 
 <script setup name="home">
@@ -145,7 +119,7 @@ import * as echarts from 'echarts';
 import { storeToRefs } from 'pinia';
 import { useThemeConfig } from '/@/stores/themeConfig';
 import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
-import {statistics} from '/@/api/disasterInfo/index.js';
+import { statistics } from '/@/api/disasterInfo/index.js';
 // 定义变量内容
 //响应量 发起量
 const homeLineRef = ref();
@@ -157,599 +131,693 @@ const homeUploadRef = ref();
 const homePieRef = ref();
 const homePieRef2 = ref();
 const homeBarRef = ref();
+//类型分类
+const homeTypeDRef = ref();
 const storesTagsViewRoutes = useTagsViewRoutes();
 const storesThemeConfig = useThemeConfig();
 const { themeConfig } = storeToRefs(storesThemeConfig);
 const { isTagsViewCurrenFull } = storeToRefs(storesTagsViewRoutes);
 const state = reactive({
-  param:{
-    year:''
-  },
-  year:new Date,
-  global: {
-    homeChartOne: null,
-    homeVandD:null,
-    homeUpload:null,
-    homeChartTwo: null,
-    homeCharThree: null,
-    homeChartFour: null,
-    dispose: [null, '', undefined],
-  },
-  homeOne: [
-    {
-      num1: '',
-      num2: '',
-      num3: 'Number of disaster responses',
-      num4: 'iconfont',
-      color1: '#FF6462',
-      color2: '--next-color-primary-lighter',
-      color3: '--el-color-primary',
-    },
-    {
-      num1: '',
-      num2: '',
-      num3: 'Number of registered users',
-      num4: 'iconfont',
-      color1: '#6690F9',
-      color2: '--next-color-success-lighter',
-      color3: '--el-color-success',
-    },
-    {
-      num1: '',
-      num2: '',
-      num3: 'Number of platform visits',
-      num4: 'iconfont',
-      color1: '#6690F9',
-      color2: '--next-color-warning-lighter',
-      color3: '--el-color-warning',
-    },
-    {
-      num1: '',
-      num2: '',
-      num3: 'Number of resource downloads',
-      num4: 'iconfont',
-      color1: '#FF6462',
-      color2: '--next-color-danger-lighter',
-      color3: '--el-color-danger',
-    },
-  ],
-  homeThree: [],
-  myCharts: [],
-  charts: {
-    theme: '',
-    bgColor: '',
-    color: '#303133',
-  },
-  countryTable:[],
-  typeTable:[]
+	dataList:[],
+	param: {
+		year: '',
+	},
+	year: new Date(),
+	global: {
+		homeChartOne: null,
+		homeVandD: null,
+		homeType: null,
+		homeUpload: null,
+		homeChartTwo: null,
+		homeCharThree: null,
+		homeChartFour: null,
+		dispose: [null, '', undefined],
+	},
+	homeOne: [
+		{
+			num1: '',
+			num2: '',
+			num3: 'Number of disaster responses',
+			num4: 'iconfont',
+			color1: '#FF6462',
+			color2: '--next-color-primary-lighter',
+			color3: '--el-color-primary',
+		},
+		{
+			num1: '',
+			num2: '',
+			num3: 'Number of registered users',
+			num4: 'iconfont',
+			color1: '#6690F9',
+			color2: '--next-color-success-lighter',
+			color3: '--el-color-success',
+		},
+		{
+			num1: '',
+			num2: '',
+			num3: 'Number of platform visits',
+			num4: 'iconfont',
+			color1: '#6690F9',
+			color2: '--next-color-warning-lighter',
+			color3: '--el-color-warning',
+		},
+		{
+			num1: '',
+			num2: '',
+			num3: 'Number of resource downloads',
+			num4: 'iconfont',
+			color1: '#FF6462',
+			color2: '--next-color-danger-lighter',
+			color3: '--el-color-danger',
+		},
+	],
+	homeThree: [],
+	myCharts: [],
+	charts: {
+		theme: '',
+		bgColor: '',
+		color: '#303133',
+	},
+	countryTable: [],
+	typeTable: [],
 });
 
-
 // 响应量和发起量
-const initLineChart = (xData,data1, data2) => {
-  if (!state.global.dispose.some((b) => b === state.global.homeChartOne)) state.global.homeChartOne.dispose();
-  state.global.homeChartOne = markRaw(echarts.init(homeLineRef.value, state.charts.theme));
-  const option = {
-    backgroundColor: state.charts.bgColor,
-    title: {
-      text: 'Annual User Response Application Statistics',
-      x: 'left',
-      textStyle: { fontSize: '15', color: state.charts.color },
-    },
-    grid: { top: 70, right: 20, bottom: 30, left: 30 },
-    tooltip: { trigger: 'axis' },
-    legend: { data: ['response','initiate'], right: 0 },
-    xAxis: {
-      data: xData
-    },
-    yAxis: [
-      {
-        type: 'value',
-        name: 'response',
-        splitLine: { show: true, lineStyle: { type: 'dashed', color: '#f5f5f5' } },
-      },
-      {
-        type: 'value',
-        name: 'initiate',
-        splitLine: { show: true, lineStyle: { type: 'dashed', color: '#f5f5f5' } },
-        nameTextStyle: {
-          padding: [0, 40, 0, 0] // 上右下左
-        },
-      }
-    ],
-    series: [
-      {
-        name: 'response',
-        type: 'line',
-        symbolSize: 6,
-        symbol: 'circle',
-        smooth: true,
-        data: data1,
-        lineStyle: { color: '#fe9a8b' },
-        itemStyle: { color: '#fe9a8b', borderColor: '#fe9a8b' },
-        areaStyle: {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-            { offset: 0, color: '#fe9a8bb3' },
-            { offset: 1, color: '#fe9a8b03' },
-          ]),
-        },
-      },{
-        name: 'initiate',
-        type: 'line',
-        symbolSize: 6,
-        symbol: 'circle',
-        smooth: true,
-        data: data2,
-        lineStyle: { color: 'rgba(145,204,117,1)' },
-        itemStyle: { color: 'rgba(145,204,117,1)', borderColor: 'rgba(145,204,117,1)' },
-        areaStyle: {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-            { offset: 0, color: 'rgba(145,204,117,1)' },
-            { offset: 1, color: 'rgba(145,204,117,0)' },
-          ]),
-        },
-      }
-    ],
-  };
-  state.global.homeChartOne.setOption(option);
-  state.myCharts.push(state.global.homeChartOne);
+// const initLineChart = (xData, data1) => {
+// 	if (!state.global.dispose.some((b) => b === state.global.homeChartOne)) state.global.homeChartOne.dispose();
+// 	state.global.homeChartOne = markRaw(echarts.init(homeLineRef.value, state.charts.theme));
+// 	const option = {
+// 		backgroundColor: state.charts.bgColor,
+// 		title: {
+// 			text: 'Annual User Response Application Statistics',
+// 			x: 'left',
+// 			textStyle: { fontSize: '15', color: state.charts.color },
+// 		},
+// 		grid: { top: 70, right: 20, bottom: 30, left: 30 },
+// 		tooltip: { trigger: 'axis' },
+// 		legend: { data: ['response'], right: 0 },
+// 		xAxis: {
+// 			data: xData,
+// 		},
+// 		yAxis: [
+// 			{
+// 				type: 'value',
+// 				name: 'response',
+// 				splitLine: { show: true, lineStyle: { type: 'dashed' } },
+// 			},
+// 		],
+// 		series: [
+// 			{
+// 				name: 'response',
+// 				type: 'line',
+// 				symbolSize: 6,
+// 				symbol: 'circle',
+// 				smooth: true,
+// 				data: data1,
+// 			},
+// 		],
+// 	};
+// 	state.global.homeChartOne.setOption(option);
+// 	state.myCharts.push(state.global.homeChartOne);
+// };
+
+// 访问量 和下载次数
+const initLineVandDChart = (xData, data1, data2) => {
+	if (!state.global.dispose.some((b) => b === state.global.homeVandD)) state.global.homeVandD.dispose();
+	state.global.homeVandD = markRaw(echarts.init(homeVandDRef.value, state.charts.theme));
+	const option = {
+		backgroundColor: state.charts.bgColor,
+		title: {
+			text: 'Annual Disaster Type Visits and Downloads Statistics',
+			x: 'left',
+			textStyle: { fontSize: '15', color: state.charts.color },
+		},
+		grid: { top: 70, right: 20, bottom: 30, left: 30 },
+		tooltip: { trigger: 'axis' },
+		legend: { data: ['visit', 'download'], right: 0 },
+		xAxis: {
+			data: xData,
+		},
+		yAxis: [
+			{
+				type: 'value',
+				name: 'visit',
+				splitLine: { show: true, lineStyle: { type: 'dashed', color: '#f5f5f5' } },
+			},
+			{
+				type: 'value',
+				name: 'download',
+				splitLine: { show: true, lineStyle: { type: 'dashed', color: '#f5f5f5' } },
+				nameTextStyle: {
+					padding: [0, 40, 0, 0], // 上右下左
+				},
+			},
+		],
+		series: [
+			{
+				name: 'visit',
+				type: 'line',
+				symbolSize: 6,
+				symbol: 'circle',
+				smooth: true,
+				data: data2,
+				lineStyle: { color: 'rgba(84,112,198,1)' },
+				itemStyle: { color: 'rgba(84,112,198,1)', borderColor: 'rgba(84,112,198,1)' },
+				areaStyle: {
+					color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+						{ offset: 0, color: 'rgba(84,112,198,1)' },
+						{ offset: 1, color: 'rgba(84,112,198,0)' },
+					]),
+				},
+			},
+			{
+				name: 'download',
+				type: 'line',
+				symbolSize: 6,
+				symbol: 'circle',
+				smooth: true,
+				data: data1,
+				lineStyle: { color: 'rgba(250,200,88,1)' },
+				itemStyle: { color: 'rgba(250,200,88,1)', borderColor: 'rgba(250,200,88,1)' },
+				areaStyle: {
+					color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+						{ offset: 0, color: 'rgba(250,200,88,1)' },
+						{ offset: 1, color: 'rgba(250,200,88,0)' },
+					]),
+				},
+			},
+		],
+	};
+	state.global.homeVandD.setOption(option);
+	state.myCharts.push(state.global.homeVandD);
 };
 
 
-// 访问量 和下载次数
-const initLineVandDChart = (xData,data1, data2) => {
-  if (!state.global.dispose.some((b) => b === state.global.homeVandD)) state.global.homeVandD.dispose();
-  state.global.homeVandD = markRaw(echarts.init(homeVandDRef.value, state.charts.theme));
-  const option = {
-    backgroundColor: state.charts.bgColor,
-    title: {
-      text: 'Annual Disaster Type Visits and Downloads Statistics',
-      x: 'left',
-      textStyle: { fontSize: '15', color: state.charts.color },
-    },
-    grid: { top: 70, right: 20, bottom: 30, left: 30 },
-    tooltip: { trigger: 'axis' },
-    legend: { data: ['visit','download'], right: 0 },
-    xAxis: {
-      data: xData,
-    },
-    yAxis: [
-      {
-        type: 'value',
-        name: 'visit',
-        splitLine: { show: true, lineStyle: { type: 'dashed', color: '#f5f5f5' } },
-      },
-      {
-        type: 'value',
-        name: 'download',
-        splitLine: { show: true, lineStyle: { type: 'dashed', color: '#f5f5f5' } },
-        nameTextStyle: {
-          padding: [0, 40, 0, 0] // 上右下左
-        },
-      }
-    ],
-    series: [
-      {
-        name: 'visit',
-        type: 'line',
-        symbolSize: 6,
-        symbol: 'circle',
-        smooth: true,
-        data: data2,
-        lineStyle: { color: 'rgba(84,112,198,1)' },
-        itemStyle: { color: 'rgba(84,112,198,1)', borderColor: 'rgba(84,112,198,1)' },
-        areaStyle: {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-            { offset: 0, color: 'rgba(84,112,198,1)' },
-            { offset: 1, color: 'rgba(84,112,198,0)' },
-          ]),
-        },
-      },{
-        name: 'download',
-        type: 'line',
-        symbolSize: 6,
-        symbol: 'circle',
-        smooth: true,
-        data: data1,
-        lineStyle: { color: 'rgba(250,200,88,1)' },
-        itemStyle: { color: 'rgba(250,200,88,1)', borderColor: 'rgba(250,200,88,1)' },
-        areaStyle: {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-            { offset: 0, color: 'rgba(250,200,88,1)' },
-            { offset: 1, color: 'rgba(250,200,88,0)' },
-          ]),
-        },
-      }
-    ],
-  };
-  state.global.homeVandD.setOption(option);
-  state.myCharts.push(state.global.homeVandD);
+const initTypeChart = (xData, data1, data2, data3, data4, data5, data6, data7, data8) => {
+	if (!state.global.dispose.some((b) => b === state.global.homeType)) state.global.homeType.dispose();
+	state.global.homeType = markRaw(echarts.init(homeTypeDRef.value, state.charts.theme));
+	const option = {
+		backgroundColor: state.charts.bgColor,
+		title: {
+			text: 'Annual Disaster Statistics',
+			x: 'left',
+			textStyle: { fontSize: '15', color: state.charts.color },
+		},
+		grid: { top: 70, right: 20, bottom: 30, left: 30 },
+		tooltip: { trigger: 'axis' },
+		legend: { data: ['Earthquake', 'Volcano', 'Landslide', 'Flood', 'Hurricane', 'Drought', 'Emergency', 'response'], right: 0 },
+		xAxis: {
+			data: xData,
+		},
+		yAxis: [
+			{
+				type: 'value',
+				name: 'Type',
+				splitLine: { show: true, lineStyle: { type: 'dashed', color: '#f5f5f5' } },
+			}
+		],
+		series: [
+			{
+				name: 'Earthquake',
+				type: 'line',
+				symbolSize: 6,
+				symbol: 'circle',
+				smooth: true,
+				data: data1,
+			},
+			{
+				name: 'Volcano',
+				type: 'line',
+				symbolSize: 6,
+				symbol: 'circle',
+				smooth: true,
+				data: data2,
+			},{
+				name: 'Landslide',
+				type: 'line',
+				symbolSize: 6,
+				symbol: 'circle',
+				smooth: true,
+				data: data3,
+	
+			},{
+				name: 'Flood',
+				type: 'line',
+				symbolSize: 6,
+				symbol: 'circle',
+				smooth: true,
+				data: data4,
+			},{
+				name: 'Hurricane',
+				type: 'line',
+				symbolSize: 6,
+				symbol: 'circle',
+				smooth: true,
+				data: data5,
+			},{
+				name: 'Drought',
+				type: 'line',
+				symbolSize: 6,
+				symbol: 'circle',
+				smooth: true,
+				data: data6,
+			},{
+				name: 'Emergency',
+				type: 'line',
+				symbolSize: 6,
+				symbol: 'circle',
+				smooth: true,
+				data: data7,
+			},{
+				name: 'response',
+				type: 'line',
+				symbolSize: 6,
+				symbol: 'circle',
+				smooth: true,
+				data: data8,
+			}
+		],
+	};
+	state.global.homeType.setOption(option);
+	state.myCharts.push(state.global.homeType);
 };
 
 // Chief 管理
-const initChiefChart = (xData,yData) => {
-  if (!state.global.dispose.some((b) => b === state.global.homeUpload)) state.global.homeUpload.dispose();
-  state.global.homeUpload = echarts.init(homeUploadRef.value, state.charts.theme);
-  const option = {
-    backgroundColor: state.charts.bgColor,
-    title: {
-      text: 'Annual Chief Management Statistics TOP10',
-      x: 'left',
-      textStyle: { fontSize: '15', color: state.charts.color },
-    },
-    //tooltip: { trigger: 'item', formatter: '{c}' },
-    tooltip: {
-      show:true
-      // trigger: 'axis',
-      // axisPointer: {
-      //   type: 'shadow'
-      // },
-      // formatter: '{c}'
-    },
-    legend: { data: ['chief'], right: 0 },
-    grid: { top: 70, right: 80, bottom: 30, left: 80 },
-    xAxis: [
-      {
-        type: 'category',
-        data: xData
-      },
-    ],
-    yAxis: [
-      {
-        type:'value'
-      }
-    ],
-    series: [
-      {
-        name: 'chief',
-        type: 'bar',
-        barWidth: 30,
-        itemStyle: {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-            { offset: 0, color: 'rgba(238,102,102,1)' },
-            { offset: 1, color: 'rgba(238,102,102,0)' },
-          ]),
-          //柱状图圆角
-          borderRadius: [30, 30, 0, 0],
-        },
-        data: yData
-      }
-    ],
-  };
-  state.global.homeUpload.setOption(option);
-  state.myCharts.push(state.global.homeUpload);
+const initChiefChart = (xData, yData) => {
+	if (!state.global.dispose.some((b) => b === state.global.homeUpload)) state.global.homeUpload.dispose();
+	state.global.homeUpload = echarts.init(homeUploadRef.value, state.charts.theme);
+	const option = {
+		backgroundColor: state.charts.bgColor,
+		title: {
+			text: 'Top ten disasters initiated',
+			x: 'left',
+			textStyle: { fontSize: '15', color: state.charts.color },
+		},
+		//tooltip: { trigger: 'item', formatter: '{c}' },
+		tooltip: {
+			show: true,
+			// trigger: 'axis',
+			// axisPointer: {
+			//   type: 'shadow'
+			// },
+			// formatter: '{c}'
+		},
+		legend: { data: ['user'], right: 0 },
+		grid: { top: 70, right: 80, bottom: 30, left: 80 },
+		xAxis: [
+			{
+				type: 'category',
+				data: xData,
+			},
+		],
+		yAxis: [
+			{
+				type: 'value',
+			},
+		],
+		series: [
+			{
+				name: 'user',
+				type: 'bar',
+				barWidth: 30,
+				itemStyle: {
+					color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+						{ offset: 0, color: 'rgba(238,102,102,1)' },
+						{ offset: 1, color: 'rgba(238,102,102,0)' },
+					]),
+					//柱状图圆角
+					borderRadius: [30, 30, 0, 0],
+				},
+				data: yData,
+			},
+		],
+	};
+	state.global.homeUpload.setOption(option);
+	state.myCharts.push(state.global.homeUpload);
 };
 // administrators 管理
-const initAdministratorsChart = (xData,yData) => {
-  if (!state.global.dispose.some((b) => b === state.global.homeCharThree)) state.global.homeCharThree.dispose();
-  state.global.homeCharThree = echarts.init(homeBarRef.value, state.charts.theme);
-  const option = {
-    backgroundColor: state.charts.bgColor,
-    title: {
-      text: 'Annual Administrators Management Statistics TOP10',
-      x: 'left',
-      textStyle: { fontSize: '15', color: state.charts.color },
-    },
-    tooltip: { trigger: 'item', formatter: '{c}' },
-    legend: { data: ['administrators'], right: 0 },
-    grid: { top: 70, right: 80, bottom: 30, left: 80 },
-    xAxis: [
-      {
-        type: 'category',
-        data: xData,
-        boundaryGap: true,
-        axisTick: { show: false },
-        axisLabel: {  fontSize: '11' },
-      },
-    ],
-    yAxis: [
-      {
-        nameLocation: 'middle',
-        nameTextStyle: { padding: [50, 4, 5, 6] },
-        splitLine: { show: false },
-        axisLine: { show: false },
-        axisTick: { show: false },
-        axisLabel: { color: state.charts.color, formatter: '{value} ' },
-      },
-    ],
-    series: [
-      {
-        name: 'administrators',
-        type: 'bar',
-        barWidth: 30,
-        yAxisIndex: 0,
-        itemStyle: {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-            { offset: 0, color: 'rgba(115,192,222,1)' },
-            { offset: 1, color: 'rgba(115,192,222,0)' },
-          ]),
-          //柱状图圆角
-          borderRadius: [30, 30, 0, 0],
-        },
-        data: yData,
-      },
-    ],
-  };
-  state.global.homeCharThree.setOption(option);
-  state.myCharts.push(state.global.homeCharThree);
+const initAdministratorsChart = (xData, yData) => {
+	if (!state.global.dispose.some((b) => b === state.global.homeCharThree)) state.global.homeCharThree.dispose();
+	state.global.homeCharThree = echarts.init(homeBarRef.value, state.charts.theme);
+	const option = {
+		backgroundColor: state.charts.bgColor,
+		title: {
+			text: 'Top ten disaster response times',
+			x: 'left',
+			textStyle: { fontSize: '15', color: state.charts.color },
+		},
+		tooltip: { trigger: 'item', formatter: '{c}' },
+		legend: { data: ['user'], right: 0 },
+		grid: { top: 70, right: 80, bottom: 30, left: 80 },
+		xAxis: [
+			{
+				type: 'category',
+				data: xData,
+				boundaryGap: true,
+				axisTick: { show: false },
+				axisLabel: { fontSize: '11' },
+			},
+		],
+		yAxis: [
+			{
+				nameLocation: 'middle',
+				nameTextStyle: { padding: [50, 4, 5, 6] },
+				splitLine: { show: false },
+				axisLine: { show: false },
+				axisTick: { show: false },
+				axisLabel: { color: state.charts.color, formatter: '{value} ' },
+			},
+		],
+		series: [
+			{
+				name: 'user',
+				type: 'bar',
+				barWidth: 30,
+				yAxisIndex: 0,
+				itemStyle: {
+					color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+						{ offset: 0, color: 'rgba(115,192,222,1)' },
+						{ offset: 1, color: 'rgba(115,192,222,0)' },
+					]),
+					//柱状图圆角
+					borderRadius: [30, 30, 0, 0],
+				},
+				data: yData,
+			},
+		],
+	};
+	state.global.homeCharThree.setOption(option);
+	state.myCharts.push(state.global.homeCharThree);
 };
 //homePieRef 灾害发生区域占比 饼图
 const initPieChart = (data) => {
-  if (!state.global.dispose.some((b) => b === state.global.homeChartTwo)) state.global.homeChartTwo.dispose();
-  state.global.homeChartTwo = markRaw(echarts.init(homePieRef.value, state.charts.theme));
-  // var getname = ['房屋及结构物', '专用设备', '通用设备', '文物和陈列品', '图书、档案'];
-  // var getvalue = [34.2, 38.87, 17.88, 9.05, 2.05];
-  // var data = [];
-  // for (var i = 0; i < getname.length; i++) {
-  //   data.push({ name: getname[i], value: getvalue[i] });
-  // }
-  const colorList = ['#51A3FC', '#36C78B', '#FEC279', '#968AF5', '#E790E8'];
-  const option = {
-    backgroundColor: state.charts.bgColor,
-    title: {
-      text: 'Proportion of Disaster Occurred Areas TOP15',
-      x: 'left',
-      textStyle: { fontSize: '15', color: state.charts.color },
-    },
-    tooltip: { trigger: 'item', formatter: '{b} <br/> {c}%' },
-    graphic: {
-      elements: [
-        {
-          type: 'image',
-          z: -1,
-          style: {
-            image: themeConfig.value.isIsDark,
-            width: 230,
-            height: 230,
-          },
-          left: '16.5%',
-          top: 'center',
-        },
-      ],
-    },
-    series: [
-      {
-        type: 'pie',
-        radius: ['82', themeConfig.value.isIsDark ? '50' : '102'],
-        center: ['50%', '50%'],
-        label: { show: true },
-        labelLine: { show: true },
-        data: data,
-      },
-    ],
-  };
-  state.global.homeChartTwo.setOption(option);
-  state.myCharts.push(state.global.homeChartTwo);
+	if (!state.global.dispose.some((b) => b === state.global.homeChartTwo)) state.global.homeChartTwo.dispose();
+	state.global.homeChartTwo = markRaw(echarts.init(homePieRef.value, state.charts.theme));
+	// var getname = ['房屋及结构物', '专用设备', '通用设备', '文物和陈列品', '图书、档案'];
+	// var getvalue = [34.2, 38.87, 17.88, 9.05, 2.05];
+	// var data = [];
+	// for (var i = 0; i < getname.length; i++) {
+	//   data.push({ name: getname[i], value: getvalue[i] });
+	// }
+	const colorList = ['#51A3FC', '#36C78B', '#FEC279', '#968AF5', '#E790E8'];
+	const option = {
+		backgroundColor: state.charts.bgColor,
+		title: {
+			text: 'Proportion of Disaster Occurred Areas TOP15',
+			x: 'left',
+			textStyle: { fontSize: '15', color: state.charts.color },
+		},
+		tooltip: { trigger: 'item', formatter: '{b} <br/> {c}%' },
+		graphic: {
+			elements: [
+				{
+					type: 'image',
+					z: -1,
+					style: {
+						image: themeConfig.value.isIsDark,
+						width: 230,
+						height: 230,
+					},
+					left: '16.5%',
+					top: 'center',
+				},
+			],
+		},
+		series: [
+			{
+				type: 'pie',
+				radius: ['82', themeConfig.value.isIsDark ? '50' : '102'],
+				center: ['50%', '50%'],
+				label: { show: true },
+				labelLine: { show: true },
+				data: data,
+			},
+		],
+	};
+	state.global.homeChartTwo.setOption(option);
+	state.myCharts.push(state.global.homeChartTwo);
 };
 //homePieRef2 灾害类型占比 饼图
 const initPieChart2 = (data) => {
-  if (!state.global.dispose.some((b) => b === state.global.homeChartFour)) state.global.homeChartFour.dispose();
-  state.global.homeChartFour = markRaw(echarts.init(homePieRef2.value, state.charts.theme));
-  // var getname = ['房屋及结构物', '专用设备', '通用设备', '文物和陈列品', '图书、档案'];
-  // var getvalue = [34.2, 38.87, 17.88, 9.05, 2.05];
-  // var data = [];
-  // for (var i = 0; i < getname.length; i++) {
-  //   data.push({ name: getname[i], value: getvalue[i] });
-  // }
-  const colorList = ['#51A3FC', '#36C78B', '#FEC279', '#968AF5', '#E790E8'];
-  const option = {
-    backgroundColor: state.charts.bgColor,
-    title: {
-      text: 'Disaster Type Proportion',
-      x: 'left',
-      textStyle: { fontSize: '15', color: state.charts.color },
-    },
-    tooltip: { trigger: 'item', formatter: '{b} <br/> {c}%' },
-    graphic: {
-      elements: [
-        {
-          type: 'image',
-          z: -1,
-          style: {
-            image: themeConfig.value.isIsDark,
+	if (!state.global.dispose.some((b) => b === state.global.homeChartFour)) state.global.homeChartFour.dispose();
+	state.global.homeChartFour = markRaw(echarts.init(homePieRef2.value, state.charts.theme));
+	// var getname = ['房屋及结构物', '专用设备', '通用设备', '文物和陈列品', '图书、档案'];
+	// var getvalue = [34.2, 38.87, 17.88, 9.05, 2.05];
+	// var data = [];
+	// for (var i = 0; i < getname.length; i++) {
+	//   data.push({ name: getname[i], value: getvalue[i] });
+	// }
+	const colorList = ['#51A3FC', '#36C78B', '#FEC279', '#968AF5', '#E790E8'];
+	const option = {
+		backgroundColor: state.charts.bgColor,
+		title: {
+			text: 'Disaster Type Proportion',
+			x: 'left',
+			textStyle: { fontSize: '15', color: state.charts.color },
+		},
+		tooltip: { trigger: 'item', formatter: '{b} <br/> {c}%' },
+		graphic: {
+			elements: [
+				{
+					type: 'image',
+					z: -1,
+					style: {
+						image: themeConfig.value.isIsDark,
 
-
-            width: 230,
-            height: 230,
-          },
-          left: '16.5%',
-          top: 'center',
-        },
-      ],
-    },
-    series: [
-      {
-        type: 'pie',
-        radius: ['82', themeConfig.value.isIsDark ? '50' : '102'],
-        center: ['50%', '50%'],
-        label: { show: true },
-        labelLine: { show: true },
-        data: data,
-      },
-    ],
-  };
-  state.global.homeChartFour.setOption(option);
-  state.myCharts.push(state.global.homeChartFour);
+						width: 230,
+						height: 230,
+					},
+					left: '16.5%',
+					top: 'center',
+				},
+			],
+		},
+		series: [
+			{
+				type: 'pie',
+				radius: ['82', themeConfig.value.isIsDark ? '50' : '102'],
+				center: ['50%', '50%'],
+				label: { show: true },
+				labelLine: { show: true },
+				data: data,
+			},
+		],
+	};
+	state.global.homeChartFour.setOption(option);
+	state.myCharts.push(state.global.homeChartFour);
 };
 // 批量设置 echarts resize
 const initEchartsResizeFun = () => {
-  nextTick(() => {
-    for (let i = 0; i < state.myCharts.length; i++) {
-      setTimeout(() => {
-        state.myCharts[i].resize();
-      }, i * 1000);
-    }
-  });
+	nextTick(() => {
+		for (let i = 0; i < state.myCharts.length; i++) {
+			setTimeout(() => {
+				state.myCharts[i].resize();
+			}, i * 1000);
+		}
+	});
 };
 /**
  * 设置表头
  * @param data
  */
 const setHeadData = (data) => {
-  state.homeOne[0].num1 = data.applyCount
-  state.homeOne[1].num1 = data.actResponseNum
-  state.homeOne[2].num1 = data.visitCount
-  state.homeOne[3].num1 = data.downloadCount
-}
+	state.homeOne[0].num1 = data.applyCount;
+	state.homeOne[1].num1 = data.actResponseNum;
+	state.homeOne[2].num1 = data.visitCount;
+	state.homeOne[3].num1 = data.downloadCount;
+};
 /**
  * 设置响应量和发起量
  *  @param data
  */
-const setLineChart = (data) => {
-  let xData = [];
-  //let yData = [];
-  let data1 = [];//initiate
-  let data2 = [];//response
-  data.forEach(item=>{
-    xData.push(item.key)
-    data1.push(item.initiate)
-    data2.push(item.response)
-  })
-  // 响应量和发起量
-  initLineChart(xData,data1,data2);
-}
+// const setLineChart = (data) => {
+// 	let xData = [];
+// 	//let yData = [];
+// 	let data1 = []; //initiate
+// 	let data2 = []; //response
+// 	data.forEach((item) => {
+// 		xData.push(item.key);
+// 		data1.push(item.initiate);
+// 		// data2.push(item.response);
+// 	});
+// 	// 响应量和发起量
+// 	initLineChart(xData, data1, data2);
+// };
 /**
  * 设置访问量 和下载次数
  *  @param data
  */
- const setLineVandDChart = (data) => {
-  let xData = [];
-  let data1 = [];
-  let data2 = [];
-  data.forEach(item=>{
-    xData.push(item.key)
-    data1.push(item.response)
-    data2.push(item.initiate)
-  })
-  //访问量 和下载次数
-  initLineVandDChart(xData,data1, data2)
-}
+const setLineVandDChart = (data) => {
+	let xData = [];
+	let data1 = [];
+	let data2 = [];
+	data.forEach((item) => {
+		xData.push(item.key);
+		data1.push(item.response);
+		data2.push(item.initiate);
+	});
+	//访问量 和下载次数
+	initLineVandDChart(xData, data1, data2);
+};
+
+const setDisasterInfoType = (data) => {
+	let xData = [];
+	let data1 = [];
+	let data2 = [];
+	let data3 = [];
+	let data4 = [];
+	let data5 = [];
+	let data6 = [];
+	let data7 = [];
+	let data8 = [];
+	data.forEach((item) => {
+		xData.push(item.key);
+		data1.push(item.Earthquake);
+		data2.push(item.Volcano);
+		data3.push(item.Landslide);
+		data4.push(item.Flood);
+		data5.push(item.Hurricane);
+		data6.push(item.Drought);
+		data7.push(item.Emergency);
+	});
+	state.dataList.forEach((item) => {
+		data8.push(item.initiate);
+	});
+
+	//访问量 和下载次数
+	initTypeChart(xData, data1, data2, data3, data4, data5, data6, data7,data8);
+};
+
 /**
  * 管理员管理量
  *  @param data
  */
 const setAdministratorsChart = (data) => {
-  let xData = [];
-  let yData = [];
-  data.forEach(item=>{
-    xData.push(item.name)
-    yData.push(item.val)
-  })
-  // if (yData) {
-  //   xData.push('');
-  //   yData.push(0);
-  // }
-  initAdministratorsChart(xData,yData);
-}
+	let xData = [];
+	let yData = [];
+	data.forEach((item) => {
+		xData.push(item.name);
+		yData.push(item.val);
+	});
+	// if (yData) {
+	//   xData.push('');
+	//   yData.push(0);
+	// }
+	initAdministratorsChart(xData, yData);
+};
 /**
  * 管理员管理量
  *  @param data
  */
- const setChiefChart = (data) => {
-  let xData = [];
-  let yData = [];
-  data.forEach(item=>{
-    xData.push(item.name)
-    yData.push(item.val)
-  })
-  if (yData) {
-    yData.push(0)
-  }
-  initChiefChart(xData,yData);
-}
+const setChiefChart = (data) => {
+	let xData = [];
+	let yData = [];
+	data.forEach((item) => {
+		xData.push(item.name);
+		yData.push(item.val);
+	});
+	if (yData) {
+		yData.push(0);
+	}
+	initChiefChart(xData, yData);
+};
 /**
  * 设置灾种数量占比
  * @param data
  */
 const setDisasterType = (data) => {
-  let arr = [];
-  data.forEach(item=>{
-    arr.push({ name: item.name, value: item.val});
-  })
-  // for(let [k , v] of Object.entries(data)){
-  //   arr.push({ name: k, value: v});
-    
-  // }
-  state.typeTable = arr
-  initPieChart2(arr)
-}
+	let arr = [];
+	data.forEach((item) => {
+		arr.push({ name: item.name, value: item.val });
+	});
+	// for(let [k , v] of Object.entries(data)){
+	//   arr.push({ name: k, value: v});
+
+	// }
+	state.typeTable = arr;
+	initPieChart2(arr);
+};
 
 /**
  * 设置发生区域灾害占比  Proportion of Disaster Occurred Areas TOP15
  * @param data
  */
- const setDisasterArea = (data) => {
-  let arr = [];
-  for(let [k , v] of Object.entries(data)){
-    arr.push({ name: k, value: v});
-  }
-  state.countryTable = arr
-  initPieChart(arr);
-}
+const setDisasterArea = (data) => {
+	let arr = [];
+	for (let [k, v] of Object.entries(data)) {
+		arr.push({ name: k, value: v });
+	}
+	state.countryTable = arr;
+	initPieChart(arr);
+};
 //获取控制台数据
 const getDashBoradData = () => {
-  state.param.year = state.year.getFullYear()
-  statistics(state.param.year).then(res=>{
-    //第一栏
-    setHeadData(res.header);
-    //第二栏
-    setLineChart(res.line)
-    setLineVandDChart(res.vandd);
-    //第三栏
-    setAdministratorsChart(res.admin)
-    setChiefChart(res.chief)
-    //第四栏
-    setDisasterType(res.disasterNum);
-    //第5栏
-    setDisasterArea(res.country);
-  })
-}
+	state.param.year = state.year.getFullYear();
+	statistics(state.param.year).then((res) => {
+		//第一栏
+		setHeadData(res.header);
+		//第二栏
+		// setLineChart(res.line);
+		state.dataList = res.line;
+		setLineVandDChart(res.vandd);
+		//第三栏
+		setAdministratorsChart(res.admin);
+		setChiefChart(res.chief);
+		//第四栏
+		setDisasterType(res.disasterNum);
+		//第5栏
+		setDisasterArea(res.country);
+        setDisasterInfoType(res.type);
+
+
+	});
+};
 // 批量设置 echarts resize
 const initEchartsResize = () => {
-  window.addEventListener('resize', initEchartsResizeFun);
+	window.addEventListener('resize', initEchartsResizeFun);
 };
 // 页面加载时
 onMounted(() => {
-  initEchartsResize();
-  getDashBoradData();
+	initEchartsResize();
+	getDashBoradData();
 });
 // 由于页面缓存原因，keep-alive
 onActivated(() => {
-  initEchartsResizeFun();
+	initEchartsResizeFun();
 });
 // 监听 pinia 中的 tagsview 开启全屏变化，重新 resize 图表，防止不出现/大小不变等
 watch(
-  () => isTagsViewCurrenFull.value,
-  () => {
-    initEchartsResizeFun();
-  }
+	() => isTagsViewCurrenFull.value,
+	() => {
+		initEchartsResizeFun();
+	}
 );
 // 监听 pinia 中是否开启深色主题
 watch(
-  () => themeConfig.value.isIsDark,
-  (isIsDark) => {
-    nextTick(() => {
-      state.charts.theme = isIsDark ? 'dark' : '';
-      state.charts.bgColor = isIsDark ? 'transparent' : '';
-      state.charts.color = isIsDark ? '#dadada' : '#303133';
-      // setTimeout(() => {
-      //   //initLineChart();
-      // }, 500);
-      // setTimeout(() => {
-      //   //initPieChart();
-      // }, 700);
-      // setTimeout(() => {
-      //   //initPieChart2();
-      // }, 700);
-      // setTimeout(() => {
-      //   initBarChart();
-      // }, 1000);
-    });
-  },
-  {
-    deep: true,
-    immediate: true,
-  }
+	() => themeConfig.value.isIsDark,
+	(isIsDark) => {
+		nextTick(() => {
+			state.charts.theme = isIsDark ? 'dark' : '';
+			state.charts.bgColor = isIsDark ? 'transparent' : '';
+			state.charts.color = isIsDark ? '#dadada' : '#303133';
+			// setTimeout(() => {
+			//   //initLineChart();
+			// }, 500);
+			// setTimeout(() => {
+			//   //initPieChart();
+			// }, 700);
+			// setTimeout(() => {
+			//   //initPieChart2();
+			// }, 700);
+			// setTimeout(() => {
+			//   initBarChart();
+			// }, 1000);
+		});
+	},
+	{
+		deep: true,
+		immediate: true,
+	}
 );
 </script>
 
@@ -759,9 +827,9 @@ $homeNavLengh: 8;
 	overflow: hidden;
 	.home-card-one,
 	.home-card-two,
-	.home-card-three ,
+	.home-card-three,
 	.home-card-four,
-	.home-card-five{
+	.home-card-five {
 		.home-card-item {
 			width: 100%;
 			height: 130px;
@@ -804,7 +872,7 @@ $homeNavLengh: 8;
 		}
 	}
 	.home-card-two,
-	.home-card-three ,
+	.home-card-three,
 	.home-card-four,
 	.home-card-five {
 		.home-card-item {
diff --git a/src/views/responseManagement/userResponse/index.vue b/src/views/responseManagement/userResponse/index.vue
index 20e4c89..b8c66ce 100644
--- a/src/views/responseManagement/userResponse/index.vue
+++ b/src/views/responseManagement/userResponse/index.vue
@@ -1,986 +1,824 @@
 <template>
-  <div class="system-role-container layout-padding">
-    <el-config-provider :locale="en"
-                        style="position: relative;">
-      <div class="system-role-padding layout-padding-auto layout-padding-view">
-        <el-tabs v-model="activeName"
-                 class="demo-tabs"
-                 @tab-click="handleClick"
-                 style="margin-left: 20px">
-          <el-tab-pane label="Pending"
-                       name="first">
-            <el-table :data="state.tableData.data"
-                      v-loading="state.tableData.loading"
-                      style="width: 100%">
-              <el-table-column prop="username"
-                               label="User Name"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="organization"
-                               label="Organization"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="disasterType"
-                               label="Disaster Type"
-                               show-overflow-tooltip
-                               sortable>
-                <!-- 在disasterType中获取dictKey 对应的dictValue -->
-                <template #default="scope">
-                  <el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
-                </template>
-              </el-table-column>
-              <el-table-column prop="disasterKeyword"
-                               label="Disaster Keyword"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="disasterTime"
-                               label="Disaster Time"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <!-- 格式化去除时分秒 -->
-                  {{ dateFormat(scope.row.disasterTime) }}
-                </template>
-              </el-table-column>
-              <el-table-column prop="uploadTime"
-                               label="Initiated Time"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="respondStatus"
-                               label="Response Status"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <el-tag type="info"
-                          v-if="scope.row.respondStatus === 0">Awaiting approval</el-tag>
-                  <el-tag type="info"
-                          v-if="scope.row.respondStatus === 1">Rejected</el-tag>
-                </template>
-              </el-table-column>
-              <el-table-column prop="Operate"
-                               label="Operate"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <el-button size="small"
-                             text
-                             type="primary"
-                             @click="onOpenEditRole('edit', scope.row)">Approve</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-            <el-pagination @size-change="onHandleSizeChange"
-                           @current-change="onHandleCurrentChange"
-                           class="mt15"
-                           :pager-count="5"
-                           :page-sizes="[10, 20, 30]"
-                           v-model:current-page="state.tableData.param.current"
-                           background
-                           v-model:page-size="state.tableData.param.size"
-                           layout="total, sizes, prev, pager, next, jumper"
-                           :total="state.tableData.total">
-            </el-pagination>
-          </el-tab-pane>
+	<div class="system-role-container layout-padding">
+		<el-config-provider :locale="en" style="position: relative">
+			<div class="system-role-padding layout-padding-auto layout-padding-view">
+				<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick" style="margin-left: 20px">
+					<el-tab-pane label="Pending" name="first">
+						<el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
+							<el-table-column prop="username" label="User Name" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="organization" label="Organization" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="disasterType" label="Disaster Type" show-overflow-tooltip sortable>
+								<!-- 在disasterType中获取dictKey 对应的dictValue -->
+								<template #default="scope">
+									<el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
+								</template>
+							</el-table-column>
+							<el-table-column prop="disasterKeyword" label="Disaster Keyword" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="disasterTime" label="Disaster Time" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<!-- 格式化去除时分秒 -->
+									{{ dateFormat(scope.row.disasterTime) }}
+								</template>
+							</el-table-column>
+							<el-table-column prop="uploadTime" label="Initiated Time" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="respondStatus" label="Response Status" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<el-tag type="info" v-if="scope.row.respondStatus === 0">Awaiting approval</el-tag>
+									<el-tag type="info" v-if="scope.row.respondStatus === 1">Rejected</el-tag>
+								</template>
+							</el-table-column>
+							<el-table-column prop="Operate" label="Operate" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<el-button size="small" text type="primary" @click="onOpenEditRole('edit', scope.row)">Approve</el-button>
+								</template>
+							</el-table-column>
+						</el-table>
+						<el-pagination
+							@size-change="onHandleSizeChange"
+							@current-change="onHandleCurrentChange"
+							class="mt15"
+							:pager-count="5"
+							:page-sizes="[10, 20, 30]"
+							v-model:current-page="state.tableData.param.current"
+							background
+							v-model:page-size="state.tableData.param.size"
+							layout="total, sizes, prev, pager, next, jumper"
+							:total="state.tableData.total"
+						>
+						</el-pagination>
+					</el-tab-pane>
 
-          <el-tab-pane label="Rejected"
-                       name="firstNew">
-            <el-table :data="state.tableData.data"
-                      v-loading="state.tableData.loading"
-                      style="width: 100%">
-              <el-table-column prop="username"
-                               label="User Name"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="organization"
-                               label="Organization"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="disasterType"
-                               label="Disaster Type"
-                               show-overflow-tooltip
-                               sortable>
-                <!-- 在disasterType中获取dictKey 对应的dictValue -->
-                <template #default="scope">
-                  <el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
-                </template>
-              </el-table-column>
-              <el-table-column prop="disasterKeyword"
-                               label="Disaster Keyword"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="disasterTime"
-                               label="Disaster Time"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <!-- 格式化去除时分秒 -->
-                  {{ dateFormat(scope.row.disasterTime) }}
-                </template>
-              </el-table-column>
-              <el-table-column width="200"
-                               prop="Operate"
-                               label="Operate"
-                               show-overflow-tooltip
-                               sortable
-                               v-auth-role="'admin'">
-                <template #default="scope">
-                  <el-button size="small"
-                             text
-                             type="danger"
-                             @click="remove(scope.row)">Delete</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-            <el-pagination @size-change="onHandleSizeChange"
-                           @current-change="onHandleCurrentChange"
-                           class="mt15"
-                           :pager-count="5"
-                           :page-sizes="[10, 20, 30]"
-                           v-model:current-page="state.tableData.param.current"
-                           background
-                           v-model:page-size="state.tableData.param.size"
-                           layout="total, sizes, prev, pager, next, jumper"
-                           :total="state.tableData.total">
-            </el-pagination>
-          </el-tab-pane>
+					<el-tab-pane label="Rejected" name="firstNew">
+						<el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
+							<el-table-column prop="username" label="User Name" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="organization" label="Organization" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="disasterType" label="Disaster Type" show-overflow-tooltip sortable>
+								<!-- 在disasterType中获取dictKey 对应的dictValue -->
+								<template #default="scope">
+									<el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
+								</template>
+							</el-table-column>
+							<el-table-column prop="disasterKeyword" label="Disaster Keyword" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="disasterTime" label="Disaster Time" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<!-- 格式化去除时分秒 -->
+									{{ dateFormat(scope.row.disasterTime) }}
+								</template>
+							</el-table-column>
+							<el-table-column width="200" prop="Operate" label="Operate" show-overflow-tooltip sortable v-auth-role="'admin'">
+								<template #default="scope">
+									<el-button size="small" text type="danger" @click="remove(scope.row)">Delete</el-button>
+								</template>
+							</el-table-column>
+						</el-table>
+						<el-pagination
+							@size-change="onHandleSizeChange"
+							@current-change="onHandleCurrentChange"
+							class="mt15"
+							:pager-count="5"
+							:page-sizes="[10, 20, 30]"
+							v-model:current-page="state.tableData.param.current"
+							background
+							v-model:page-size="state.tableData.param.size"
+							layout="total, sizes, prev, pager, next, jumper"
+							:total="state.tableData.total"
+						>
+						</el-pagination>
+					</el-tab-pane>
 
-          <el-tab-pane label="Approved"
-                       name="second">
-            <el-table :data="state.tableData.data"
-                      v-loading="state.tableData.loading"
-                      style="width: 100%">
+					<el-tab-pane label="Approved" name="second">
+						<el-form-item label="vordmId"
+							><el-input style="width: 200px;" size="default" placeholder="vordmId" v-model="state.tableData.param.vordmId"> </el-input>
+							<el-button size="default" type="primary" @click="getTableData" style="margin-left: 30px;">
+								<el-icon>
+									<ele-Search />
+								</el-icon>
+								Search
+							</el-button>
+						</el-form-item>
 
-              <el-table-column prop="username"
-                               label="User Name"
-                               show-overflow-tooltip
-                               sortable
-                               width="150"></el-table-column>
-              <el-table-column prop="organization"
-                               label="Organization"
-                               show-overflow-tooltip
-                               sortable
-                               width="160"></el-table-column>
-              <el-table-column prop="email"
-                               label="Email"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="disasterType"
-                               label="Disaster Type"
-                               show-overflow-tooltip
-                               sortable
-                               width="160">
-                <!-- 在disasterType中获取dictKey 对应的dictValue -->
-                <template #default="scope">
-                  <el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
-                </template>
-              </el-table-column>
-              <el-table-column prop="disasterKeyword"
-                               label="Disaster Keyword"
-                               width="190"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="disasterTime"
-                               label="Disaster Time"
-                               show-overflow-tooltip
-                               sortable
-                               width="150">
-                <template #default="scope">
-                  <!-- 格式化去除时分秒 -->
-                  {{ dateFormat(scope.row.disasterTime) }}
-                </template>
-              </el-table-column>
-              <el-table-column prop="chiefName"
-                               label="Answer"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="reviewTime"
-                               label="reviewTime"
-                               show-overflow-tooltip
-                               sortable
-                               width="140" />
-              <el-table-column width="170"
-                               prop="respondStatus"
-                               label="Response Status"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <el-tag type="info"
-                          v-if="scope.row.respondStatus === 2">Approved</el-tag>
-                  <el-tag type="info"
-                          v-if="scope.row.respondStatus === 1">Rejected</el-tag>
-                  <el-tag type="success"
-                          v-if="scope.row.respondStatus === 3">Complete response</el-tag>
-                </template>
-              </el-table-column>
-              <el-table-column width="240"
-                               prop="Operate"
-                               label="Operate"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <el-button size="small"
-                             text
-                             type="primary"
-                             @click="onAllocation(scope.row)">Allocation</el-button>
-                  <el-button size="small"
-                             text
-                             type="danger"
-                             @click="responseEnded(scope.row)">Response ended</el-button>
-                  <el-button size="small"
-                             text
-                             type="danger"
-                             @click="remove(scope.row)"
-                             v-auth-role="'admin'">Delete</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-            <el-pagination @size-change="onHandleSizeChange"
-                           @current-change="onHandleCurrentChange"
-                           class="mt15"
-                           :pager-count="5"
-                           :page-sizes="[10, 20, 30]"
-                           v-model:current-page="state.tableData.param.current"
-                           background
-                           v-model:page-size="state.tableData.param.size"
-                           layout="total, sizes, prev, pager, next, jumper"
-                           :total="state.tableData.total">
-            </el-pagination>
-          </el-tab-pane>
+						<el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
+							<el-table-column prop="vordmId" label="vordmId" show-overflow-tooltip sortable width="150"></el-table-column>
+							<el-table-column prop="username" label="User Name" show-overflow-tooltip sortable width="150"></el-table-column>
+							<el-table-column prop="organization" label="Organization" show-overflow-tooltip sortable width="160"></el-table-column>
+							<el-table-column prop="email" label="Email" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="disasterType" label="Disaster Type" show-overflow-tooltip sortable width="160">
+								<!-- 在disasterType中获取dictKey 对应的dictValue -->
+								<template #default="scope">
+									<el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
+								</template>
+							</el-table-column>
+							<el-table-column prop="disasterKeyword" label="Disaster Keyword" width="190" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="disasterTime" label="Disaster Time" show-overflow-tooltip sortable width="150">
+								<template #default="scope">
+									<!-- 格式化去除时分秒 -->
+									{{ dateFormat(scope.row.disasterTime) }}
+								</template>
+							</el-table-column>
+							<el-table-column prop="chiefName" label="Answer" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="reviewTime" label="reviewTime" show-overflow-tooltip sortable width="140" />
+							<el-table-column width="170" prop="respondStatus" label="Response Status" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<el-tag type="info" v-if="scope.row.respondStatus === 2">Approved</el-tag>
+									<el-tag type="info" v-if="scope.row.respondStatus === 1">Rejected</el-tag>
+									<el-tag type="success" v-if="scope.row.respondStatus === 3">Complete response</el-tag>
+								</template>
+							</el-table-column>
+							<el-table-column width="300" prop="Operate" label="Operate" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<el-button size="small" text v-if="scope.row.chiefName" type="info">Assign</el-button>
+									<el-button size="small" text v-if="!scope.row.chiefName" type="primary" @click="onAllocation(scope.row)">Assign</el-button>
+									<el-button size="small" text v-if="!scope.row.chiefName" type="info">Cancel</el-button>
+									<el-button size="small" text v-if="scope.row.chiefName" type="primary" @click="deleteManage(scope.row)">Cancel</el-button>
+									<el-button size="small" text type="danger" @click="responseEnded(scope.row)">Response ended</el-button>
+									<el-button size="small" text type="danger" @click="remove(scope.row)" v-auth-role="'admin'">Delete</el-button>
+								</template>
+							</el-table-column>
+						</el-table>
+						<el-pagination
+							@size-change="onHandleSizeChange"
+							@current-change="onHandleCurrentChange"
+							class="mt15"
+							:pager-count="5"
+							:page-sizes="[10, 20, 30]"
+							v-model:current-page="state.tableData.param.current"
+							background
+							v-model:page-size="state.tableData.param.size"
+							layout="total, sizes, prev, pager, next, jumper"
+							:total="state.tableData.total"
+						>
+						</el-pagination>
+					</el-tab-pane>
 
-          <el-tab-pane label="End - Apply"
-                       name="firstEndExamine">
-            <el-table :data="state.tableData.data"
-                      v-loading="state.tableData.loading"
-                      style="width: 100%">
-              <el-table-column prop="username"
-                               label="User Name"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="organization"
-                               label="Organization"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="disasterType"
-                               label="Disaster Type"
-                               show-overflow-tooltip
-                               sortable>
-                <!-- 在disasterType中获取dictKey 对应的dictValue -->
-                <template #default="scope">
-                  <el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
-                </template>
-              </el-table-column>
-              <el-table-column prop="disasterKeyword"
-                               label="Disaster Keyword"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="disasterTime"
-                               label="Disaster Time"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <!-- 格式化去除时分秒 -->
-                  {{ dateFormat(scope.row.disasterTime) }}
-                </template>
-              </el-table-column>
-              <el-table-column prop="respondStatus"
-                               label="Response Status"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <el-tag type="info"
-                          v-if="scope.row.respondStatus === 2">Approved</el-tag>
-                </template>
-              </el-table-column>
-              <el-table-column prop="Operate"
-                               label="Operate"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <el-button size="small"
-                             text
-                             type="primary"
-                             @click="ApproveUserEnd(scope.row)">Approve</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-            <el-pagination @size-change="onHandleSizeChange"
-                           @current-change="onHandleCurrentChange"
-                           class="mt15"
-                           :pager-count="5"
-                           :page-sizes="[10, 20, 30]"
-                           v-model:current-page="state.tableData.param.current"
-                           background
-                           v-model:page-size="state.tableData.param.size"
-                           layout="total, sizes, prev, pager, next, jumper"
-                           :total="state.tableData.total">
-            </el-pagination>
-          </el-tab-pane>
+					<el-tab-pane label="End - Apply" name="firstEndExamine">
+            <el-form-item label="vordmId"
+							><el-input style="width: 200px;" size="default" placeholder="vordmId" v-model="state.tableData.param.vordmId"> </el-input>
+							<el-button size="default" type="primary" @click="getTableData" style="margin-left: 30px;">
+								<el-icon>
+									<ele-Search />
+								</el-icon>
+								Search
+							</el-button>
+						</el-form-item>
+						<el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
+							<el-table-column prop="vordmId" label="vordmId" show-overflow-tooltip sortable width="150"></el-table-column>
+							<el-table-column prop="username" label="User Name" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="organization" label="Organization" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="disasterType" label="Disaster Type" show-overflow-tooltip sortable>
+								<!-- 在disasterType中获取dictKey 对应的dictValue -->
+								<template #default="scope">
+									<el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
+								</template>
+							</el-table-column>
+							<el-table-column prop="disasterKeyword" label="Disaster Keyword" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="disasterTime" label="Disaster Time" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<!-- 格式化去除时分秒 -->
+									{{ dateFormat(scope.row.disasterTime) }}
+								</template>
+							</el-table-column>
+							<el-table-column prop="respondStatus" label="Response Status" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<el-tag type="info" v-if="scope.row.respondStatus === 2">Approved</el-tag>
+								</template>
+							</el-table-column>
+							<el-table-column prop="Operate" label="Operate" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<el-button size="small" text type="primary" @click="ApproveUserEndData(2)">agree</el-button>
+									<el-button size="small" text type="primary" @click="ApproveUserEnd(scope.row)">reject</el-button>
+								</template>
+							</el-table-column>
+						</el-table>
+						<el-pagination
+							@size-change="onHandleSizeChange"
+							@current-change="onHandleCurrentChange"
+							class="mt15"
+							:pager-count="5"
+							:page-sizes="[10, 20, 30]"
+							v-model:current-page="state.tableData.param.current"
+							background
+							v-model:page-size="state.tableData.param.size"
+							layout="total, sizes, prev, pager, next, jumper"
+							:total="state.tableData.total"
+						>
+						</el-pagination>
+					</el-tab-pane>
 
-          <el-tab-pane label="Completed"
-                       name="firstNewOne">
-            <el-table :data="state.tableData.data"
-                      v-loading="state.tableData.loading"
-                      style="width: 100%">
-              <el-table-column prop="username"
-                               label="User Name"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="organization"
-                               label="Organization"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="disasterType"
-                               label="Disaster Type"
-                               show-overflow-tooltip
-                               sortable>
-                <!-- 在disasterType中获取dictKey 对应的dictValue -->
-                <template #default="scope">
-                  <el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
-                </template>
-              </el-table-column>
-              <el-table-column prop="disasterKeyword"
-                               label="Disaster Keyword"
-                               show-overflow-tooltip
-                               sortable></el-table-column>
-              <el-table-column prop="disasterTime"
-                               label="Disaster Time"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <!-- 格式化去除时分秒 -->
-                  {{ dateFormat(scope.row.disasterTime) }}
-                </template>
-              </el-table-column>
-              <el-table-column prop="respondedTime"
-                               label="Responded Time"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope">
-                  <!-- 格式化去除时分秒 -->
-                  {{ dateFormat(scope.row.respondedTime) }}
-                </template>
-              </el-table-column>
-              <el-table-column width="200"
-                               prop="Operate"
-                               label="Operate"
-                               show-overflow-tooltip
-                               sortable>
-                <template #default="scope"
-                          v-auth-role="'admin'">
-                  <el-button size="small"
-                             text
-                             type="danger"
-                             @click="remove(scope.row)">Delete</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-            <el-pagination @size-change="onHandleSizeChange"
-                           @current-change="onHandleCurrentChange"
-                           class="mt15"
-                           :pager-count="5"
-                           :page-sizes="[10, 20, 30]"
-                           v-model:current-page="state.tableData.param.current"
-                           background
-                           v-model:page-size="state.tableData.param.size"
-                           layout="total, sizes, prev, pager, next, jumper"
-                           :total="state.tableData.total">
-            </el-pagination>
-          </el-tab-pane>
-        </el-tabs>
-      </div>
-      <el-dialog v-model="state.dialogVisible"
-                 title="Approval"
-                 width="45%">
-        <el-container style="margin-top: -2%;margin-bottom: 2%;">
-          <el-radio v-model="state.radio"
-                    label='1'
-                    @click="mapEvents('1')">Point</el-radio>
-          <el-radio v-model="state.radio"
-                    label='2'
-                    @click="mapEvents('2')">Area</el-radio>
-          <el-radio v-model="state.radio"
-                    label='3'
-                    @click="mapEvents('3')">Edit</el-radio>
-          <el-button type="primary"
-                     style="margin-left: 5%;"
-                     @click="ClearSubmit">Clear</el-button>
-        </el-container>
-        <el-container style="margin-top: 2%;margin-bottom: 2%;"
-                      v-if="state.radio === '1' ? true : false">
-          <span style="line-height: 35px;"> Latitude：</span>
-          <el-input placeholder="wait……"
-                    style="height:35px;margin-right: 1%;"
-                    v-model="state.dislat">
-          </el-input>
-          <span style="line-height: 35px;">Longitude：</span>
-          <el-input placeholder="wait……"
-                    style="height:35px;"
-                    v-model="state.dislon"></el-input>
-        </el-container>
-        <el-container style="margin-top: 2%;margin-bottom: 2%;"
-                      v-if="state.radio === '3' ? true : false">
-          <el-row>
-            <el-col :span="3">
-              <span style="line-height: 35px;"> Latitude：</span>
-            </el-col>
-            <el-col :span="7">
-              <el-input placeholder="wait……"
-                        style="height:35px;margin-right: 1%;"
-                        v-model="state.dislat"
-                        :onchange="manualLat">
-              </el-input>
-            </el-col>
-            <el-col :span="2"></el-col>
-            <el-col :span="3">
-              <span style="line-height: 35px;">Longitude：</span>
-            </el-col>
-            <el-col :span="7">
-              <el-input placeholder="wait……"
-                        style="height:35px;"
-                        v-model="state.dislon"
-                        :onchange="manualLon"></el-input>
-            </el-col>
-          </el-row>
-        </el-container>
-        <MapPage style="height:350px ; width:100% ;margin-bottom: 10px;"
-                 ref="mapRef">
-        </MapPage>
-        <div class="latLon-div"> {{ state.popupLat }} , {{ state.popupLon }} </div>
+					<el-tab-pane label="Completed" name="firstNewOne">
+            <el-form-item label="vordmId"
+							><el-input style="width: 200px;" size="default" placeholder="vordmId" v-model="state.tableData.param.vordmId"> </el-input>
+							<el-button size="default" type="primary" @click="getTableData" style="margin-left: 30px;">
+								<el-icon>
+									<ele-Search />
+								</el-icon>
+								Search
+							</el-button>
+						</el-form-item>
+						<el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
+							<el-table-column prop="vordmId" label="vordmId" show-overflow-tooltip sortable width="150"></el-table-column>
+							<el-table-column prop="username" label="User Name" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="organization" label="Organization" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="disasterType" label="Disaster Type" show-overflow-tooltip sortable>
+								<!-- 在disasterType中获取dictKey 对应的dictValue -->
+								<template #default="scope">
+									<el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
+								</template>
+							</el-table-column>
+							<el-table-column prop="disasterKeyword" label="Disaster Keyword" show-overflow-tooltip sortable></el-table-column>
+							<el-table-column prop="disasterTime" label="Disaster Time" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<!-- 格式化去除时分秒 -->
+									{{ dateFormat(scope.row.disasterTime) }}
+								</template>
+							</el-table-column>
+							<el-table-column prop="respondedTime" label="Responded Time" show-overflow-tooltip sortable>
+								<template #default="scope">
+									<!-- 格式化去除时分秒 -->
+									{{ dateFormat(scope.row.respondedTime) }}
+								</template>
+							</el-table-column>
+							<el-table-column width="200" prop="Operate" label="Operate" show-overflow-tooltip sortable>
+								<template #default="scope" v-auth-role="'admin'">
+									<el-button size="small" text type="danger" @click="remove(scope.row)">Delete</el-button>
+								</template>
+							</el-table-column>
+						</el-table>
+						<el-pagination
+							@size-change="onHandleSizeChange"
+							@current-change="onHandleCurrentChange"
+							class="mt15"
+							:pager-count="5"
+							:page-sizes="[10, 20, 30]"
+							v-model:current-page="state.tableData.param.current"
+							background
+							v-model:page-size="state.tableData.param.size"
+							layout="total, sizes, prev, pager, next, jumper"
+							:total="state.tableData.total"
+						>
+						</el-pagination>
+					</el-tab-pane>
+				</el-tabs>
+			</div>
+			<el-dialog v-model="state.dialogVisible" title="Approval" width="45%">
+				<el-container style="margin-top: -2%; margin-bottom: 2%">
+					<el-radio v-model="state.radio" label="1" @click="mapEvents('1')">Point</el-radio>
+					<el-radio v-model="state.radio" label="2" @click="mapEvents('2')">Area</el-radio>
+					<el-radio v-model="state.radio" label="3" @click="mapEvents('3')">Edit</el-radio>
+					<el-button type="primary" style="margin-left: 5%" @click="ClearSubmit">Clear</el-button>
+				</el-container>
+				<el-container style="margin-top: 2%; margin-bottom: 2%" v-if="state.radio === '1' ? true : false">
+					<span style="line-height: 35px"> Latitude：</span>
+					<el-input placeholder="wait……" style="height: 35px; margin-right: 1%" v-model="state.dislat"> </el-input>
+					<span style="line-height: 35px">Longitude：</span>
+					<el-input placeholder="wait……" style="height: 35px" v-model="state.dislon"></el-input>
+				</el-container>
+				<el-container style="margin-top: 2%; margin-bottom: 2%" v-if="state.radio === '3' ? true : false">
+					<el-row>
+						<el-col :span="3">
+							<span style="line-height: 35px"> Latitude：</span>
+						</el-col>
+						<el-col :span="7">
+							<el-input placeholder="wait……" style="height: 35px; margin-right: 1%" v-model="state.dislat" :onchange="manualLat"> </el-input>
+						</el-col>
+						<el-col :span="2"></el-col>
+						<el-col :span="3">
+							<span style="line-height: 35px">Longitude：</span>
+						</el-col>
+						<el-col :span="7">
+							<el-input placeholder="wait……" style="height: 35px" v-model="state.dislon" :onchange="manualLon"></el-input>
+						</el-col>
+					</el-row>
+				</el-container>
+				<MapPage style="height: 350px; width: 100%; margin-bottom: 10px" ref="mapRef"> </MapPage>
+				<div class="latLon-div">{{ state.popupLat }} , {{ state.popupLon }}</div>
 
-        <el-form :inline="true"
-                 label-width="auto"
-                 :label-position="labelPosition"
-                 :model="formInline"
-                 class="demo-form-inline">
+				<el-form :inline="true" label-width="auto" :label-position="labelPosition" :model="formInline" class="demo-form-inline">
+					<el-form-item label="Disaster Time">
+						<el-date-picker
+							style="width: 200px"
+							v-model="state.edit.disasterTime"
+							type="date"
+							value-format="YYYY-MM-DD"
+							placeholder="Select date and time"
+						/>
+					</el-form-item>
 
-          <el-form-item label="Disaster Time">
-            <el-date-picker style="width: 200px;"
-                            v-model="state.edit.disasterTime"
-                            type="date"
-                            value-format="YYYY-MM-DD"
-                            placeholder="Select date and time" />
-          </el-form-item>
+					<el-form-item label="Disaster Type">
+						<el-select
+							style="width: 200px; height: 40px"
+							class="form-select"
+							size="default"
+							clearable
+							placeholder="Disaster Type"
+							v-model="state.edit.disasterType"
+						>
+							<el-option v-for="(item, index) in state.dictList" :value="item.dictKey" :key="index" :label="item.dictValue" />
+						</el-select>
+					</el-form-item>
 
-          <el-form-item label="Disaster Type">
-            <el-select style="width: 200px; height: 40px;"
-                       class="form-select"
-                       size="default"
-                       clearable
-                       placeholder="Disaster Type"
-                       v-model="state.edit.disasterType">
-              <el-option v-for="(item, index) in state.dictList"
-                         :value="item.dictKey"
-                         :key="index"
-                         :label="item.dictValue" />
-            </el-select>
-          </el-form-item>
+					<el-form-item label="Magnitude">
+						<el-input style="width: 200px" v-model="state.edit.disasterLevel" placeholder="please Magnitude" clearable></el-input>
+					</el-form-item>
 
-          <el-form-item label="Magnitude">
-            <el-input style="width: 200px;"
-                      v-model="state.edit.disasterLevel"
-                      placeholder="please Magnitude"
-                      clearable></el-input>
-          </el-form-item>
+					<el-form-item label="Affected Country">
+						<el-input style="width: 200px" v-model="state.edit.disasterCountry" placeholder="please Affected Country" clearable></el-input>
+					</el-form-item>
 
-          <el-form-item label="Affected Country">
-            <el-input style="width: 200px;"
-                      v-model="state.edit.disasterCountry"
-                      placeholder="please Affected Country"
-                      clearable></el-input>
-          </el-form-item>
+					<el-form-item label="Theme keywords">
+						<el-input style="width: 200px" v-model="state.edit.disasterKeyword" placeholder="please Theme keywords" clearable></el-input>
+					</el-form-item>
+				</el-form>
+				<template #footer>
+					<span class="dialog-footer">
+						<el-button @click="state.dialogVisible = false">Cancel</el-button>
+						<el-button type="danger" @click="reviewRefuse"> Reject </el-button>
+						<el-button type="primary" @click="reviews(2)"> Approve </el-button>
+					</span>
+				</template>
+			</el-dialog>
+			<selectUser ref="select" @callback="getTableData"></selectUser>
+			<el-dialog v-model="state.emailDialogVisible" title="Reason for refusal" width="60%" :before-close="handleClose">
+				<el-form-item label="Subject:">
+					<el-input v-model="state.edit.refuseTitle" placeholder="Please enter the Subject"></el-input>
+				</el-form-item>
+				<!-- <el-form-item label="Content:" > -->
 
-          <el-form-item label="Theme keywords">
-            <el-input style="width: 200px;"
-                      v-model="state.edit.disasterKeyword"
-                      placeholder="please Theme keywords"
-                      clearable></el-input>
-          </el-form-item>
+				<QuillEditor
+					ref="myQuillEditor"
+					theme="snow"
+					v-model:content="state.edit.refuseReason"
+					:options="state.options"
+					placeholder="Please enter the Content"
+					contentType="html"
+					@update:content="setValue()"
+					style="height: 500px"
+				/>
+				<!-- </el-form-item> -->
+				<template #footer>
+					<span class="dialog-footer">
+						<el-button
+							@click="
+								state.emailDialogVisible = false;
+								state.edit.refuseReason = '';
+							"
+							>Cancel</el-button
+						>
+						<el-button
+							type="primary"
+							@click="
+								reviews(1);
+								state.edit.refuseReaso = '';
+							"
+						>
+							Send
+						</el-button>
+					</span>
+				</template>
+			</el-dialog>
 
-        </el-form>
-        <template #footer>
-          <span class="dialog-footer">
-            <el-button @click="state.dialogVisible = false">Cancel</el-button>
-            <el-button type="danger"
-                       @click="reviewRefuse">
-              Reject
-            </el-button>
-            <el-button type="primary"
-                       @click="reviews(2)">
-              Approve
-            </el-button>
-          </span>
-        </template>
-      </el-dialog>
-      <selectUser ref="select" @callback="getTableData"></selectUser>
-      <el-dialog v-model="state.emailDialogVisible" title="Reason for refusal" width="60%" :before-close="handleClose">
-            <el-form-item label="Subject:" >
-                <el-input v-model="state.edit.refuseTitle" placeholder="Please enter the Subject"></el-input>
-            </el-form-item>
-            <!-- <el-form-item label="Content:" > -->
-            
-                <QuillEditor ref="myQuillEditor"
-                    theme="snow"
-                    v-model:content="state.edit.refuseReason"
-                    :options="state.options"
-                    placeholder="Please enter the Content"
-                    contentType="html"
-                    @update:content="setValue()"
-                    style="height:500px ;"
-                />
-            <!-- </el-form-item> -->
-            <template #footer>
-                <span class="dialog-footer">
-                    <el-button @click="state.emailDialogVisible = false;state.edit.refuseReason=''">Cancel</el-button>
-                    <el-button type="primary" @click="reviews(1);state.edit.refuseReaso=''">
-                        Send
-                    </el-button>
-                </span>
-            </template>
-        </el-dialog>
-
-        <el-dialog v-model="state.emailDialogVisibleNew" title="Examine" width="40%">
-            <div style="font-size:20px">
-              Has the response ended and been approved !
-            </div>
-            <template #footer>
-                <span class="dialog-footer">
-                    <el-button @click="state.emailDialogVisibleNew = false;state.edit.refuseReason=''">Cancel</el-button>
-                    <el-button type="primary" @click="ApproveUserEndData(2);">
-                        Pass 
-                    </el-button>
-                    <el-button type="primary" @click="ApproveUserEndData(3);">
-                        Refuse
-                    </el-button>
-                </span>
-            </template>
-        </el-dialog>
-    </el-config-provider>
-  </div>
+			<el-dialog v-model="state.emailDialogVisibleNew" title="reject" width="40%">
+				<div style="font-size: 20px">
+					<el-input v-model="state.reason" placeholder="reason" type="textarea" clearable></el-input>
+				</div>
+				<template #footer>
+					<span class="dialog-footer">
+						<el-button
+							@click="
+								state.emailDialogVisibleNew = false;
+								state.edit.refuseReason = '';
+							"
+							>Cancel</el-button
+						>
+						<el-button type="primary" @click="ApproveUserEndData(3)"> reject </el-button>
+					</span>
+				</template>
+			</el-dialog>
+		</el-config-provider>
+	</div>
 </template>
 
-<script  setup name="userResponse">
-import en from 'element-plus/dist/locale/en.mjs'
-import { reactive, onMounted, ref, nextTick, watchEffect, defineAsyncComponent, h ,toRaw} from 'vue';
+<script setup name="userResponse">
+import en from 'element-plus/dist/locale/en.mjs';
+import { reactive, onMounted, ref, nextTick, watchEffect, defineAsyncComponent, h, toRaw } from 'vue';
 import { ElMessageBox, ElMessage } from 'element-plus';
-import { getList, review, responseEndedDisasterInfo, deleteByIds,examineDisasterInfoEnd } from '/@/api/disasterInfo/index';
-import { getDictionary} from '/@/api/system/dictbiz';
-import { useVariableStore } from '/@/stores/index.ts'
-import { QuillEditor } from '@vueup/vue-quill'
-import '@vueup/vue-quill/dist/vue-quill.snow.css'
+import { getList, review, responseEndedDisasterInfo, deleteByIds, examineDisasterInfoEnd, deleteDisasterInfoManage } from '/@/api/disasterInfo/index';
+import { getDictionary } from '/@/api/system/dictbiz';
+import { useVariableStore } from '/@/stores/index.ts';
+import { QuillEditor } from '@vueup/vue-quill';
+import '@vueup/vue-quill/dist/vue-quill.snow.css';
 //引入地图
 import Map from '/@/components/Map.vue';
 import { useDateFormat } from '@vueuse/shared';
 import selectUser from './component/selectUser.vue';
-import L from "leaflet";
+import L from 'leaflet';
 import '@geoman-io/leaflet-geoman-free';
 import '@geoman-io/leaflet-geoman-free/dist/leaflet-geoman.css';
-import "leaflet/dist/leaflet.css";
-import 'leaflet-draw/dist/leaflet.draw'
-import 'leaflet-draw/dist/leaflet.draw.css'
+import 'leaflet/dist/leaflet.css';
+import 'leaflet-draw/dist/leaflet.draw';
+import 'leaflet-draw/dist/leaflet.draw.css';
 import { map } from 'lodash';
-import * as turf from '@turf/turf'
+import * as turf from '@turf/turf';
 const variableStore = useVariableStore();
 const mapRef = ref();
-const myQuillEditor =ref();
+const myQuillEditor = ref();
 const activeName = ref('first');
 const select = ref();
 const remove = (row) => {
-  let arr = [];
-  arr.push(row.disasterId);
-  //使用英语提示确认删除
-  ElMessageBox.confirm('Are you sure you want to delete it?', 'Prompt', {
-    confirmButtonText: 'Yes',
-    cancelButtonText: 'No',
-    type: 'warning',
-  })
-    .then(() => {
-      deleteByIds(arr).then((da) => {
-        getTableData();
-        ElMessage.success('success');
-      })
-    })
-    .catch(() => { });
+	let arr = [];
+	arr.push(row.disasterId);
+	//使用英语提示确认删除
+	ElMessageBox.confirm('Are you sure you want to delete it?', 'Prompt', {
+		confirmButtonText: 'Yes',
+		cancelButtonText: 'No',
+		type: 'warning',
+	})
+		.then(() => {
+			deleteByIds(arr).then((da) => {
+				getTableData();
+				ElMessage.success('success');
+			});
+		})
+		.catch(() => {});
+};
+
+const deleteManage = (row) => {
+	//使用英语提示确认去掉管理权限
+	ElMessageBox.confirm('Do you want to delete administrator ' + row.chiefName + '  permissions?', 'Prompt', {
+		confirmButtonText: 'Yes',
+		cancelButtonText: 'No',
+		type: 'warning',
+	})
+		.then(() => {
+			deleteDisasterInfoManage(row.disasterId).then((da) => {
+				getTableData();
+				ElMessage.success('success');
+			});
+		})
+		.catch(() => {});
+};
 
-}
 const handleClick = (tab, event) => {
-  state.selectName = tab.props.name;
-  getTableData();
+	state.selectName = tab.props.name;
+	getTableData();
 };
 
 const MapPage = defineAsyncComponent({
-  loader: () => import('/@/components/Map.vue'),
-  delay: 200,
-})
+	loader: () => import('/@/components/Map.vue'),
+	delay: 200,
+});
 
 const onAllocation = (row) => {
-  select.value.openDialog(row)
+	select.value.openDialog(row);
 };
 
-
 const responseEnded = (row) => {
-  ElMessageBox.confirm(`Confirm completion of response?`, 'Prompt', {
-    confirmButtonText: 'Yes',
-    cancelButtonText: 'No',
-    type: 'warning',
-  })
-    .then(() => {
-      responseEndedDisasterInfo(row.disasterId).then((da) => {
-        getTableData();
-        ElMessage.success('success');
-      })
-    })
-    .catch(() => { });
+	ElMessageBox.confirm(`Confirm completion of response?`, 'Prompt', {
+		confirmButtonText: 'Yes',
+		cancelButtonText: 'No',
+		type: 'warning',
+	})
+		.then(() => {
+			responseEndedDisasterInfo(row.disasterId).then((da) => {
+				getTableData();
+				ElMessage.success('success');
+			});
+		})
+		.catch(() => {});
 };
 
-
 const dateFormat = (date) => {
-  return useDateFormat(date, 'YYYY-MM-DD').value;
-}
+	return useDateFormat(date, 'YYYY-MM-DD').value;
+};
 // 定义变量内容
 const roleDialogRef = ref();
 const state = reactive({
-  disasterData:{},
-  //灾害类型字典项
-  dictList: [],
-  dialogVisible: false,
-  emailDialogVisible: false,
-  emailDialogVisibleNew: false,
-  tableData: {
-    data: [],
-    total: 0,
-    loading: false,
-    param: {
-      search: '',
-      current: 1,
-      size: 10,
-      respondStatus: 0,
-    },
-  },
-  disasterTypeList: [],
-  selectName: 'first',
-  edit: {},
-  radio: null,
-  dislat: '',
-  dislon: '',
-  popupLat: null,
-  popupLon: null,
-  wktPoint_Poly: undefined,
-  passLat: false,
-  passLon: false,
-  //富文本配置
-  options: {
-        modules: {
-            toolbar: [
-                ['bold', 'italic', 'underline', 'strike'],
-                [{ 'size': ['small', false, 'large', 'huge'] }],
-                [{ 'font': [] }],
-                [{ 'align': [] }],
-                [{ 'list': 'ordered' }, { 'list': 'bullet' }],
-                [{ 'indent': '-1' }, { 'indent': '+1' }],
-                [{ 'header': 1 }, { 'header': 2 }],
-                ['image'],
-                [{ 'direction': 'rtl' }],
-                [{ 'color': [] }, { 'background': [] }]
-            ]
-        },
-        placeholder: '请输入内容...'
-    },
+	reason: '',
+	disasterData: {},
+	//灾害类型字典项
+	dictList: [],
+	dialogVisible: false,
+	emailDialogVisible: false,
+	emailDialogVisibleNew: false,
+	tableData: {
+		data: [],
+		total: 0,
+		loading: false,
+		param: {
+			search: '',
+			current: 1,
+			size: 10,
+			respondStatus: 0,
+		},
+	},
+	disasterTypeList: [],
+	selectName: 'first',
+	edit: {},
+	radio: null,
+	dislat: '',
+	dislon: '',
+	popupLat: null,
+	popupLon: null,
+	wktPoint_Poly: undefined,
+	passLat: false,
+	passLon: false,
+	//富文本配置
+	options: {
+		modules: {
+			toolbar: [
+				['bold', 'italic', 'underline', 'strike'],
+				[{ size: ['small', false, 'large', 'huge'] }],
+				[{ font: [] }],
+				[{ align: [] }],
+				[{ list: 'ordered' }, { list: 'bullet' }],
+				[{ indent: '-1' }, { indent: '+1' }],
+				[{ header: 1 }, { header: 2 }],
+				['image'],
+				[{ direction: 'rtl' }],
+				[{ color: [] }, { background: [] }],
+			],
+		},
+		placeholder: '请输入内容...',
+	},
 });
 // 初始化表格数据
 const getTableData = () => {
-  state.tableData.loading = true;
-  //根据activeName的值来判断是哪个tab页
-  if (state.selectName === 'first') {
-    state.tableData.param.respondStatus = 0;
-    state.tableData.param.isEndApply = 0;
-  } else if (state.selectName === 'second') {
-    state.tableData.param.respondStatus = 2;
-    state.tableData.param.isEndApply = 0;
-  } else if (state.selectName === 'firstNew') {
-    state.tableData.param.respondStatus = 1;
-    state.tableData.param.isEndApply = 0;
-  } else if (state.selectName === 'firstNewOne') {
-    state.tableData.param.respondStatus = 3;
-    state.tableData.param.isEndApply = 0;
-  } else{
-    state.tableData.param.respondStatus = 2;
-    state.tableData.param.isEndApply = 1;
-  }
-  getList(state.tableData.param).then((res) => {
-    state.tableData.data = res.records;
-    state.tableData.total = res.total;
-    state.tableData.loading = false;
-  });
+	state.tableData.loading = true;
+	//根据activeName的值来判断是哪个tab页
+	if (state.selectName === 'first') {
+		state.tableData.param.respondStatus = 0;
+		state.tableData.param.isEndApply = 0;
+	} else if (state.selectName === 'second') {
+		state.tableData.param.respondStatus = 2;
+		state.tableData.param.isEndApply = 0;
+	} else if (state.selectName === 'firstNew') {
+		state.tableData.param.respondStatus = 1;
+		state.tableData.param.isEndApply = 0;
+	} else if (state.selectName === 'firstNewOne') {
+		state.tableData.param.respondStatus = 3;
+		state.tableData.param.isEndApply = 0;
+	} else {
+		state.tableData.param.respondStatus = 2;
+		state.tableData.param.isEndApply = 1;
+	}
+	getList(state.tableData.param).then((res) => {
+		state.tableData.data = res.records;
+		state.tableData.total = res.total;
+		state.tableData.loading = false;
+	});
 };
 const onHandleSizeChange = (val) => {
-  state.tableData.param.size = val;
-  getTableData();
+	state.tableData.param.size = val;
+	getTableData();
 };
 const onOpenEditRole = (type, row) => {
-  if (state.wktPoint_Poly) {
-    mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
-  }
-  //深拷贝
-  state.edit = JSON.parse(JSON.stringify(row));
-  state.dialogVisible = true;
-  if (row.geometry.indexOf("POINT") != -1) {
-    setTimeout(() => {
-      state.radio = "1"
-      state.dislon = row.geometry.substring(row.geometry.indexOf("(") + 1, row.geometry.lastIndexOf(" "))
-      state.dislat = row.geometry.substring(row.geometry.lastIndexOf(" ") + 1, row.geometry.indexOf(")"))
-      // mapRef.value.mapOperations.removeAll()
-      //赋值地图范围，并且可以修改点或者区域
-      //   if (state.wktPoint_Poly) {
-      //     mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
-      //     console.log('清除');
-      //   }
-      state.wktPoint_Poly = mapRef.value.mapOperations.wktParseToMap(row.geometry)
-      mapEvents('1')
-    }, 100);
-  }
-  else if (row.geometry.indexOf("POLYGON") != -1) {
-    setTimeout(() => {
-      state.radio = "2"
-      // mapRef.value.mapOperations.removeAll()
-      //赋值地图范围，并且可以修改点或者区域
-      //   if (state.wktPoint_Poly) {
-      //     mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
-      //     console.log('清除');
-      //   }
-      //   mapRef.value.mapOperations.removeWktAll()
-      state.wktPoint_Poly = mapRef.value.mapOperations.wktParseToMap(row.geometry)
-      mapEvents('2')
-    }, 100);
-  }
+	if (state.wktPoint_Poly) {
+		mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly);
+	}
+	//深拷贝
+	state.edit = JSON.parse(JSON.stringify(row));
+	state.dialogVisible = true;
+	if (row.geometry.indexOf('POINT') != -1) {
+		setTimeout(() => {
+			state.radio = '1';
+			state.dislon = row.geometry.substring(row.geometry.indexOf('(') + 1, row.geometry.lastIndexOf(' '));
+			state.dislat = row.geometry.substring(row.geometry.lastIndexOf(' ') + 1, row.geometry.indexOf(')'));
+			// mapRef.value.mapOperations.removeAll()
+			//赋值地图范围，并且可以修改点或者区域
+			//   if (state.wktPoint_Poly) {
+			//     mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
+			//     console.log('清除');
+			//   }
+			state.wktPoint_Poly = mapRef.value.mapOperations.wktParseToMap(row.geometry);
+			mapEvents('1');
+		}, 100);
+	} else if (row.geometry.indexOf('POLYGON') != -1) {
+		setTimeout(() => {
+			state.radio = '2';
+			// mapRef.value.mapOperations.removeAll()
+			//赋值地图范围，并且可以修改点或者区域
+			//   if (state.wktPoint_Poly) {
+			//     mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
+			//     console.log('清除');
+			//   }
+			//   mapRef.value.mapOperations.removeWktAll()
+			state.wktPoint_Poly = mapRef.value.mapOperations.wktParseToMap(row.geometry);
+			mapEvents('2');
+		}, 100);
+	}
 };
 const cancelApporval = () => {
-  state.dialogVisible = false;
-  if (state.wktPoint_Poly) {
-    mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
-  }
-}
+	state.dialogVisible = false;
+	if (state.wktPoint_Poly) {
+		mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly);
+	}
+};
 
-const ApproveUserEnd = (row) =>{
-  state.disasterData = row;
-  state.emailDialogVisibleNew = true;
-}
+const ApproveUserEnd = (row) => {
+	state.disasterData = row;
+	state.emailDialogVisibleNew = true;
+};
 
-const ApproveUserEndData = (row) =>{
-  let data = {};
-  data.id =state.disasterData.disasterId;
-  data.email = state.disasterData.email
-  // data.email = "13935964706@163.com"
-  data.isEndApply = row;
-  examineDisasterInfoEnd(data).then(da=>{
-    ElMessage.success('success');
-  })
-  state.emailDialogVisibleNew = false;
-}
+const ApproveUserEndData = (row) => {
+	let data = {};
+	data.id = state.disasterData.disasterId;
+	data.email = state.disasterData.email;
+	if (state.reason) {
+		data.refuseReason = state.reason;
+	}
+	// data.email = "13935964706@163.com"
+	data.isEndApply = row;
+	examineDisasterInfoEnd(data).then((da) => {
+		ElMessage.success('success');
+	});
+	state.emailDialogVisibleNew = false;
+};
 
 //验证纬度
 const manualLat = () => {
-  const latReg = /^(\-|\+)?([0-8]?\d{1}\.\d{0,6}|90\.0{0,6}|[0-8]?\d{1}|90)$/;
-  if (!latReg.test(state.dislat)) {
-    state.passLat = false
-    ElMessage({
-      message: h('p', null, [
-        h('span', null, 'Please enter the correct '),
-        h('span', { style: 'font-size: 15px;font-weight: bold;' }, 'latitude'),
-      ]),
-    })
-  }
-  else {
-    state.passLat = true
-  }
+	const latReg = /^(\-|\+)?([0-8]?\d{1}\.\d{0,6}|90\.0{0,6}|[0-8]?\d{1}|90)$/;
+	if (!latReg.test(state.dislat)) {
+		state.passLat = false;
+		ElMessage({
+			message: h('p', null, [h('span', null, 'Please enter the correct '), h('span', { style: 'font-size: 15px;font-weight: bold;' }, 'latitude')]),
+		});
+	} else {
+		state.passLat = true;
+	}
 
-  if (state.passLat && state.passLon) {
-    mapRef.value.mapOperations.addInteractMarker(state.dislat, state.dislon)
-    const positionParam = {
-      x: state.dislon,
-      y: state.dislat,
-      zoom: 3
-    }
-    mapRef.value.mapOperations.goPosition(positionParam)
-  }
-}
+	if (state.passLat && state.passLon) {
+		mapRef.value.mapOperations.addInteractMarker(state.dislat, state.dislon);
+		const positionParam = {
+			x: state.dislon,
+			y: state.dislat,
+			zoom: 3,
+		};
+		mapRef.value.mapOperations.goPosition(positionParam);
+	}
+};
 
 //验证经度
 const manualLon = () => {
-  const lonReg = /^(\-|\+)?(((\d|[1-9]\d|1[0-7]\d|0{1,3})\.\d{0,6})|(\d|[1-9]\d|1[0-7]\d|0{1,3})|180\.0{0,6}|180)$/;
-  if (!lonReg.test(state.dislon)) {
-    state.passLon = false
-    ElMessage({
-      message: h('p', null, [
-        h('span', null, 'Please enter the correct '),
-        h('span', { style: 'font-size: 15px;font-weight: bold;' }, 'longitude'),
-      ]),
-    })
-  }
-  else {
-    state.passLon = true
-  }
-
-  if (state.passLat && state.passLon) {
-    mapRef.value.mapOperations.addInteractMarker(state.dislat, state.dislon)
-    const positionParam = {
-      x: state.dislon,
-      y: state.dislat,
-      zoom: 3
-    }
-    mapRef.value.mapOperations.goPosition(positionParam)
-  }
-}
+	const lonReg = /^(\-|\+)?(((\d|[1-9]\d|1[0-7]\d|0{1,3})\.\d{0,6})|(\d|[1-9]\d|1[0-7]\d|0{1,3})|180\.0{0,6}|180)$/;
+	if (!lonReg.test(state.dislon)) {
+		state.passLon = false;
+		ElMessage({
+			message: h('p', null, [h('span', null, 'Please enter the correct '), h('span', { style: 'font-size: 15px;font-weight: bold;' }, 'longitude')]),
+		});
+	} else {
+		state.passLon = true;
+	}
 
+	if (state.passLat && state.passLon) {
+		mapRef.value.mapOperations.addInteractMarker(state.dislat, state.dislon);
+		const positionParam = {
+			x: state.dislon,
+			y: state.dislat,
+			zoom: 3,
+		};
+		mapRef.value.mapOperations.goPosition(positionParam);
+	}
+};
 
 const manualCoordinate = () => {
-  //   const disLatLen = state.dislat.length
-  //   const disLonLen = state.dislon.length
-  //   const editLat = state.dislat.substring(0, disLatLen - 2)
-  //   const editLon = state.dislon.substring(0, disLonLen - 2)
-  //     mapRef.value.mapOperations.addInteractMarker(editLat, editLon)
-  mapRef.value.mapOperations.addInteractMarker(state.dislat, state.dislon)
-  const positionParam = {
-    x: state.dislon,
-    y: state.dislat,
-    zoom: 3
-  }
-  mapRef.value.mapOperations.goPosition(positionParam)
-}
+	//   const disLatLen = state.dislat.length
+	//   const disLonLen = state.dislon.length
+	//   const editLat = state.dislat.substring(0, disLatLen - 2)
+	//   const editLon = state.dislon.substring(0, disLonLen - 2)
+	//     mapRef.value.mapOperations.addInteractMarker(editLat, editLon)
+	mapRef.value.mapOperations.addInteractMarker(state.dislat, state.dislon);
+	const positionParam = {
+		x: state.dislon,
+		y: state.dislat,
+		zoom: 3,
+	};
+	mapRef.value.mapOperations.goPosition(positionParam);
+};
 
 const mapEvents = (ev) => {
-  if (ev == '1') {
-    // mapRef.value.mapOperations.clearPolygon()
-    state.popupLat = null
-    state.popupLon = null
-    mapRef.value.mapOperations.off("click", mapClick);
-    mapRef.value.mapOperations.off("mousemove", showLatLon)
-    mapRef.value.mapOperations.clearPolygon()
-    mapRef.value.mapOperations.removeEdit()
-    ev == ''
-  }
-  else if (ev == '2') {
-    mapRef.value.mapOperations.off("click", mapClick);
-    mapRef.value.mapOperations.off("mousemove", showLatLon)
-    mapRef.value.mapOperations.removeEdit()
-    // mapRef.value.mapOperations.drawPolygon()
-    // mapRef.value.mapOperations.drawCreated()
-    ev == ''
-  }
-  else if (ev == '3') {
-    mapRef.value.mapOperations.on("click", mapClick)
-    mapRef.value.mapOperations.on("mousemove", showLatLon)
-    mapRef.value.mapOperations.Edit()
-    ev == ''
-  }
+	if (ev == '1') {
+		// mapRef.value.mapOperations.clearPolygon()
+		state.popupLat = null;
+		state.popupLon = null;
+		mapRef.value.mapOperations.off('click', mapClick);
+		mapRef.value.mapOperations.off('mousemove', showLatLon);
+		mapRef.value.mapOperations.clearPolygon();
+		mapRef.value.mapOperations.removeEdit();
+		ev == '';
+	} else if (ev == '2') {
+		mapRef.value.mapOperations.off('click', mapClick);
+		mapRef.value.mapOperations.off('mousemove', showLatLon);
+		mapRef.value.mapOperations.removeEdit();
+		// mapRef.value.mapOperations.drawPolygon()
+		// mapRef.value.mapOperations.drawCreated()
+		ev == '';
+	} else if (ev == '3') {
+		mapRef.value.mapOperations.on('click', mapClick);
+		mapRef.value.mapOperations.on('mousemove', showLatLon);
+		mapRef.value.mapOperations.Edit();
+		ev == '';
+	}
 };
 const ClearSubmit = () => {
-  state.dislat = ''
-  state.dislon = ''
-  setTimeout(() => {
-    mapRef.value.mapOperations.removeAll()
-    variableStore.wktdata = null
-    variableStore.layerGroupPoint = null;
-    layerGroupPoly = null;
-  }, 100)
-}
+	state.dislat = '';
+	state.dislon = '';
+	setTimeout(() => {
+		mapRef.value.mapOperations.removeAll();
+		variableStore.wktdata = null;
+		variableStore.layerGroupPoint = null;
+		layerGroupPoly = null;
+	}, 100);
+};
 const mapClick = (res) => {
-  //   // mapRef.value.mapOperations.removeLayer( state.wktPoint_Poly )
-  //   mapRef.value.mapOperations.addInteractMarker(res.latlng.lat.toFixed(3), res.latlng.lng.toFixed(3))
-  state.dislat = res.latlng.lat.toFixed(3)
-  state.dislon = res.latlng.lng.toFixed(3)
-  mapRef.value.mapOperations.addInteractMarker(res.latlng.lat.toFixed(3), res.latlng.lng.toFixed(3))
-}
+	//   // mapRef.value.mapOperations.removeLayer( state.wktPoint_Poly )
+	//   mapRef.value.mapOperations.addInteractMarker(res.latlng.lat.toFixed(3), res.latlng.lng.toFixed(3))
+	state.dislat = res.latlng.lat.toFixed(3);
+	state.dislon = res.latlng.lng.toFixed(3);
+	mapRef.value.mapOperations.addInteractMarker(res.latlng.lat.toFixed(3), res.latlng.lng.toFixed(3));
+};
 const setValue = () => {
-    const text = toRaw(myQuillEditor.value).getHTML()
-}
+	const text = toRaw(myQuillEditor.value).getHTML();
+};
 //审批拒绝
 const reviewRefuse = () => {
-  state.emailDialogVisible = true;
-}
+	state.emailDialogVisible = true;
+};
 const reviews = (index) => {
+	//将修改后的地图位置赋值到state.edit.geometry
+	//TODO 修改地图赋值
+	//state.edit.geometry = map.mapOperations.getWkt();
 
-  //将修改后的地图位置赋值到state.edit.geometry
-  //TODO 修改地图赋值
-  //state.edit.geometry = map.mapOperations.getWkt();
+	//判断index的值来判断是审核通过还是不通过
 
-  //判断index的值来判断是审核通过还是不通过
-
-  if (index === 1) {
-    state.edit.respondStatus = 1;
-  } else {
-    state.edit.respondStatus = 2;
-  }
-  state.edit.geometry = variableStore.layerGroupPoint === null ? variableStore.layerGroupPoly : variableStore.layerGroupPoint;
-  //时间格式化
-  state.edit.disasterTime = useDateFormat(state.edit.disasterTime, 'YYYY-MM-DD').value + " 00:00:00";
-  state.edit.id = state.edit.disasterId;
-  review(state.edit).then((res) => {
-    state.dialogVisible = false;
-    getTableData();
-    ElMessage.success('success');
-  });
-}
+	if (index === 1) {
+		state.edit.respondStatus = 1;
+	} else {
+		state.edit.respondStatus = 2;
+	}
+	state.edit.geometry = variableStore.layerGroupPoint === null ? variableStore.layerGroupPoly : variableStore.layerGroupPoint;
+	//时间格式化
+	state.edit.disasterTime = useDateFormat(state.edit.disasterTime, 'YYYY-MM-DD').value + ' 00:00:00';
+	state.edit.id = state.edit.disasterId;
+	review(state.edit).then((res) => {
+		state.dialogVisible = false;
+		getTableData();
+		ElMessage.success('success');
+	});
+};
 // 分页改变
 const onHandleCurrentChange = (val) => {
-  state.tableData.param.pageNum = val;
-  getTableData();
+	state.tableData.param.pageNum = val;
+	getTableData();
 };
 
 // 调整纬度
 const changeLat = (lat) => {
-  if (lat < 0) {
-    lat = String(Math.abs(lat)) + "°S"
-  }
-  else {
-    lat = String(lat) + "°N"
-  }
-  return lat
-}
+	if (lat < 0) {
+		lat = String(Math.abs(lat)) + '°S';
+	} else {
+		lat = String(lat) + '°N';
+	}
+	return lat;
+};
 // 调整经度
 const changeLon = (lon) => {
-  if (lon <= 180 && lon >= 0) {
-    lon = String(Math.abs(lon)) + "°E"
-  }
-  else if (lon > 180 && lon <= 360) {
-    lon = String((360 - lon).toFixed(3)) + "°W"
-  }
-  else if (lon < 0) {
-    let n = Math.floor(lon / 360)
-    lon = (lon - n * 360).toFixed(3)
-    if (lon <= 180 && lon >= 0) {
-      lon = String(Math.abs(lon)) + "°E"
-    }
-    else if (lon > 180 && lon <= 360) {
-      lon = String((360 - lon).toFixed(3)) + "°W"
-    }
-  }
-  else if (lon > 360) {
-    let n = Math.floor(lon / 360)
-    lon = (lon - n * 360).toFixed(3)
-    if (lon <= 180 && lon >= 0) {
-      lon = String(Math.abs(lon)) + "°E"
-    }
-    else if (lon > 180 && lon <= 360) {
-      lon = String((360 - lon).toFixed(3)) + "°W"
-    }
-  }
-  return lon
-}
+	if (lon <= 180 && lon >= 0) {
+		lon = String(Math.abs(lon)) + '°E';
+	} else if (lon > 180 && lon <= 360) {
+		lon = String((360 - lon).toFixed(3)) + '°W';
+	} else if (lon < 0) {
+		let n = Math.floor(lon / 360);
+		lon = (lon - n * 360).toFixed(3);
+		if (lon <= 180 && lon >= 0) {
+			lon = String(Math.abs(lon)) + '°E';
+		} else if (lon > 180 && lon <= 360) {
+			lon = String((360 - lon).toFixed(3)) + '°W';
+		}
+	} else if (lon > 360) {
+		let n = Math.floor(lon / 360);
+		lon = (lon - n * 360).toFixed(3);
+		if (lon <= 180 && lon >= 0) {
+			lon = String(Math.abs(lon)) + '°E';
+		} else if (lon > 180 && lon <= 360) {
+			lon = String((360 - lon).toFixed(3)) + '°W';
+		}
+	}
+	return lon;
+};
 // 展示鼠标指针经纬度
 const showLatLon = (e) => {
-  state.popupLat = changeLat(e.latlng.lat.toFixed(3))
-  state.popupLon = changeLon(e.latlng.lng.toFixed(3))
-}
+	state.popupLat = changeLat(e.latlng.lat.toFixed(3));
+	state.popupLon = changeLon(e.latlng.lng.toFixed(3));
+};
 // 页面加载时
 onMounted(() => {
-  getTableData();
-  getDictionary({ code: 'disaster' }).then((res) => {
-    state.disasterTypeList = res;
-  });
+	getTableData();
+	getDictionary({ code: 'disaster' }).then((res) => {
+		state.disasterTypeList = res;
+	});
 });
 const getValue = (key) => {
-  //返回state.disasterTypeLis 对应的value 
-  return state.disasterTypeList.find((item) => item.dictKey === key)?.dictValue;
+	//返回state.disasterTypeLis 对应的value
+	return state.disasterTypeList.find((item) => item.dictKey === key)?.dictValue;
 };
 </script>
 <style lang="scss">
diff --git a/vite.config.js b/vite.config.js
index f7632fb..1f5762b 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -35,6 +35,12 @@ const viteConfig = defineConfig((mode) => {
 					changeOrigin: true,
 					rewrite: (path) => path.replace(/^\/api/, ''),
 				},
+				'/vordmdoc': {
+					target: 'http://192.168.31.14:9000',
+					ws: false,
+					changeOrigin: true,
+					rewrite: (path) => path.replace(/^\/vordmdoc/, ''),
+				},
 			},
 		},
 		build: {