1606 lines
50 KiB
Vue
1606 lines
50 KiB
Vue
<template>
|
||
<div class="app-container home">
|
||
<!-- 我的履职 -->
|
||
<el-row :gutter="20" style="margin-bottom: 10px;">
|
||
<el-col :sm="24" :lg="24">
|
||
<el-card class="update-log">
|
||
<div slot="header" class="sx">
|
||
<div>我的履职</div>
|
||
<el-date-picker v-model="monthValue" value-format="yyyyMM" format="yyyy年MM月" type="month"
|
||
@change="changeYear" placeholder="选择年月">
|
||
</el-date-picker>
|
||
</div>
|
||
<div class="my-lz">
|
||
<el-col :span="5">
|
||
<div class="name-box">
|
||
<img :src="avatar" class="avatar-img">
|
||
<div class="avatar-box">
|
||
<div class="userName">
|
||
<div>{{ user.nickName }}</div>
|
||
<div v-if="(performUserSet.real_xclz_num + performUserSet.real_bzlz_num)<performUserSet.lz_total">
|
||
履职进行中</div>
|
||
<div v-else>履职完成</div>
|
||
</div>
|
||
<div class="deptName" v-if="user.dept.deptName">{{ user.dept.deptName }} <span
|
||
v-if="user.dept.leader">（{{user.dept.leader }}）</span></div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="3">
|
||
<div class="lvzhi-box">
|
||
<div class="lz-img" style="background-color: #51D351;">
|
||
<img src="@/assets/images/wdlz.svg" alt="dark">
|
||
</div>
|
||
<div class="lz-title-box">
|
||
<div class="lztitle">
|
||
<div>{{ performUserSet.real_xclz_num + performUserSet.real_bzlz_num }}</div>
|
||
<div>{{ performUserSet.xclz_unit_type }}</div>
|
||
</div>
|
||
<div class="lzsubtitle">我的履职</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="3">
|
||
<div class="lvzhi-box">
|
||
<div class="lz-img" style="background-color: #73A0FA;">
|
||
<img src="@/assets/images/xclz.svg" alt="dark">
|
||
</div>
|
||
<div class="lz-title-box">
|
||
<div class="lztitle">
|
||
<div>{{ performUserSet.real_xclz_num }}</div>
|
||
<div>{{ performUserSet.xclz_unit_type }}</div>
|
||
</div>
|
||
<div class="lzsubtitle">现场履职</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="3">
|
||
<div class="lvzhi-box">
|
||
<div class="lz-img" style="background-color: #52C1F5;">
|
||
<img src="@/assets/images/bzlz.svg" alt="dark">
|
||
</div>
|
||
<div class="lz-title-box">
|
||
<div class="lztitle">
|
||
<div>{{ performUserSet.real_bzlz_num }}</div>
|
||
<div>{{ performUserSet.xclz_unit_type }}</div>
|
||
</div>
|
||
<div class="lzsubtitle">班组履职</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="3">
|
||
<div class="lvzhi-box">
|
||
<div class="lz-img" style="background-color: #FB6260;">
|
||
<img src="@/assets/images/fxwt.svg" alt="dark">
|
||
</div>
|
||
<div class="lz-title-box">
|
||
<div class="lztitle">
|
||
<div>{{ performUserSet.problemNum }}</div>
|
||
<div>项</div>
|
||
</div>
|
||
<div class="lzsubtitle">发现问题</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="3">
|
||
<div class="lvzhi-box">
|
||
<div class="lz-img" style="background-color: #FF7A8C;">
|
||
<img src="@/assets/images/qjts.svg" alt="dark">
|
||
</div>
|
||
<div class="lz-title-box">
|
||
<div class="lztitle">
|
||
<div>{{ performUserSet.leaveDaysHistory }}</div>
|
||
<div>天</div>
|
||
</div>
|
||
<div class="lzsubtitle">请假天数</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div class="lzhz-box">
|
||
<div>应履职 {{ performUserSet.lz_total }} {{ performUserSet.xclz_unit_type }}</div>
|
||
<div>现场履职 {{ performUserSet.xclz_num }} {{ performUserSet.xclz_unit_type }}</div>
|
||
<div>班组履职 {{ performUserSet.bzlz_num }} {{ performUserSet.xclz_unit_type }}</div>
|
||
</div>
|
||
|
||
</el-col>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- 履职概览 -->
|
||
<el-row :gutter="20" style="margin-bottom: 10px;">
|
||
<el-col :sm="24" :lg="24">
|
||
<el-card class="update-log">
|
||
<div slot="header" class="clearfix" style="display:flex;justify-content: space-between;">
|
||
<div class="header-title">
|
||
<div></div>
|
||
<div>履职概览</div>
|
||
</div>
|
||
<!-- <div style="width: 95%;text-align: right;">
|
||
<el-radio-group v-model="lzglType" size="small">
|
||
<el-radio-button label="0">全部</el-radio-button>
|
||
<el-radio-button label="1">同级</el-radio-button>
|
||
<el-radio-button label="2">下级</el-radio-button>
|
||
</el-radio-group>
|
||
</div> -->
|
||
</div>
|
||
<div class="lzgl-body">
|
||
<el-col :span="5">
|
||
<div class="lzgl-box">
|
||
<div class="lz-img" style="background-color: #E6E6FF;">
|
||
<img src="@/assets/images/zrs.svg" alt="dark">
|
||
</div>
|
||
<div class="lz-title-box">
|
||
<div class="lzsubtitle">总履职人数</div>
|
||
<div class="lztitle">
|
||
<div>{{lzInfo2.lzrs}}人</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="5">
|
||
<div class="lzgl-box">
|
||
<div class="lz-img" style="background-color: #DBF7E9;">
|
||
<img src="@/assets/images/ywc.svg" alt="dark">
|
||
</div>
|
||
<div class="lz-title-box">
|
||
<div class="lzsubtitle">已完成</div>
|
||
<div class="lztitle">
|
||
<div>{{lzInfo2.wcrs}}人</div>
|
||
</div>
|
||
<div class="lznum" style="color: #00CC99;">{{formatBFb(lzInfo2.wcrsBfb)}}%</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="5">
|
||
<div class="lzgl-box">
|
||
<div class="lz-img" style="background-color: #DBE6FF;">
|
||
<img src="@/assets/images/wwc.svg" alt="dark">
|
||
</div>
|
||
<div class="lz-title-box">
|
||
<div class="lzsubtitle">未完成</div>
|
||
<div class="lztitle">
|
||
<div>{{lzInfo2.wwcrs}}人</div>
|
||
</div>
|
||
<div class="lznum" style="color: #F96A6C;">{{formatBFb(lzInfo2.wwcrsBfb)}}%</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="5">
|
||
<div class="lzgl-box">
|
||
<div class="lz-img" style="background-color: #FFF4E6;">
|
||
<img src="@/assets/images/qj.svg" alt="dark">
|
||
</div>
|
||
<div class="lz-title-box">
|
||
<div class="lzsubtitle">请假</div>
|
||
<div class="lztitle">
|
||
<div>{{lzInfo2.qj}}人</div>
|
||
</div>
|
||
<div class="lznum" style="color: #F96A6C;">天数：{{lzInfo2.qjts}}天</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div class="glhz-box">
|
||
<div class="glhz-title-box">
|
||
<div>履职次数</div>
|
||
<div style="color:#409EFF">{{lzInfo2.lzcs}}</div>
|
||
</div>
|
||
<div class="glhz-title-box">
|
||
<div>无问题数</div>
|
||
<div style="color:#0FD1B6">{{lzInfo2.wwts}}</div>
|
||
</div>
|
||
<div class="glhz-title-box">
|
||
<div>发现问题数</div>
|
||
<div style="color:#F67162">{{lzInfo2.fxwts}}</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- 单位排名&人员排名&领导概况 -->
|
||
<el-row :gutter="20" style="margin-bottom: 10px;">
|
||
<el-col :xs="24" :sm="24" :md="12" :lg="9">
|
||
<el-card class="update-log">
|
||
<div slot="header" class="clearfix">
|
||
<div class="header-title">
|
||
<div></div>
|
||
<div>单位排名</div>
|
||
</div>
|
||
</div>
|
||
<div class="dwpm-body">
|
||
<el-row class="dwpm-title-box">
|
||
<el-col :span="2">
|
||
<div>排名</div>
|
||
</el-col>
|
||
<el-col :span="10">
|
||
<div>分公司</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div>应履职</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div>已履职</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div>履职率</div>
|
||
</el-col>
|
||
</el-row>
|
||
<div v-if="dwpmList.length>0">
|
||
<el-row class="dwpm-subtitle-box" v-for="(item, index) in dwpmList" :key="index">
|
||
<el-col :span="2">
|
||
<div class="dwpm-subtitle-number"
|
||
:style="index == 0 ? 'background-color:rgba(255, 50, 50, 1);' : (index == 1 ? 'background-color:rgba(255, 152, 0, 1);' : (index == 2 ? 'background-color:rgba(255, 210, 0, 1);' : 'background-color:rgba(35, 145, 255, 1);'))">
|
||
{{ (index + 1) }}
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="10">
|
||
<div class="dwpm-subtitle-name">{{ item.postName }}</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div class="dwpm-subtitle-value">{{item.lzNum}}</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div class="dwpm-subtitle-value">{{ item.realLzNum }}</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div class="dwpm-subtitle-value">{{formatBFb(item.lzBfb)}}%</div>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
|
||
<el-row v-else class="dwpm-subtitle-box">
|
||
<el-col :span="24">
|
||
<div class="nodata">暂无数据</div>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
|
||
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
<el-col :xs="24" :sm="24" :md="12" :lg="9">
|
||
<el-card class="update-log">
|
||
<div slot="header" class="clearfix">
|
||
<div class="header-title">
|
||
<div></div>
|
||
<div>人员排名</div>
|
||
</div>
|
||
</div>
|
||
<div class="rypm-body">
|
||
<el-row class="rypm-title-box">
|
||
<el-col :span="2">
|
||
<div>排名</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div>姓名</div>
|
||
</el-col>
|
||
<el-col :span="3">
|
||
<div>应履职</div>
|
||
</el-col>
|
||
<el-col :span="3">
|
||
<div>已履职</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div>发现问题</div>
|
||
</el-col>
|
||
<el-col :span="8">
|
||
<div>履职进度</div>
|
||
</el-col>
|
||
</el-row>
|
||
<div v-if="rypmList.length>0">
|
||
<el-row class="rypm-subtitle-box" v-for="(item, index) in rypmList" :key="index">
|
||
<el-col :span="2">
|
||
<div class="rypm-subtitle-number" @click="showPerformRecord(item)"
|
||
:style="index == 0 ? 'background-color:rgba(255, 50, 50, 1);' : (index == 1 ? 'background-color:rgba(255, 152, 0, 1);' : (index == 2 ? 'background-color:rgba(255, 210, 0, 1);' : 'background-color:rgba(204, 204, 204, 1);'))">
|
||
{{ (index + 1) }}
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div class="rypm-subtitle-name" @click="showPerformRecord(item)">{{ item.nickName }}</div>
|
||
</el-col>
|
||
<el-col :span="3">
|
||
<div class="rypm-subtitle-value" @click="showPerformRecord(item)">
|
||
{{ item.lzTotal }}{{item.bzlzUnitType}}</div>
|
||
</el-col>
|
||
<el-col :span="3">
|
||
<div class="rypm-subtitle-value" style="color:#19BE6B" @click="showPerformRecord(item)">
|
||
{{ item.reallzNum }}{{item.bzlzUnitType}}
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div class="rypm-subtitle-value" style="color:#F56C6C" @click="showPerformRecord(item)">
|
||
{{ item.problemNum||0 }}</div>
|
||
</el-col>
|
||
<el-col :span="8">
|
||
<div @click="showPerformRecord(item)">
|
||
<el-progress :percentage="formatBFb(item.lzBfb)"
|
||
:color="index == 0 ? rypmColors.color1 : (index == 1 ? rypmColors.color2 : (index == 2 ? rypmColors.color3 : rypmColors.color4))"></el-progress>
|
||
</div>
|
||
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
|
||
<el-row v-else class="rypm-subtitle-box">
|
||
<el-col :span="24">
|
||
<div class="nodata">暂无数据</div>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
<el-col :xs="24" :sm="24" :md="12" :lg="6">
|
||
<el-card class="update-log">
|
||
<div slot="header" class="clearfix">
|
||
<div class="header-title">
|
||
<div></div>
|
||
<div>领导概况</div>
|
||
</div>
|
||
</div>
|
||
<div class="ldgk-body">
|
||
<el-row class="ldgk-title-box">
|
||
<el-col :span="10">
|
||
<div>姓名</div>
|
||
</el-col>
|
||
<el-col :span="7">
|
||
<div>应履职</div>
|
||
</el-col>
|
||
<el-col :span="7">
|
||
<div>已履职</div>
|
||
</el-col>
|
||
</el-row>
|
||
<div v-if="ldgkList.length>0">
|
||
<el-row class="ldgk-subtitle-box" v-for="(item, index) in ldgkList" :key="index">
|
||
<el-col :span="10">
|
||
<div class="ldgk-subtitle-name">{{ item.nickName }}</div>
|
||
</el-col>
|
||
<el-col :span="7">
|
||
<div class="ldgk-subtitle-value">{{ item.lzTotal }}{{item.xclzUnitType}}</div>
|
||
</el-col>
|
||
<el-col :span="7">
|
||
<div class="ldgk-subtitle-value" style="color:#19BE6B">{{ item.reallzNum }}{{item.xclzUnitType}}</div>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
|
||
<el-row v-else class="ldgk-subtitle-box">
|
||
<el-col :span="24">
|
||
<div class="nodata">暂无数据</div>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- 履职问题分布情况 -->
|
||
<el-row :gutter="20" style="margin-bottom: 10px;">
|
||
<el-col :sm="24" :lg="24">
|
||
<el-card class="update-log">
|
||
<div slot="header" class="clearfix">
|
||
<div class="header-title">
|
||
<div></div>
|
||
<div>履职问题分布情况</div>
|
||
</div>
|
||
</div>
|
||
<div class="sc-body">
|
||
<el-row>
|
||
<el-col :span="8">
|
||
<pie-chart :chart-data="pieChartData" @showValue="showValue" />
|
||
<div class="scwt1-name">安全履职检查手册问题</div>
|
||
</el-col>
|
||
<el-col :span="8" style="margin-top: 60px;">
|
||
<el-row class="scwt-percentage" v-for="(item,index) in firstInfo" :key="index">
|
||
|
||
<el-col :span="6" class="scwt-title"><span
|
||
@click="showValue({name:item.name,typeName:'firstName'})">{{item.name}}</span></el-col>
|
||
<el-col :span="14" style="margin: 0px 5px;"><span
|
||
@click="showValue({name:item.name,typeName:'firstName'})"><el-progress :text-inside="true"
|
||
:stroke-width="14" :percentage="Math.round(item.value/firstCount*100)" :color="customColor"
|
||
@click="showValue({name:item.name,typeName:'firstName'})"></el-progress></span></el-col>
|
||
<el-col :span="3" class="scwt-subtitle"><span
|
||
@click="showValue({name:item.name,typeName:'firstName'})">{{item.value}}</span></el-col>
|
||
|
||
</el-row>
|
||
<div class="scwt-name">手册一级目录问题</div>
|
||
</el-col>
|
||
<el-col :span="8" style="margin-top: 60px;">
|
||
<el-row class="scwt-percentage" v-for="(item,index) in secondInfo" :key="index"
|
||
@click="showValue({name:item.name,typeName:'secondName'})">
|
||
<el-col :span="6" class="scwt-title"><span @click="showValue({name:item.name,typeName:'secondName'})">
|
||
{{item.name}}</span></el-col>
|
||
<el-col :span="14" style="margin: 0px 5px;"><span
|
||
@click="showValue({name:item.name,typeName:'secondName'})"><el-progress :text-inside="true"
|
||
:stroke-width="14" :percentage="Math.round(item.value/secondCount*100)"
|
||
:color="customColor"></el-progress></span></el-col>
|
||
<el-col :span="3" class="scwt-subtitle"><span
|
||
@click="showValue({name:item.name,typeName:'secondName'})">{{item.value}}</span></el-col>
|
||
</el-row>
|
||
<div class="scwt-name">手册二级目录问题</div>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
|
||
<!-- 履职问题 弹窗 -->
|
||
<el-dialog title="履职问题" :visible.sync="lzwtOpen" width="90%" append-to-body>
|
||
<el-form :model="lzwtParams" ref="lzwtParams" size="small" :inline="true">
|
||
<el-form-item label="手册名称" prop="handbookName">
|
||
<el-input v-model="lzwtParams.handbookName" placeholder="请输入手册名称关键字" clearable />
|
||
</el-form-item>
|
||
<el-form-item label="一级目录" prop="firstName">
|
||
<el-input v-model="lzwtParams.firstName" placeholder="请输入一级目录关键字" clearable />
|
||
</el-form-item>
|
||
<el-form-item label="二级目录" prop="secondName">
|
||
<el-input v-model="lzwtParams.secondName" placeholder="请输入二级目录关键字" clearable />
|
||
</el-form-item>
|
||
<el-form-item label="日期范围">
|
||
<el-date-picker v-model="monthrange2" style="width: 240px" value-format="yyyy-MM" type="monthrange"
|
||
range-separator="-" start-placeholder="开始月份" end-placeholder="结束月份" clearable></el-date-picker>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQueryLzwt">搜索</el-button>
|
||
<el-button icon="el-icon-refresh" size="mini" @click="resetQueryLzwt">重置</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
<el-table v-loading="loadingLzwt" :data="performDetailsList">
|
||
<el-table-column label="序号" align="center" type="index" width="50" />
|
||
<el-table-column label="履职手册" prop="handbookName" :show-overflow-tooltip="true" />
|
||
<el-table-column label="一级目录" prop="firstName" :show-overflow-tooltip="true" />
|
||
<el-table-column label="二级目录" prop="secondName" :show-overflow-tooltip="true" />
|
||
<el-table-column label="履职工程名称" prop="projectName" :show-overflow-tooltip="true" />
|
||
<el-table-column label="发现问题/现场情况" prop="remark" :show-overflow-tooltip="true" />
|
||
<el-table-column v-hasPermi="['system:config:showResponsiblePerson']" label="责任人" prop="responsiblePerson" :show-overflow-tooltip="true" />
|
||
<el-table-column label="问题照片数" align="center" prop="imgNum" :show-overflow-tooltip="true" width="100">
|
||
<template slot-scope="scope">
|
||
<span class="address-box" @click="handleShow(scope.row)">{{scope.row.imgNum}}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="履职类型" prop="type" :show-overflow-tooltip="true" width="80">
|
||
<template slot-scope="scope">
|
||
<dict-tag :options="dict.type.sys_lz_type" :value="scope.row.type" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="履职定位" prop="address" :show-overflow-tooltip="true">
|
||
<template slot-scope="scope">
|
||
<span class="address-box" @click="positioning(scope.row)">{{scope.row.address?scope.row.address:''}}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="履职人" prop="nickName" :show-overflow-tooltip="true" width="100" />
|
||
<el-table-column label="同行人" prop="otherUserName" :show-overflow-tooltip="true" />
|
||
<el-table-column label="履职时间" prop="createTime" width="100" />
|
||
</el-table>
|
||
<pagination v-show="totalLzwt > 0" :total="totalLzwt" :page.sync="lzwtParams.pageNum"
|
||
:limit.sync="lzwtParams.pageSize" @pagination="getProblemList" style="margin-bottom: 20px;" />
|
||
</el-dialog>
|
||
|
||
<!-- 地图定位 -->
|
||
<el-dialog title="查看地址" :visible.sync="dialogMap" width="800PX" append-to-body v-if="sign">
|
||
<div class="location-box">
|
||
<template>
|
||
<baidu-map style="height: 400px" class="map" :zoom="12" :center="center" :scroll-wheel-zoom="true">
|
||
<bm-map-type :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']"></bm-map-type>
|
||
<bm-marker :position="center" :dragging="true" animation="BMAP_ANIMATION_BOUNCE"></bm-marker>
|
||
</baidu-map>
|
||
</template>
|
||
</div>
|
||
<div class="map-address">{{mapAddress}}</div>
|
||
</el-dialog>
|
||
|
||
<el-dialog title="问题详情" :visible.sync="openWtxq" width="780px" append-to-body>
|
||
|
||
<div class="wtxq-box">
|
||
<div class="wtxq-top-box">
|
||
<div class="title-box">{{issueData.projectName?issueData.projectName:'无'}}</div>
|
||
<div class="subtitle-box">
|
||
<div>{{issueData.handbookName?issueData.handbookName:'无'}}</div>
|
||
<div>{{issueData.type==0?'现场履职':'班组履职'}}</div>
|
||
</div>
|
||
<div class="people-box">
|
||
<div>履职人：{{issueData.nickName?issueData.nickName:'无'}}</div>
|
||
<div>同行人：
|
||
<div class="people">{{issueData.otherUserName?issueData.otherUserName:'无'}}</div>
|
||
</div>
|
||
<div>{{issueData.createTime?issueData.createTime:'暂无时间'}}</div>
|
||
</div>
|
||
</div>
|
||
<div class="wtxq-center-box" style="margin-bottom:20px;">
|
||
<el-card class="box-card">
|
||
<div slot="header" class="clearfix">
|
||
<span style="font-weight: 700;font-size: 15px;color: #333333;">履职检查重点</span>
|
||
</div>
|
||
<div class="center-box">
|
||
<div class="title2-box">{{issueData.indexMap?issueData.indexMap.firstName:''}}</div>
|
||
<div class="content-box">
|
||
<span>{{issueData.indexMap?issueData.indexMap.secondName:''}}</span><span>{{issueData.indexMap?issueData.indexMap.secondContent:''}}</span>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
</div>
|
||
<div class="wtxq-bottom-box" style="margin-bottom:30px;">
|
||
<el-card class="box-card">
|
||
<div slot="header" class="clearfix">
|
||
<span style="font-weight: 700;font-size: 13px;color: #D9001B;">发现问题</span>
|
||
</div>
|
||
<div class="title3">
|
||
<div>现场情况</div>
|
||
<div>{{issueData.remark?issueData.remark:'暂无情况'}}</div>
|
||
</div>
|
||
<el-divider v-hasPermi="['system:config:showResponsiblePerson']"></el-divider>
|
||
<div class="title3" v-hasPermi="['system:config:showResponsiblePerson']">
|
||
<div>责任人</div>
|
||
<div>{{issueData.responsiblePerson?issueData.responsiblePerson:'暂无责任人'}}</div>
|
||
</div>
|
||
<el-divider></el-divider>
|
||
<div class="img-box">
|
||
<div class="img-name">照片</div>
|
||
<div class="img-data" v-for='(item,index) in issueData.img' :key="index">
|
||
<el-image class="avatar-img" :src="item.url" :preview-src-list="getSrcList(issueData.img)">
|
||
</el-image>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
</div>
|
||
<!-- <div class="wtxq-bottom-box" style="margin-bottom:30px;" >
|
||
<el-card class="box-card">
|
||
<div slot="header" class="clearfix">
|
||
<span style="font-weight: 700;font-size: 13px;color: #D9001B;">整改结果</span>
|
||
</div>
|
||
<el-form ref="form" :model="form" label-width="80px">
|
||
<el-row>
|
||
<el-col :span="24">
|
||
<el-form-item label="整改描述" prop="zgRemark">
|
||
<el-input type="textarea" v-model="form.zgRemark" placeholder="请填写整改描述" :disabled="isZgRemark">
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="照片" prop="templateList" ref="templateList">
|
||
<el-upload :limit="3" :file-list="templateList" :multiple="false" accept=".jpg, .png"
|
||
:action="uploadImgUrl" :headers="headers" list-type="picture-card"
|
||
:on-preview="handlePictureCardPreview" :class="{'hide': isUploading}">
|
||
<i class="el-icon-plus"></i>
|
||
</el-upload>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
</el-card>
|
||
</div> -->
|
||
</div>
|
||
</el-dialog>
|
||
|
||
|
||
<!-- 照片墙 -->
|
||
<el-dialog :visible.sync="dialogImg">
|
||
<img width="100%" :src="dialogImageUrl" alt="">
|
||
</el-dialog>
|
||
|
||
|
||
<PerformRecord :visible="dialogPerformRecord" :time="monthValue" @closeDialog="closeDialog"></PerformRecord>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
mapGetters
|
||
} from 'vuex'
|
||
import {
|
||
getUserProfile
|
||
} from "@/api/system/user";
|
||
import {
|
||
performSetUserInfo
|
||
} from "@/api/perform_set/user"
|
||
import {
|
||
performOverview,
|
||
performDeptRank,
|
||
performUserRank,
|
||
performLeadRank,
|
||
handbookInfo,
|
||
handbookFirst,
|
||
handbookSecond,
|
||
getProblemList
|
||
|
||
} from "@/api/index"
|
||
|
||
import {
|
||
getIssue
|
||
} from "@/api/report/perform_issue";
|
||
|
||
import {
|
||
getToken
|
||
} from "@/utils/auth";
|
||
import PieChart from './dashboard/PieChart'
|
||
import PerformRecord from './components/PerformRecord.vue'
|
||
|
||
export default {
|
||
name: "Index",
|
||
dicts: ['sys_record_status', 'sys_lz_type'],
|
||
components: {
|
||
PieChart,
|
||
PerformRecord
|
||
},
|
||
data() {
|
||
return {
|
||
lzglType: "0",
|
||
user: {},
|
||
performUserSet: {},
|
||
dwpmList: [],
|
||
rypmColors: {
|
||
color1: 'rgba(255, 50, 50, 1)',
|
||
color2: 'rgba(255, 152, 0, 1)',
|
||
color3: 'rgba(255, 210, 0, 1)',
|
||
color4: 'rgba(35, 145, 255, 1)'
|
||
},
|
||
rypmList: [],
|
||
ldgkList: [],
|
||
customColor: 'rgba(255, 122, 140, 1)',
|
||
pieChartData: [],
|
||
monthValue: "",
|
||
lzInfo2: {},
|
||
firstInfo: [],
|
||
firstCount: 0,
|
||
secondInfo: [],
|
||
secondCount: 0,
|
||
|
||
// 履职问题 弹窗
|
||
lzwtOpen: false,
|
||
lzwtParams: {
|
||
handbookName: '',
|
||
firstName: '',
|
||
secondName: '',
|
||
startTime: '',
|
||
endTime: '',
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
},
|
||
loadingLzwt: false,
|
||
performDetailsList: [],
|
||
totalLzwt: 0,
|
||
monthrange2: '',
|
||
|
||
// 地图 弹窗
|
||
sign: false,
|
||
dialogMap: false,
|
||
mapAddress: '',
|
||
center: {
|
||
lng: 0,
|
||
lat: 0,
|
||
},
|
||
//问题详情
|
||
openWtxq: false,
|
||
// 履职问题详情数据
|
||
issueData: {},
|
||
isUploading: false,
|
||
isZgRemark: false,
|
||
form: {},
|
||
|
||
// 图片
|
||
headers: {
|
||
Authorization: "Bearer " + getToken()
|
||
},
|
||
dialogImageUrl: '',
|
||
dialogImg: false,
|
||
isUploading: false,
|
||
isZgRemark: false,
|
||
baseUrl: process.env.VUE_APP_BASE_API,
|
||
uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
|
||
templateList: [],
|
||
uploadList: [],
|
||
|
||
//
|
||
dialogPerformRecord: false,
|
||
|
||
|
||
|
||
|
||
};
|
||
},
|
||
computed: {
|
||
...mapGetters([
|
||
'sidebar',
|
||
'avatar',
|
||
'device'
|
||
]),
|
||
},
|
||
created() {
|
||
let year = new Date().getFullYear();
|
||
let month = new Date().getMonth() + 1;
|
||
month = month <= 9 ? '0' + month : month;
|
||
this.monthValue = (year + month).toString();
|
||
this.getUser();
|
||
this.init();
|
||
|
||
},
|
||
methods: {
|
||
init() {
|
||
this.getPerformSetUserInfo();
|
||
this.performOverview();
|
||
this.performDeptRank();
|
||
this.performUserRank();
|
||
this.performLeadRank();
|
||
this.handbookInfo();
|
||
this.handbookFirst();
|
||
this.handbookSecond();
|
||
},
|
||
getUser() {
|
||
getUserProfile().then(response => {
|
||
this.user = response.data;
|
||
this.roleGroup = response.roleGroup;
|
||
this.postGroup = response.postGroup;
|
||
});
|
||
},
|
||
getPerformSetUserInfo() {
|
||
performSetUserInfo({
|
||
yyyyMM: this.monthValue
|
||
}).then(response => {
|
||
// console.log(response.data);
|
||
this.performUserSet = response.data;
|
||
});
|
||
},
|
||
performOverview() {
|
||
performOverview({
|
||
yyyymm: this.monthValue
|
||
}).then(res => {
|
||
|
||
let ls = {};
|
||
ls.lzrs = res.data.personNum || 0;
|
||
ls.wcrs = res.data.endNum || 0;
|
||
if(ls.lzrs==0){
|
||
ls.wcrsBfb =0
|
||
}else{
|
||
ls.wcrsBfb = (ls.wcrs / ls.lzrs * 100).toFixed(1)
|
||
}
|
||
ls.wwcrs = ls.lzrs - ls.wcrs;
|
||
ls.wwcrsBfb = 100 - ls.wcrsBfb;
|
||
console.log("ls.wwcrsBfb",ls.wwcrsBfb);
|
||
ls.qj = res.data.leavePerson || 0;
|
||
ls.qjts = res.data.leaveNum || 0;
|
||
ls.wwts = res.data.noProblemNum || 0;
|
||
ls.fxwts = res.data.problemNum || 0;
|
||
ls.lzcs = ls.wwts + ls.fxwts;
|
||
this.lzInfo2 = ls;
|
||
// this.performUserSet = response.data;
|
||
});
|
||
},
|
||
performDeptRank() {
|
||
performDeptRank({
|
||
yyyymm: this.monthValue
|
||
}).then(res => {
|
||
this.dwpmList = res.rows;
|
||
})
|
||
},
|
||
performUserRank() {
|
||
performUserRank({
|
||
yyyymm: this.monthValue
|
||
}).then(res => {
|
||
this.rypmList = res.rows;
|
||
})
|
||
},
|
||
performLeadRank() {
|
||
performLeadRank({
|
||
yyyymm: this.monthValue
|
||
}).then(res => {
|
||
this.ldgkList = res.rows;
|
||
|
||
})
|
||
},
|
||
handbookInfo() {
|
||
this.pieChartData = [];
|
||
handbookInfo({
|
||
yyyyMM: this.monthValue
|
||
}).then(res => {
|
||
let ls = [];
|
||
res.rows.forEach(item => {
|
||
ls.push({
|
||
name: item.name,
|
||
value: item.num
|
||
})
|
||
})
|
||
this.pieChartData = ls;
|
||
})
|
||
},
|
||
handbookFirst() {
|
||
this.firstCount = 0;
|
||
|
||
handbookFirst({
|
||
yyyyMM: this.monthValue
|
||
}).then(res => {
|
||
this.firstInfo = [];
|
||
res.rows.forEach(item => {
|
||
this.firstInfo.push({
|
||
name: item.name,
|
||
value: item.num
|
||
})
|
||
this.firstCount += item.num;
|
||
})
|
||
// this.ldgkList=res.rows;
|
||
})
|
||
},
|
||
handbookSecond() {
|
||
this.secondCount = 0;
|
||
handbookSecond({
|
||
yyyyMM: this.monthValue
|
||
}).then(res => {
|
||
this.secondInfo = [];
|
||
res.rows.forEach(item => {
|
||
this.secondInfo.push({
|
||
name: item.name,
|
||
value: item.num
|
||
})
|
||
this.secondCount += item.num;
|
||
})
|
||
// this.ldgkList=res.rows;
|
||
})
|
||
},
|
||
formatBFb(value) {
|
||
if (value == null || value == '' || value == 0) {
|
||
return 0;
|
||
} else if (value == 100) {
|
||
return 100
|
||
} else {
|
||
return parseFloat(parseFloat(value).toFixed(1));
|
||
}
|
||
|
||
},
|
||
|
||
changeYear() {
|
||
this.init()
|
||
},
|
||
showValue(e) {
|
||
this.lzwtParams = {
|
||
handbookName: '',
|
||
firstName: '',
|
||
secondName: '',
|
||
startTime: '',
|
||
endTime: '',
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
}
|
||
this.lzwtParams[e.typeName] = e.name;
|
||
this.lzwtOpen = true;
|
||
|
||
let lsDate=this.monthValue.slice(0, 4) + '-' + this.monthValue.slice(4);
|
||
|
||
this.monthrange2=[lsDate,lsDate]
|
||
this.handleQueryLzwt();
|
||
},
|
||
handleQueryLzwt() {
|
||
this.lzwtParams.pageNum = 1;
|
||
console.log(this.monthrange2);
|
||
|
||
if (this.monthrange2[0]) {
|
||
this.lzwtParams.startTime = this.monthrange2[0] + '-01'
|
||
} else {
|
||
this.lzwtParams.startTime = ''
|
||
}
|
||
if (this.monthrange2[1]) {
|
||
this.lzwtParams.endTime = this.monthrange2[1] + '-' + this.getLastDayOfMonth(this.monthrange2[1])
|
||
} else {
|
||
this.lzwtParams.endTime = ''
|
||
}
|
||
this.getProblemList();
|
||
|
||
},
|
||
resetQueryLzwt() {
|
||
this.lzwtParams = {
|
||
handbookName: '',
|
||
firstName: '',
|
||
secondName: '',
|
||
startTime: '',
|
||
endTime: '',
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
}
|
||
this.getProblemList();
|
||
|
||
},
|
||
getProblemList() {
|
||
let f = {};
|
||
|
||
f = {
|
||
...this.lzwtParams
|
||
};
|
||
getProblemList(f).then(res => {
|
||
this.performDetailsList = res.rows;
|
||
this.totalLzwt = res.total;
|
||
})
|
||
|
||
},
|
||
positioning(row) {
|
||
this.sign = true;
|
||
this.dialogMap = true;
|
||
//经度和纬度
|
||
this.center.lng = Number(row.lon);
|
||
this.center.lat = Number(row.lat);
|
||
this.mapAddress = row.address;
|
||
},
|
||
getLastDayOfMonth(date) {
|
||
const currentDate = new Date(date);
|
||
const year = currentDate.getFullYear();
|
||
const month = currentDate.getMonth() + 1; // 月份从0开始，需要加1
|
||
const lastDayOfMonth = new Date(year, month, 0).getDate();
|
||
return lastDayOfMonth;
|
||
},
|
||
/** 详情按钮操作 */
|
||
handleShow(row) {
|
||
this.isUploading = true;
|
||
this.isZgRemark = true;
|
||
getIssue(row.id).then(response => {
|
||
this.issueData = response.data;
|
||
// 问题照片赋值
|
||
const imgData = [];
|
||
if (response.data.img && JSON.parse(response.data.img).length > 0) {
|
||
JSON.parse(response.data.img).forEach(item => {
|
||
imgData.push({
|
||
url: process.env.VUE_APP_BASE_API + item.url,
|
||
});
|
||
});
|
||
}
|
||
this.issueData.img = imgData;
|
||
//整改描述赋值
|
||
this.form.zgRemark = response.data.zgRemark ? response.data.zgRemark : '';
|
||
// 整改图片赋值
|
||
if (response.data.zgImg) {
|
||
JSON.parse(response.data.zgImg).forEach(item => {
|
||
this.templateList.push({
|
||
url: process.env.VUE_APP_BASE_API + item.url,
|
||
fileName: item.url,
|
||
});
|
||
});
|
||
}
|
||
this.openWtxq = true;
|
||
});
|
||
},
|
||
getSrcList(urls) {
|
||
let arr = [];
|
||
urls.forEach(item => {
|
||
arr.push(item.url);
|
||
})
|
||
return arr;
|
||
},
|
||
showPerformRecord(item) {
|
||
this.dialogPerformRecord = true;
|
||
},
|
||
closeDialog() {
|
||
this.dialogPerformRecord = false;
|
||
}
|
||
|
||
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.home {
|
||
.my-lz {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.name-box {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.avatar-img {
|
||
width: 65px;
|
||
height: 65px;
|
||
border-radius: 65px;
|
||
}
|
||
|
||
.avatar-box {
|
||
margin-left: 30px;
|
||
|
||
.userName {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
div:nth-child(1) {
|
||
font-size: 18px;
|
||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 700;
|
||
color: #666666;
|
||
}
|
||
|
||
div:nth-child(2) {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 75px;
|
||
height: 23px;
|
||
background: inherit;
|
||
background-color: rgba(255, 153, 0, 1);
|
||
border: none;
|
||
border-radius: 5px;
|
||
font-size: 11px;
|
||
color: #FFFFFF;
|
||
margin-left: 20px;
|
||
}
|
||
}
|
||
|
||
.deptName {
|
||
font-family: 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 400;
|
||
color: #999999;
|
||
font-size: 13px;
|
||
margin-top: 5px;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.lvzhi-box {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.lz-img {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 60px;
|
||
height: 60px;
|
||
box-shadow: rgba(0, 0, 0, 0.047) 0px 0px 5px;
|
||
font-family: "微软雅黑 Bold", 微软雅黑, sans-serif;
|
||
font-weight: 700;
|
||
font-style: normal;
|
||
font-size: 28px;
|
||
color: rgb(255, 255, 255);
|
||
border-radius: 10px;
|
||
|
||
img {
|
||
width: 40px;
|
||
height: 40px
|
||
}
|
||
}
|
||
|
||
.lz-title-box {
|
||
margin-left: 20px;
|
||
|
||
.lztitle {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
div:nth-child(1) {
|
||
font-size: 28px;
|
||
font-family: 'Montserrat Bold', 'Montserrat', sans-serif;
|
||
font-weight: 700;
|
||
color: #666666;
|
||
}
|
||
|
||
div:nth-child(2) {
|
||
font-family: '方正小标宋_GBK', sans-serif;
|
||
font-weight: 400;
|
||
font-size: 13px;
|
||
color: #666666;
|
||
margin: 8px 0px 0px 10px;
|
||
}
|
||
}
|
||
|
||
.lzsubtitle {
|
||
font-size: 14px;
|
||
font-family: '微软雅黑', sans-serif;
|
||
font-weight: 400;
|
||
color: #999999;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.lzhz-box {
|
||
font-family: '方正小标宋_GBK', sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 16px;
|
||
color: #FF9900;
|
||
text-align: left;
|
||
|
||
div {
|
||
margin-bottom: 10px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.lzgl-body {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.lzgl-box {
|
||
display: flex;
|
||
|
||
.lz-img {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 60px;
|
||
height: 60px;
|
||
box-shadow: rgba(0, 0, 0, 0.047) 0px 0px 5px;
|
||
font-family: "微软雅黑 Bold", 微软雅黑, sans-serif;
|
||
font-weight: 700;
|
||
font-style: normal;
|
||
font-size: 28px;
|
||
color: rgb(255, 255, 255);
|
||
border-radius: 60px;
|
||
|
||
img {
|
||
width: 30px;
|
||
height: 30px
|
||
}
|
||
}
|
||
|
||
.lz-title-box {
|
||
margin-left: 20px;
|
||
|
||
.lztitle {
|
||
display: flex;
|
||
align-items: center;
|
||
margin: 5px 0px;
|
||
|
||
div:nth-child(1) {
|
||
font-size: 28px;
|
||
font-family: 'Montserrat Bold', 'Montserrat', sans-serif;
|
||
font-weight: 700;
|
||
color: #333333;
|
||
}
|
||
}
|
||
|
||
.lzsubtitle {
|
||
font-size: 14px;
|
||
font-family: '微软雅黑', sans-serif;
|
||
font-weight: 400;
|
||
color: #666666;
|
||
}
|
||
|
||
.lznum {
|
||
font-family: 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 13px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.glhz-box {
|
||
|
||
.glhz-title-box {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin: 10px 0px;
|
||
|
||
div:nth-child(1) {
|
||
font-size: 13px;
|
||
color: #333333;
|
||
font-family: 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
}
|
||
|
||
div:nth-child(2) {
|
||
font-family: 'Montserrat Bold', 'Montserrat', sans-serif;
|
||
font-weight: 700;
|
||
font-style: normal;
|
||
font-size: 16px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.dwpm-body {
|
||
.dwpm-title-box {
|
||
font-family: 微软雅黑, sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 16px;
|
||
color: rgb(153, 153, 153)
|
||
}
|
||
|
||
.dwpm-subtitle-box {
|
||
margin-top: 18px;
|
||
|
||
.dwpm-subtitle-number {
|
||
display: table-cell;
|
||
border-radius: 5px;
|
||
background-color: #f0f2f5;
|
||
width: 25px;
|
||
height: 25px;
|
||
text-align: center;
|
||
vertical-align: middle;
|
||
font-family: "Arial Normal", "Arial", sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 13px;
|
||
letter-spacing: normal;
|
||
color: #FFFFFF
|
||
}
|
||
|
||
.dwpm-subtitle-name {
|
||
font-family: "MicrosoftYaHei", "Microsoft YaHei", sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 14px;
|
||
color: rgba(0, 0, 0, 0.647058823529412);
|
||
text-align: left;
|
||
line-height: 22px;
|
||
}
|
||
|
||
.dwpm-subtitle-value {
|
||
display: flex;
|
||
font-size: 14px;
|
||
color: rgba(0, 0, 0, 0.647058823529412);
|
||
text-align: right;
|
||
line-height: 22px;
|
||
font-family: "Arial Normal", "Arial", sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.rypm-body {
|
||
.rypm-title-box {
|
||
font-family: 微软雅黑, sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 16px;
|
||
color: rgb(153, 153, 153)
|
||
}
|
||
|
||
.rypm-subtitle-box {
|
||
margin-top: 18px;
|
||
|
||
.rypm-subtitle-number {
|
||
display: table-cell;
|
||
border-radius: 5px;
|
||
background-color: #f0f2f5;
|
||
width: 25px;
|
||
height: 25px;
|
||
text-align: center;
|
||
vertical-align: middle;
|
||
font-family: "Arial Normal", "Arial", sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 13px;
|
||
letter-spacing: normal;
|
||
color: #FFFFFF;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.rypm-subtitle-name {
|
||
font-family: "MicrosoftYaHei", "Microsoft YaHei", sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 14px;
|
||
color: rgba(0, 0, 0, 0.647058823529412);
|
||
text-align: left;
|
||
line-height: 22px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.rypm-subtitle-value {
|
||
display: flex;
|
||
font-size: 14px;
|
||
color: rgba(0, 0, 0, 0.647058823529412);
|
||
text-align: right;
|
||
line-height: 22px;
|
||
font-family: "Arial Normal", "Arial", sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
cursor: pointer;
|
||
}
|
||
}
|
||
}
|
||
|
||
.ldgk-body {
|
||
.ldgk-title-box {
|
||
font-family: 微软雅黑, sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 16px;
|
||
color: rgb(153, 153, 153)
|
||
}
|
||
|
||
.ldgk-subtitle-box {
|
||
margin-top: 18px;
|
||
|
||
.ldgk-subtitle-name {
|
||
font-family: "MicrosoftYaHei", "Microsoft YaHei", sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 14px;
|
||
color: rgba(0, 0, 0, 0.647058823529412);
|
||
text-align: left;
|
||
line-height: 25px;
|
||
}
|
||
|
||
.ldgk-subtitle-value {
|
||
display: flex;
|
||
font-size: 14px;
|
||
color: rgba(0, 0, 0, 0.647058823529412);
|
||
text-align: right;
|
||
line-height: 25px;
|
||
font-family: "Arial Normal", "Arial", sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.sc-body {
|
||
.scwt-percentage {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 30px;
|
||
|
||
.scwt-title {
|
||
font-size: 13px;
|
||
text-align: right;
|
||
color: #333333;
|
||
}
|
||
|
||
.scwt-subtitle {
|
||
font-size: 13px;
|
||
color: #2C3542;
|
||
}
|
||
}
|
||
|
||
.scwt-name {
|
||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 700;
|
||
font-style: normal;
|
||
font-size: 13px;
|
||
color: #666666;
|
||
margin: 30px 0px;
|
||
text-align: center;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.scwt1-name {
|
||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 700;
|
||
font-style: normal;
|
||
font-size: 13px;
|
||
color: #666666;
|
||
text-align: center;
|
||
cursor: pointer;
|
||
}
|
||
}
|
||
|
||
.header-title {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
div:nth-child(1) {
|
||
width: 5px;
|
||
height: 15px;
|
||
background-color: #31A7FF;
|
||
margin-right: 5px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.sx {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
}
|
||
|
||
.nodata {
|
||
color: #ccc;
|
||
text-align: center;
|
||
padding: 20px;
|
||
}
|
||
|
||
|
||
.img-num-box {
|
||
font-size: 13px;
|
||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 700;
|
||
font-style: normal;
|
||
color: #409EFF;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.address-box {
|
||
font-size: 13px;
|
||
font-family: 微软雅黑, sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
color: rgb(64, 158, 255);
|
||
cursor: pointer;
|
||
}
|
||
|
||
.wtxq-box {
|
||
.wtxq-top-box {
|
||
display: flex;
|
||
flex-direction: column;
|
||
|
||
.title-box {
|
||
font-size: 16px;
|
||
font-family: '微软雅黑 Bold', '微软雅黑', sans-serif;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.subtitle-box {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 14px;
|
||
font-family: '微软雅黑', sans-serif;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
margin-bottom: 10px;
|
||
|
||
div:nth-child(2) {
|
||
margin-left: 100px;
|
||
}
|
||
}
|
||
|
||
.people-box {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 14px;
|
||
font-family: '微软雅黑', sans-serif;
|
||
font-weight: 400;
|
||
margin-bottom: 10px;
|
||
color: #333333;
|
||
|
||
div:nth-child(2) {
|
||
margin-left: 30px;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.people {
|
||
margin-right: 10px;
|
||
margin-left: 0px;
|
||
}
|
||
}
|
||
|
||
div:nth-child(3) {
|
||
color: #999999;
|
||
margin-left: 85px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.wtxq-center-box {
|
||
.center-box {
|
||
width: 100%;
|
||
padding: 10px;
|
||
background: inherit;
|
||
background-color: rgba(255, 255, 255, 1);
|
||
box-sizing: border-box;
|
||
border-width: 1px;
|
||
border-style: solid;
|
||
border-color: rgba(228, 228, 228, 1);
|
||
border-radius: 8px;
|
||
font-family: 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
font-size: 15px;
|
||
letter-spacing: normal;
|
||
color: #333333;
|
||
|
||
.title2-box {
|
||
letter-spacing: normal;
|
||
color: #333333;
|
||
font-family: '微软雅黑 Bold', '微软雅黑', sans-serif;
|
||
font-weight: 700;
|
||
font-size: 15px;
|
||
}
|
||
|
||
.content-box {
|
||
font-family: 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 400;
|
||
color: #000000;
|
||
font-size: 13px;
|
||
|
||
span:nth-child(1) {
|
||
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 700;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.wtxq-bottom-box {
|
||
.title3 {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 13px;
|
||
|
||
div:nth-child(1) {
|
||
width: 60px;
|
||
font-family: 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
color: #333333;
|
||
}
|
||
|
||
div:nth-child(2) {
|
||
font-family: 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
color: #999999;
|
||
}
|
||
}
|
||
|
||
.img-box {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 13px;
|
||
|
||
.img-name {
|
||
width: 60px;
|
||
font-family: "Arial Normal", "Arial", sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
color: #333333;
|
||
}
|
||
|
||
.img-data {
|
||
width: 78px;
|
||
margin-right: 20px;
|
||
|
||
img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.img-none {
|
||
font-family: 'Arial Normal', 'Arial', sans-serif;
|
||
font-weight: 400;
|
||
font-style: normal;
|
||
color: #999999;
|
||
}
|
||
}
|
||
}
|
||
|
||
.el-divider--horizontal {
|
||
margin: 10px 0;
|
||
}
|
||
|
||
.map-address {
|
||
font-family: '微软雅黑 Bold', '微软雅黑', sans-serif;
|
||
font-weight: 700;
|
||
color: #666666;
|
||
font-size: 16px;
|
||
text-align: center;
|
||
margin-top: 30px;
|
||
}
|
||
|
||
.hide .el-upload--picture-card {
|
||
display: none;
|
||
}
|
||
</style>
|
||
<style>
|
||
.el-progress-bar__innerText {
|
||
color: #ffffff !important;
|
||
}
|
||
</style>
|