|
@@ -1,680 +1,494 @@
|
|
|
<script>
|
|
|
-import { getJdjcUnit, getGcjztjUnit } from "@/api/index.js";
|
|
|
-import { area } from "@/api/area";
|
|
|
-import { hzfGjzb, hzfxQhyy, hzfxQhcs } from "@/api/hzfx.js";
|
|
|
-import punishmentMixin from "@/mixin/unit.js";
|
|
|
-import { Math } from "cesium";
|
|
|
-export default {
|
|
|
- name: "BasicInfoModalContent",
|
|
|
- mixins: [punishmentMixin],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- options9: [],
|
|
|
- options: [],
|
|
|
- options1: [],
|
|
|
- options2: [],
|
|
|
- tableData: [],
|
|
|
- tableData1: [],
|
|
|
- tableData2: [],
|
|
|
- unitList: [],
|
|
|
- value: "全市",
|
|
|
- params: {
|
|
|
- pageSize: 10,
|
|
|
- pageNum: 1,
|
|
|
- },
|
|
|
- total: 0,
|
|
|
- search: "",
|
|
|
- showFlag: 1,
|
|
|
- // Unittype: "", // 建筑分类
|
|
|
- // year: "", // 年代
|
|
|
- // hnum: "", //高度
|
|
|
- // management: "", //管理形式
|
|
|
- // subject: "", //管理主体
|
|
|
- // maintenance: "", //维保形式
|
|
|
- // risklevel: "", //风险等级
|
|
|
- };
|
|
|
- },
|
|
|
- props: {
|
|
|
- qy: String,
|
|
|
- idx: Number,
|
|
|
- },
|
|
|
- watch: {
|
|
|
- idx: {
|
|
|
- handler(val) {
|
|
|
- this.showFlag = val;
|
|
|
- },
|
|
|
- immediate: true,
|
|
|
- deep: true,
|
|
|
- },
|
|
|
- qy: {
|
|
|
- handler(val) {
|
|
|
- this.value = val;
|
|
|
- this.funUnitList();
|
|
|
- this.handUnitList();
|
|
|
- },
|
|
|
- immediate: true,
|
|
|
- deep: true,
|
|
|
- },
|
|
|
- },
|
|
|
- methods: {
|
|
|
- rowClickHandler(val) {
|
|
|
- // this.$router.push(`/detail?id=${val.id}`);
|
|
|
- },
|
|
|
- funUnitList() {
|
|
|
- hzfGjzb({
|
|
|
- ...this.params,
|
|
|
- qx: this.qy === "重庆市" ? "" : this.qy,
|
|
|
- }).then((res) => {
|
|
|
- this.options = [res.data];
|
|
|
- // console.log(this.options,'关键指标');
|
|
|
- });
|
|
|
- hzfxQhyy({
|
|
|
- ...this.params,
|
|
|
- qx: this.qy === "重庆市" ? "" : this.qy,
|
|
|
- }).then((res) => {
|
|
|
- this.options1 = [res.data];
|
|
|
- // console.log(this.options1,'火灾分布');
|
|
|
- });
|
|
|
- hzfxQhcs({
|
|
|
- ...this.params,
|
|
|
- qx: this.qy === "重庆市" ? "" : this.qy,
|
|
|
- }).then((res) => {
|
|
|
- this.options2 = [res.data];
|
|
|
- // console.log(this.options2,'起火场所');
|
|
|
- });
|
|
|
- },
|
|
|
- handleSizeChange(val) {
|
|
|
- this.params.pageSize = val;
|
|
|
- this.funUnitList();
|
|
|
- },
|
|
|
- handleCurrentChange(val) {
|
|
|
- this.params.pageNum = val;
|
|
|
- this.funUnitList();
|
|
|
- },
|
|
|
- handUnitList() {
|
|
|
- hzfGjzb({
|
|
|
- ...this.params,
|
|
|
- qy: this.value === "重庆市" ? "" : this.value,
|
|
|
- }).then((res) => {});
|
|
|
- },
|
|
|
- resetForm() {
|
|
|
- this.value = "";
|
|
|
- this.search = "";
|
|
|
- (this.params = {
|
|
|
- pageSize: 10,
|
|
|
- pageNum: 1,
|
|
|
- }),
|
|
|
- this.funUnitList();
|
|
|
- },
|
|
|
- changeList(val) {
|
|
|
- this.showFlag = val;
|
|
|
- this.$emit("callback", val);
|
|
|
- },
|
|
|
- addClass(i) {
|
|
|
- return this.showFlag === i ? "active" : "tab-item";
|
|
|
- },
|
|
|
- },
|
|
|
- filters: {
|
|
|
- percent: function (val) {
|
|
|
- return val < 0 ? -val : val;
|
|
|
- },
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.funUnitList();
|
|
|
- this.handUnitList();
|
|
|
- area({
|
|
|
- pageNum: 1,
|
|
|
- pageSize: 100,
|
|
|
- }).then((res) => {
|
|
|
- console.log(res, "获取区域");
|
|
|
- this.options9 = res.data.rows;
|
|
|
- });
|
|
|
- },
|
|
|
-};
|
|
|
+ import {
|
|
|
+ getJdjcUnit,
|
|
|
+ getGcjztjUnit
|
|
|
+ } from "@/api/index.js";
|
|
|
+ import {
|
|
|
+ area
|
|
|
+ } from "@/api/area";
|
|
|
+ import {
|
|
|
+ hzfGjzb,
|
|
|
+ hzfxQhyy,
|
|
|
+ hzfxQhcs
|
|
|
+ } from "@/api/hzfx.js";
|
|
|
+ import punishmentMixin from "@/mixin/unit.js";
|
|
|
+ import {
|
|
|
+ Math
|
|
|
+ } from "cesium";
|
|
|
+ export default {
|
|
|
+ name: "BasicInfoModalContent",
|
|
|
+ mixins: [punishmentMixin],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ options9: [],
|
|
|
+ options: [],
|
|
|
+ options1: [],
|
|
|
+ options2: [],
|
|
|
+ tableData: [],
|
|
|
+ tableData1: [],
|
|
|
+ tableData2: [],
|
|
|
+ unitList: [],
|
|
|
+ value: "全市",
|
|
|
+ params: {
|
|
|
+ pageSize: 10,
|
|
|
+ pageNum: 1,
|
|
|
+ },
|
|
|
+ total: 0,
|
|
|
+ search: "",
|
|
|
+ showFlag: 1,
|
|
|
+ // Unittype: "", // 建筑分类
|
|
|
+ // year: "", // 年代
|
|
|
+ // hnum: "", //高度
|
|
|
+ // management: "", //管理形式
|
|
|
+ // subject: "", //管理主体
|
|
|
+ // maintenance: "", //维保形式
|
|
|
+ // risklevel: "", //风险等级
|
|
|
+ };
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ qy: String,
|
|
|
+ idx: Number,
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ idx: {
|
|
|
+ handler(val) {
|
|
|
+ this.showFlag = val;
|
|
|
+ },
|
|
|
+ immediate: true,
|
|
|
+ deep: true,
|
|
|
+ },
|
|
|
+ qy: {
|
|
|
+ handler(val) {
|
|
|
+ this.value = val;
|
|
|
+ this.funUnitList();
|
|
|
+ this.handUnitList();
|
|
|
+ },
|
|
|
+ immediate: true,
|
|
|
+ deep: true,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ rowClickHandler(val) {
|
|
|
+ // this.$router.push(`/detail?id=${val.id}`);
|
|
|
+ },
|
|
|
+ funUnitList() {
|
|
|
+ hzfGjzb({
|
|
|
+ ...this.params,
|
|
|
+ qx: this.qy === "重庆市" ? "" : this.qy,
|
|
|
+ }).then((res) => {
|
|
|
+ this.options = [res.data];
|
|
|
+ // console.log(this.options,'关键指标');
|
|
|
+ });
|
|
|
+ hzfxQhyy({
|
|
|
+ ...this.params,
|
|
|
+ qx: this.qy === "重庆市" ? "" : this.qy,
|
|
|
+ }).then((res) => {
|
|
|
+ this.options1 = [res.data];
|
|
|
+ // console.log(this.options1,'火灾分布');
|
|
|
+ });
|
|
|
+ hzfxQhcs({
|
|
|
+ ...this.params,
|
|
|
+ qx: this.qy === "重庆市" ? "" : this.qy,
|
|
|
+ }).then((res) => {
|
|
|
+ this.options2 = [res.data];
|
|
|
+ // console.log(this.options2,'起火场所');
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleSizeChange(val) {
|
|
|
+ this.params.pageSize = val;
|
|
|
+ this.funUnitList();
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.params.pageNum = val;
|
|
|
+ this.funUnitList();
|
|
|
+ },
|
|
|
+ handUnitList() {
|
|
|
+ hzfGjzb({
|
|
|
+ ...this.params,
|
|
|
+ qy: this.value === "重庆市" ? "" : this.value,
|
|
|
+ }).then((res) => {});
|
|
|
+ },
|
|
|
+ resetForm() {
|
|
|
+ this.value = "";
|
|
|
+ this.search = "";
|
|
|
+ (this.params = {
|
|
|
+ pageSize: 10,
|
|
|
+ pageNum: 1,
|
|
|
+ }),
|
|
|
+ this.funUnitList();
|
|
|
+ },
|
|
|
+ changeList(val) {
|
|
|
+ this.showFlag = val;
|
|
|
+ this.$emit("callback", val);
|
|
|
+ },
|
|
|
+ addClass(i) {
|
|
|
+ return this.showFlag === i ? "active" : "tab-item";
|
|
|
+ },
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ percent: function(val) {
|
|
|
+ return val < 0 ? -val : val;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.funUnitList();
|
|
|
+ this.handUnitList();
|
|
|
+ area({
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 100,
|
|
|
+ }).then((res) => {
|
|
|
+ console.log(res, "获取区域");
|
|
|
+ this.options9 = res.data.rows;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ };
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
- <div>
|
|
|
- <!-- 搜索 -->
|
|
|
- <div class="maintenance-supervision">
|
|
|
- <div class="tab">
|
|
|
- <span class="tab-item" @click="changeList(1)" :class="addClass(1)"
|
|
|
- >关键指标</span
|
|
|
- >
|
|
|
- <span class="tab-item" @click="changeList(2)" :class="addClass(2)"
|
|
|
- >起火原因</span
|
|
|
- >
|
|
|
- <span class="tab-item" @click="changeList(3)" :class="addClass(3)"
|
|
|
- >起火场所</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- <div class="maintenance-supervision_header">
|
|
|
- <div class="select-item">
|
|
|
- <el-select v-model="value" placeholder="请选择">
|
|
|
- <el-option
|
|
|
- :value="item.areaTitle"
|
|
|
- :label="item.areaTitle"
|
|
|
- v-for="(item, index) in options9"
|
|
|
- :key="index"
|
|
|
- >
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="btn-item">
|
|
|
- <el-button @click="funUnitList">搜索</el-button>
|
|
|
- <el-button @click="resetForm">重置</el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div v-if="showFlag === 1">
|
|
|
- <basic-table
|
|
|
- :data="options"
|
|
|
- @row-click="rowClickHandler"
|
|
|
- style="text-align: center"
|
|
|
- >
|
|
|
- <el-table-column type="index" label="序号"> </el-table-column>
|
|
|
- <el-table-column prop="qx" label="区县" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="hzzs"
|
|
|
- label="火灾总数(起)"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="同比(%)" show-overflow-tooltip>
|
|
|
- <template slot-scope="scope">
|
|
|
- <img
|
|
|
- style="display: inline-block; width: 10px; height: 10px;"
|
|
|
- v-if="scope.row.wrstb > 0"
|
|
|
- src="../../../assets/images/Vector (1).png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- <img
|
|
|
- v-if="scope.row.wrstb < 0"
|
|
|
- src="../../../assets/images/Vector (2).png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- <span>{{ scope.row.wrstb | percent }}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="wrs" label="亡人(人)" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="ssstb" label="同比(%)" show-overflow-tooltip>
|
|
|
- <template slot-scope="scope">
|
|
|
- <img
|
|
|
- v-if="scope.row.ssstb > 0"
|
|
|
- src="../../../assets/images/Vector (1).png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- <img
|
|
|
- v-if="scope.row.ssstb < 0"
|
|
|
- src="../../../assets/images/Vector (2).png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- <span>{{ scope.row.ssstb | percent }}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="sss" label="伤人(人)" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="xxdz" label="同比(%)" show-overflow-tooltip>
|
|
|
- <template slot-scope="scope">
|
|
|
- <img
|
|
|
- style="display: inline-block; width: 10px; height: 10px;"
|
|
|
- v-if="scope.row.xxdz > 0"
|
|
|
- src="../../../assets/images/Vector (1).png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- <img
|
|
|
- v-if="scope.row.xxdz < 0"
|
|
|
- src="../../../assets/images/Vector (2).png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- <span>{{ scope.row.xxdz | percent }}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="zjccss"
|
|
|
- label="直接经济损失(万元)"
|
|
|
- width="250px"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="zjccsstb"
|
|
|
- label="同比(%)"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <img
|
|
|
- style="display: inline-block; width: 10px; height: 10px;"
|
|
|
- v-if="scope.row.zjccsstb > 0"
|
|
|
- src="../../../assets/images/Vector (1).png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- <img
|
|
|
- v-if="scope.row.zjccsstb < 0"
|
|
|
- src="../../../assets/images/Vector (2).png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- <span>{{ scope.row.zjccsstb | percent }}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </basic-table>
|
|
|
- </div>
|
|
|
- <div v-if="showFlag === 2">
|
|
|
- <basic-table
|
|
|
- :data="options1"
|
|
|
- @row-click="rowClickHandler"
|
|
|
- style="text-align: center"
|
|
|
- >
|
|
|
- <el-table-column type="index" label="序号"> </el-table-column>
|
|
|
- <el-table-column prop="qx" label="区县" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="dqhz"
|
|
|
- label="电气火灾(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="fh"
|
|
|
- label="放火(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="jd"
|
|
|
- label="静电(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="lj"
|
|
|
- label="雷击(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="rfyhbz"
|
|
|
- label="燃放烟花爆竹(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="sczy"
|
|
|
- label="生产作业(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="wh"
|
|
|
- label="玩火(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="xy"
|
|
|
- label="吸烟(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="ylhz"
|
|
|
- label="遗留火种(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="yhbs"
|
|
|
- label="用火不慎(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="zr"
|
|
|
- label="自燃(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="bpcyy"
|
|
|
- label="不排除原因(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="xxdz"
|
|
|
- label="其他(起)"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- </basic-table>
|
|
|
- </div>
|
|
|
- <div v-if="showFlag === 3">
|
|
|
- <basic-table
|
|
|
- :data="options2"
|
|
|
- @row-click="rowClickHandler"
|
|
|
- style="text-align: center"
|
|
|
- >
|
|
|
- <el-table-column type="index" label="序号"> </el-table-column>
|
|
|
- <el-table-column prop="qx" label="区县" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="bgsc" label="办公场所" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="gcjzmc"
|
|
|
- label="宾馆、饭店、招待所"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="cf" label="厂房" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="cy"
|
|
|
- label="纯餐饮场所"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="fly" label="福利院" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="gd" label="工地" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="ggylcs"
|
|
|
- label="公共娱乐设施"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="gbdszx"
|
|
|
- label="广播电视中心"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="hy"
|
|
|
- label="会议、展览中心"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="jyjq"
|
|
|
- label="加油加气站充电"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="jtsn"
|
|
|
- label="交通枢纽站"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="jrjycs"
|
|
|
- label="金融交易场所"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="jzcs" label="居住场所" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="qck" label="汽车库" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="sy" label="商业场所" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="syhgqy"
|
|
|
- label="石油化工企业"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="snnfycs"
|
|
|
- label="室内农副业场所"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="tycg" label="体育场馆" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="txcs" label="通信场所" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="wbg"
|
|
|
- label="文博馆(图书馆、博物馆、档案馆等)"
|
|
|
- width="250"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="wwgjz"
|
|
|
- label="文物古建筑"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="wzcccs"
|
|
|
- label="物资仓储场所"
|
|
|
- width="150"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="xx" label="学校" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="yly" label="养老院" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="yljg" label="医疗机构" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="zjcs" label="宗教场所" show-overflow-tooltip>
|
|
|
- </el-table-column>
|
|
|
- </basic-table>
|
|
|
- </div>
|
|
|
- <br />
|
|
|
- <basic-pagination
|
|
|
- layout="total,->,prev, pager, next, sizes,jumper"
|
|
|
- :page-sizes="[10, 20, 50, 100]"
|
|
|
- :page-size="params.pageSize"
|
|
|
- :current-page="params.PageNum"
|
|
|
- :total="total"
|
|
|
- @size-change="handleSizeChange"
|
|
|
- @current-change="handleCurrentChange"
|
|
|
- />
|
|
|
- </div>
|
|
|
+ <div>
|
|
|
+ <!-- 搜索 -->
|
|
|
+ <div class="maintenance-supervision">
|
|
|
+ <div class="tab">
|
|
|
+ <span class="tab-item" @click="changeList(1)" :class="addClass(1)">关键指标</span>
|
|
|
+ <span class="tab-item" @click="changeList(2)" :class="addClass(2)">起火原因</span>
|
|
|
+ <span class="tab-item" @click="changeList(3)" :class="addClass(3)">起火场所</span>
|
|
|
+ </div>
|
|
|
+ <div class="maintenance-supervision_header">
|
|
|
+ <div class="select-item">
|
|
|
+ <el-select v-model="value" placeholder="请选择">
|
|
|
+ <el-option :value="item.areaTitle" :label="item.areaTitle" v-for="(item, index) in options9"
|
|
|
+ :key="index">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="btn-item">
|
|
|
+ <el-button @click="funUnitList">搜索</el-button>
|
|
|
+ <el-button @click="resetForm">重置</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="showFlag === 1">
|
|
|
+ <basic-table :data="options" @row-click="rowClickHandler" style="text-align: center">
|
|
|
+ <el-table-column type="index" label="序号"> </el-table-column>
|
|
|
+ <el-table-column prop="qx" label="区县" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="hzqs" label="火灾总数(起)" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="同比(%)" show-overflow-tooltip>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <img style="display: inline-block; width: 10px; height: 10px;" v-if="scope.row.hzqstb > 0"
|
|
|
+ src="../../../assets/images/Vector (1).png" alt="" />
|
|
|
+ <img v-if="scope.row.hzqstb < 0" src="../../../assets/images/Vector (2).png" alt="" />
|
|
|
+ <span>{{ scope.row.hzqstb | percent }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="wrs" label="亡人(人)" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="wrstb" label="同比(%)" show-overflow-tooltip>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <img v-if="scope.row.wrstb > 0" src="../../../assets/images/Vector (1).png" alt="" />
|
|
|
+ <img v-if="scope.row.wrstb < 0" src="../../../assets/images/Vector (2).png" alt="" />
|
|
|
+ <span>{{ scope.row.wrstb | percent }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="sss" label="伤人(人)" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="ssstb" label="同比(%)" show-overflow-tooltip>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <img style="display: inline-block; width: 10px; height: 10px;" v-if="scope.row.ssstb > 0"
|
|
|
+ src="../../../assets/images/Vector (1).png" alt="" />
|
|
|
+ <img v-if="scope.row.ssstb < 0" src="../../../assets/images/Vector (2).png" alt="" />
|
|
|
+ <span>{{ scope.row.ssstb | percent }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="zjccss" label="直接经济损失(万元)" width="250px" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="zjccsstb" label="同比(%)" show-overflow-tooltip>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <img style="display: inline-block; width: 10px; height: 10px;" v-if="scope.row.zjccsstb > 0"
|
|
|
+ src="../../../assets/images/Vector (1).png" alt="" />
|
|
|
+ <img v-if="scope.row.zjccsstb < 0" src="../../../assets/images/Vector (2).png" alt="" />
|
|
|
+ <span>{{ scope.row.zjccsstb | percent }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </basic-table>
|
|
|
+ </div>
|
|
|
+ <div v-if="showFlag === 2">
|
|
|
+ <basic-table :data="options1" @row-click="rowClickHandler" style="text-align: center">
|
|
|
+ <el-table-column type="index" label="序号"> </el-table-column>
|
|
|
+ <el-table-column prop="qx" label="区县" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="dqhz" label="电气火灾(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="fh" label="放火(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="jd" label="静电(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="lj" label="雷击(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="rfyhbz" label="燃放烟花爆竹(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="sczy" label="生产作业(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="wh" label="玩火(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="xy" label="吸烟(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="ylhz" label="遗留火种(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="yhbs" label="用火不慎(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="zr" label="自燃(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="bpcyy" label="不排除原因(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="qt" label="其他(起)" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ </basic-table>
|
|
|
+ </div>
|
|
|
+ <div v-if="showFlag===3">
|
|
|
+ <basic-table :data="options2" @row-click="rowClickHandler" style="text-align: center">
|
|
|
+ <el-table-column type="index" label="序号">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="qx" label="区县" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="bgcs" label="办公场所" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="bg" label="宾馆、饭店、招待所" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="cf" label="厂房" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="cy" label="纯餐饮场所" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="fly" label="福利院" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="gd" label="工地" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="ggylcs" label="公共娱乐设施" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="gbdszx" label="广播电视中心" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="hy" label="会议、展览中心" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="jyjq" label="加油加气站充电" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="jtsn" label="交通枢纽站" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="jrjycs" label="金融交易场所" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="jzcs" label="居住场所" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="kysycs" label="科研实验场所" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="qt" label="其他" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="qck" label="汽车库" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="sycs" label="商业场所" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="syhgqy" label="石油化工企业" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="snnfycs" label="室内农副业场所" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="tycg" label="体育场馆" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="txcs" label="通信场所" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="wbg" label="文博馆(图书馆、博物馆、档案馆等)" width="250" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="wwgjz" label="文物古建筑" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="wzcccs" label="物资仓储场所" width="150" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="xck" label="修车库" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="xx" label="学校" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="yly" label="养老院" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="yljg" label="医疗机构" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="zjcs" label="宗教场所" show-overflow-tooltip>
|
|
|
+ </el-table-column>
|
|
|
+ </basic-table>
|
|
|
+ </div>
|
|
|
+ <br />
|
|
|
+ <basic-pagination layout="total,->,prev, pager, next, sizes,jumper" :page-sizes="[10, 20, 50, 100]"
|
|
|
+ :page-size="params.pageSize" :current-page="params.PageNum" :total="total" @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange" />
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<style scoped lang="less">
|
|
|
-.maintenance-supervision {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
+ .maintenance-supervision {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
|
|
|
- // padding: 10px 10px 0px 20px;
|
|
|
- ::v-deep(.el-input__inner) {
|
|
|
- border: none;
|
|
|
- background: linear-gradient(
|
|
|
- 360deg,
|
|
|
- rgba(0, 148, 255, 0.5) 0%,
|
|
|
- rgba(0, 148, 255, 0.31) 100%
|
|
|
- );
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
+ // padding: 10px 10px 0px 20px;
|
|
|
+ ::v-deep(.el-input__inner) {
|
|
|
+ border: none;
|
|
|
+ background: linear-gradient(360deg,
|
|
|
+ rgba(0, 148, 255, 0.5) 0%,
|
|
|
+ rgba(0, 148, 255, 0.31) 100%);
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
|
|
|
- ::v-deep(.el-button) {
|
|
|
- border: none;
|
|
|
- background: linear-gradient(360deg, #0094ff90 0%, #0094ff10 100%);
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
+ ::v-deep(.el-button) {
|
|
|
+ border: none;
|
|
|
+ background: linear-gradient(360deg, #0094ff90 0%, #0094ff10 100%);
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
|
|
|
- .maintenance-supervision_header {
|
|
|
- display: flex;
|
|
|
- // flex-wrap: wrap;
|
|
|
- justify-content: space-around;
|
|
|
- // border-bottom: 1px solid #154956;
|
|
|
- padding-bottom: 10px;
|
|
|
- font-size: 12px;
|
|
|
- color: rgb(79, 149, 186);
|
|
|
- // .select-item{
|
|
|
- // margin-right: 20px;
|
|
|
- // }
|
|
|
- }
|
|
|
+ .maintenance-supervision_header {
|
|
|
+ display: flex;
|
|
|
+ // flex-wrap: wrap;
|
|
|
+ justify-content: space-around;
|
|
|
+ // border-bottom: 1px solid #154956;
|
|
|
+ padding-bottom: 10px;
|
|
|
+ font-size: 12px;
|
|
|
+ color: rgb(79, 149, 186);
|
|
|
+ // .select-item{
|
|
|
+ // margin-right: 20px;
|
|
|
+ // }
|
|
|
+ }
|
|
|
|
|
|
- .btn-item {
|
|
|
- margin-bottom: 10px;
|
|
|
- }
|
|
|
+ .btn-item {
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
|
|
|
- .warp {
|
|
|
- height: 520px;
|
|
|
- margin: 0 auto;
|
|
|
- overflow: hidden;
|
|
|
+ .warp {
|
|
|
+ height: 520px;
|
|
|
+ margin: 0 auto;
|
|
|
+ overflow: hidden;
|
|
|
|
|
|
- .item {
|
|
|
- list-style: none;
|
|
|
- padding: 0;
|
|
|
- margin: 0 auto;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- }
|
|
|
+ .item {
|
|
|
+ list-style: none;
|
|
|
+ padding: 0;
|
|
|
+ margin: 0 auto;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- /deep/.el-input__inner {
|
|
|
- background-color: #184254;
|
|
|
- width: 150px;
|
|
|
- height: 30px;
|
|
|
- margin-bottom: 5px;
|
|
|
- }
|
|
|
+ /deep/.el-input__inner {
|
|
|
+ background-color: #184254;
|
|
|
+ width: 150px;
|
|
|
+ height: 30px;
|
|
|
+ margin-bottom: 5px;
|
|
|
+ }
|
|
|
|
|
|
- /deep/.el-button {
|
|
|
- width: 100px;
|
|
|
- height: 32px;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 2px;
|
|
|
- // margin: 0 20px 0 30px;
|
|
|
- color: #fff;
|
|
|
- border-radius: 5px;
|
|
|
- border: none;
|
|
|
- margin-left: 20px;
|
|
|
- }
|
|
|
+ /deep/.el-button {
|
|
|
+ width: 100px;
|
|
|
+ height: 32px;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 2px;
|
|
|
+ // margin: 0 20px 0 30px;
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+ border: none;
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
|
|
|
- /deep/.el-button:hover {
|
|
|
- color: rgb(80, 147, 224);
|
|
|
- }
|
|
|
+ /deep/.el-button:hover {
|
|
|
+ color: rgb(80, 147, 224);
|
|
|
+ }
|
|
|
|
|
|
- /deep/.select_btn {
|
|
|
- position: absolute;
|
|
|
- top: 225px;
|
|
|
- right: 320px;
|
|
|
- //下拉框
|
|
|
- }
|
|
|
+ /deep/.select_btn {
|
|
|
+ position: absolute;
|
|
|
+ top: 225px;
|
|
|
+ right: 320px;
|
|
|
+ //下拉框
|
|
|
+ }
|
|
|
|
|
|
- /deep/.el-input {
|
|
|
- width: 150px;
|
|
|
- // margin-left: 20px;
|
|
|
- }
|
|
|
+ /deep/.el-input {
|
|
|
+ width: 150px;
|
|
|
+ // margin-left: 20px;
|
|
|
+ }
|
|
|
|
|
|
- .header {
|
|
|
- color: #fff;
|
|
|
- height: 33px !important;
|
|
|
- line-height: 33px !important;
|
|
|
- background-color: rgba(0, 163, 255, 0.3) !important;
|
|
|
- color: #61dbff;
|
|
|
- margin-top: 15px;
|
|
|
- margin-bottom: 6px;
|
|
|
- }
|
|
|
+ .header {
|
|
|
+ color: #fff;
|
|
|
+ height: 33px !important;
|
|
|
+ line-height: 33px !important;
|
|
|
+ background-color: rgba(0, 163, 255, 0.3) !important;
|
|
|
+ color: #61dbff;
|
|
|
+ margin-top: 15px;
|
|
|
+ margin-bottom: 6px;
|
|
|
+ }
|
|
|
|
|
|
- .row,
|
|
|
- li,
|
|
|
- a {
|
|
|
- display: block;
|
|
|
- height: 39px;
|
|
|
- line-height: 39px;
|
|
|
- margin-bottom: 4px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- font-size: 16px;
|
|
|
- background-color: rgba(0, 0, 0, 0.2);
|
|
|
+ .row,
|
|
|
+ li,
|
|
|
+ a {
|
|
|
+ display: block;
|
|
|
+ height: 39px;
|
|
|
+ line-height: 39px;
|
|
|
+ margin-bottom: 4px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 16px;
|
|
|
+ background-color: rgba(0, 0, 0, 0.2);
|
|
|
|
|
|
- .time,
|
|
|
- .num,
|
|
|
- .person,
|
|
|
- .result {
|
|
|
- flex: 0.33;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
+ .time,
|
|
|
+ .num,
|
|
|
+ .person,
|
|
|
+ .result {
|
|
|
+ flex: 0.33;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
|
|
|
- .num {
|
|
|
- flex: 0.15;
|
|
|
- }
|
|
|
- }
|
|
|
+ .num {
|
|
|
+ flex: 0.15;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .inp {
|
|
|
- margin-left: 20px;
|
|
|
- }
|
|
|
-}
|
|
|
+ .inp {
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
-.unit-bulid {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- margin-bottom: 20px;
|
|
|
- font-size: 18px;
|
|
|
-}
|
|
|
+ .unit-bulid {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
|
|
|
-.unit-num {
|
|
|
- width: 200px;
|
|
|
- height: 109px;
|
|
|
- border: 1px solid #0463a7;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- justify-items: center;
|
|
|
- line-height: 59px;
|
|
|
-}
|
|
|
+ .unit-num {
|
|
|
+ width: 200px;
|
|
|
+ height: 109px;
|
|
|
+ border: 1px solid #0463a7;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-items: center;
|
|
|
+ line-height: 59px;
|
|
|
+ }
|
|
|
|
|
|
-.tab {
|
|
|
- display: flex;
|
|
|
-}
|
|
|
+ .tab {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
|
|
|
-.active {
|
|
|
- background: #0463a7 !important;
|
|
|
-}
|
|
|
+ .active {
|
|
|
+ background: #0463a7 !important;
|
|
|
+ }
|
|
|
|
|
|
-.tab-item {
|
|
|
- display: inline-block;
|
|
|
- width: 120px;
|
|
|
- height: 40px;
|
|
|
- text-align: center;
|
|
|
- line-height: 40px;
|
|
|
- font-size: 16px;
|
|
|
- color: #fff;
|
|
|
- border: 1px solid #fff;
|
|
|
- border-radius: 5px;
|
|
|
- margin-right: 15px;
|
|
|
- margin-bottom: 15px;
|
|
|
-}
|
|
|
-img{
|
|
|
- width: 10px;
|
|
|
- margin-right: 3px;
|
|
|
-}
|
|
|
-</style>
|
|
|
+ .tab-item {
|
|
|
+ display: inline-block;
|
|
|
+ width: 120px;
|
|
|
+ height: 40px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 40px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #fff;
|
|
|
+ border: 1px solid #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin-right: 15px;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ }
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 10px;
|
|
|
+ margin-right: 3px;
|
|
|
+ }
|
|
|
+</style>
|