Browse Source

Merge branch 'master' into dev-hesuan1013

master-磐石
jiangyy 3 years ago
parent
commit
ced86a5dde
  1. 478
      src/views/modules/cpts/base/index.vue
  2. 108
      src/views/modules/renFangTongJi/cpts/shequtongji.vue
  3. 88
      src/views/modules/renFangTongJi/index.vue

478
src/views/modules/cpts/base/index.vue

@ -1,239 +1,296 @@
<template>
<div class="div_main">
<div v-show="true">
<div class="div_search"
ref="ref_search">
<el-form :inline="true"
ref="ref_searchform"
label-width="100px">
<div class="div_search" ref="ref_search">
<el-form :inline="true" ref="ref_searchform" label-width="100px">
<div>
<el-form-item v-for="item in searchParams"
:key="'serach' + item.keyName"
:label="item.field"
:prop="item.keyName">
<el-form-item
v-for="item in searchParams"
:key="'serach' + item.keyName"
:label="item.field"
:prop="item.keyName"
>
<template v-if="item.type == 'input'">
<el-input v-model="item.value"
style="width: 240px"
size="small"
clearable
:placeholder="item.placeholder || '请输入'">
<el-input
v-model="item.value"
style="width: 240px"
size="small"
clearable
:placeholder="item.placeholder || '请输入'"
>
</el-input>
</template>
<template v-else-if="item.type == 'select'">
<el-select v-model="item.value"
:placeholder="item.placeholder || '请选择'"
size="small"
clearable
style="width: 240px"
:multiple="item.multiple || false">
<el-option v-for="item in item.optionList"
:key="'serach' + item.keyName + item.value"
:label="item.label"
:value="item.value">
<el-select
v-model="item.value"
:placeholder="item.placeholder || '请选择'"
size="small"
clearable
style="width: 240px"
:multiple="item.multiple || false"
>
<el-option
v-for="item in item.optionList"
:key="'serach' + item.keyName + item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</template>
<template v-else-if="item.type == 'cascader'">
<el-cascader v-model="item.value"
:placeholder="item.placeholder || '请选择'"
:options="item.optionList"
:props="item.optionProps"
:show-all-levels="false"
size="small"
clearable
style="width: 240px"
@change="(e) => handleChangeCascader(e, item)">
<el-cascader
v-model="item.value"
:placeholder="item.placeholder || '请选择'"
:options="item.optionList"
:props="item.optionProps"
:show-all-levels="false"
size="small"
clearable
style="width: 240px"
@change="(e) => handleChangeCascader(e, item)"
>
</el-cascader>
</template>
<template v-if="item.type == 'date-range'">
<el-date-picker v-model="item.supValues[0]"
type="date"
placeholder="开始时间"
style="width: 150px"
value-format="yyyy-MM-dd"
clearable>
<el-date-picker
v-model="item.supValues[0]"
type="date"
placeholder="开始时间"
style="width: 150px"
value-format="yyyy-MM-dd"
clearable
>
</el-date-picker>
<span style="display: inline-block; margin: 0 10px"></span>
<el-date-picker v-model="item.supValues[1]"
type="date"
placeholder="结束时间"
style="width: 150px"
value-format="yyyy-MM-dd"
clearable>
<el-date-picker
v-model="item.supValues[1]"
type="date"
placeholder="结束时间"
style="width: 150px"
value-format="yyyy-MM-dd"
clearable
>
</el-date-picker>
</template>
</el-form-item>
<el-button style="margin-left: 30px; margin-bottom: 20px"
size="small"
class="diy-button--search"
@click="handleSearch">查询</el-button>
<el-button style="margin-left: 10px; margin-bottom: 20px"
size="small"
class="diy-button--reset"
@click="resetSearch">重置</el-button>
<el-button
style="margin-left: 30px; margin-bottom: 20px"
size="small"
class="diy-button--search"
@click="handleSearch"
>查询</el-button
>
<el-button
style="margin-left: 10px; margin-bottom: 20px"
size="small"
class="diy-button--reset"
@click="resetSearch"
>重置</el-button
>
</div>
</el-form>
</div>
<div class="div_table"
:style="{ height: maxTableHeight + 130 + 'px' }">
<div class="div_table" :style="{ height: maxTableHeight + 130 + 'px' }">
<div class="div_btn">
<el-button class="diy-button--add"
v-if="addUrl"
size="small"
@click="handleAdd">新增</el-button>
<el-button v-if="mubanUrl"
class="btn_upload diy-button--export"
size="small"
@click="handleExportModule('room')">下载模板</el-button>
<el-upload :headers="$getElUploadHeaders()"
v-if="importUrl"
ref="upload"
class="upload-btn"
action="uploadUlr"
:limit="1"
:accept="'.xls,.xlsx'"
:with-credentials="true"
:show-file-list="false"
:auto-upload="true"
:before-upload="beforeExcelUpload"
:http-request="uploadHttpRequest">
<el-button size="small"
class="btn_upload diy-button--delete">导入</el-button>
<el-button
class="diy-button--add"
v-if="addUrl"
size="small"
@click="handleAdd"
>新增</el-button
>
<el-button
v-if="mubanUrl"
class="btn_upload diy-button--export"
size="small"
@click="handleExportModule('room')"
>下载模板</el-button
>
<el-upload
:headers="$getElUploadHeaders()"
v-if="importUrl"
ref="upload"
class="upload-btn"
action="uploadUlr"
:limit="1"
:accept="'.xls,.xlsx'"
:with-credentials="true"
:show-file-list="false"
:auto-upload="true"
:before-upload="beforeExcelUpload"
:http-request="uploadHttpRequest"
>
<el-button size="small" class="btn_upload diy-button--delete"
>导入</el-button
>
</el-upload>
<el-button v-if="exportUrl"
@click="handleExport"
class="btn_upload diy-button--reset"
size="small">导出</el-button>
<el-button
v-if="exportUrl"
@click="handleExport"
class="btn_upload diy-button--reset"
size="small"
>导出</el-button
>
</div>
<el-table ref="ref_table"
:data="tableData"
border
:header-cell-style="{ background: '#2195FE', color: '#FFFFFF' }"
class="table"
style="width: 100%"
:height="maxTableHeight">
<template v-for="item in tableParams"
:prop="item.keyName">
<el-table-column v-if="item.type == 'no'"
:key="'table-no' + item.keyName"
:label="item.field"
fixed="left"
type="index"
align="center"
width="50" />
<el-table-column v-else-if="item.type == 'text'"
:key="'table' + item.keyName"
:prop="item.keyName"
:label="item.field"
align="center"
:width="item.width || ''"
:show-overflow-tooltip="true">
<el-table
ref="ref_table"
:data="tableData"
border
:header-cell-style="{ background: '#2195FE', color: '#FFFFFF' }"
class="table"
style="width: 100%"
:height="maxTableHeight"
>
<template v-for="item in tableParams" :prop="item.keyName">
<el-table-column
v-if="item.type == 'no'"
:key="'table-no' + item.keyName"
:label="item.field"
fixed="left"
type="index"
align="center"
width="50"
/>
<el-table-column
v-else-if="item.type == 'text'"
:key="'table' + item.keyName"
:prop="item.keyName"
:label="item.field"
align="center"
:width="item.width || ''"
:show-overflow-tooltip="true"
>
</el-table-column>
<el-table-column v-else-if="item.type == 'array'"
:key="'table-array' + item.keyName"
:prop="item.keyName"
:label="item.field"
align="center"
:width="item.width || ''"
:show-overflow-tooltip="true">
<el-table-column
v-else-if="item.type == 'array'"
:key="'table-array' + item.keyName"
:prop="item.keyName"
:label="item.field"
align="center"
:width="item.width || ''"
:show-overflow-tooltip="true"
>
<template slot-scope="scope">
{{ scope.row[item.keyName].join(item.arrayDiv || ",") }}
</template>
</el-table-column>
</template>
<el-table-column fixed="right"
label="操作"
align="center"
width="200">
<el-table-column
v-if="operateCol"
fixed="right"
label="操作"
align="center"
width="200"
>
<template slot-scope="scope">
<slot name="listBtnbefore"
v-bind:item="scope.row"></slot>
<el-button v-if="infoUrl && infoAuth(scope.row)"
@click="handleWatch(scope.row)"
type="text"
size="small"
class=".div-table-button--detail">查看</el-button>
<el-button v-if="editUrl && editAuth(scope.row)"
@click="handleEdit(scope.row)"
type="text"
size="small"
class="div-table-button--edit">{{ editBtnName(scope.row) }}</el-button>
<el-popconfirm v-if="delUrl && delAuth(scope.row)"
title="删除之后无法回复,确认删除?"
@onConfirm="handleDelete(scope.row, scope.$index)"
@confirm="handleDelete(scope.row, scope.$index)">
<el-button slot="reference"
type="text"
size="small"
style="margin-left: 10px"
class="div-table-button--delete">删除</el-button>
<slot name="listBtnbefore" v-bind:item="scope.row"></slot>
<el-button
v-if="infoUrl && infoAuth(scope.row)"
@click="handleWatch(scope.row)"
type="text"
size="small"
class=".div-table-button--detail"
>查看</el-button
>
<el-button
v-if="editUrl && editAuth(scope.row)"
@click="handleEdit(scope.row)"
type="text"
size="small"
class="div-table-button--edit"
>{{ editBtnName(scope.row) }}</el-button
>
<el-popconfirm
v-if="delUrl && delAuth(scope.row)"
title="删除之后无法回复,确认删除?"
@onConfirm="handleDelete(scope.row, scope.$index)"
@confirm="handleDelete(scope.row, scope.$index)"
>
<el-button
slot="reference"
type="text"
size="small"
style="margin-left: 10px"
class="div-table-button--delete"
>删除</el-button
>
</el-popconfirm>
<slot name="listBtnSup"
v-bind:item="scope.row"></slot>
<slot name="listBtnSup" v-bind:item="scope.row"></slot>
</template>
</el-table-column>
</el-table>
<div>
<el-pagination @size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page.sync="pageNo"
:page-sizes="[20, 50, 100, 200]"
:page-size="parseInt(pageSize)"
layout="sizes, prev, pager, next, total"
:total="total">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page.sync="pageNo"
:page-sizes="[20, 50, 100, 200]"
:page-size="parseInt(pageSize)"
layout="sizes, prev, pager, next, total"
:total="total"
>
</el-pagination>
</div>
</div>
</div>
<!-- 修改弹出框 -->
<el-dialog v-if="formShow"
:visible.sync="formShow"
:close-on-click-modal="false"
:close-on-press-escape="false"
:title="formTitle"
:width="editParamsDiv ? '1100px' : '850px'"
top="5vh"
class="dialog-h"
@closed="handleClose">
<edit-form v-if="formShow"
ref="editForm"
:idName="idName"
:formId="formId"
:formType="formType"
:infoUrl="infoUrl"
:addUrl="addUrl"
:editUrl="editUrl"
:editParams="editParams"
:editParamsDiv="editParamsDiv"
:editElseRules="editElseRules"
:editFixedParams="editFixedParams"
:formBtnFixed="formBtnFixed"
:editConfig="editConfig"
@close="handleClose"
@afterEdit="handleEditSuccess">
<el-dialog
v-if="formShow"
:visible.sync="formShow"
:close-on-click-modal="false"
:close-on-press-escape="false"
:title="formTitle"
:width="editParamsDiv ? '1100px' : '850px'"
top="5vh"
class="dialog-h"
@closed="handleClose"
>
<edit-form
v-if="formShow"
ref="editForm"
:idName="idName"
:formId="formId"
:formType="formType"
:infoUrl="infoUrl"
:addUrl="addUrl"
:editUrl="editUrl"
:editParams="editParams"
:editParamsDiv="editParamsDiv"
:editElseRules="editElseRules"
:editFixedParams="editFixedParams"
:formBtnFixed="formBtnFixed"
:editConfig="editConfig"
@close="handleClose"
@afterEdit="handleEditSuccess"
>
<template v-slot:bottomSup="{ id, formType, info }">
<slot name="editBottomSup"
v-bind:id="id"
v-bind:formType="formType"
v-bind:info="info"></slot>
<slot
name="editBottomSup"
v-bind:id="id"
v-bind:formType="formType"
v-bind:info="info"
></slot>
</template>
<template v-slot:operateSup="{ id, formType, info }">
<slot name="editOperateSup"
v-bind:id="id"
v-bind:formType="formType"
v-bind:info="info"></slot>
<slot
name="editOperateSup"
v-bind:id="id"
v-bind:formType="formType"
v-bind:info="info"
></slot>
</template>
</edit-form>
</el-dialog>
@ -346,9 +403,14 @@ export default {
type: Boolean,
default: true,
},
operateCol: {
type: Boolean,
default: true,
},
},
data () {
data() {
return {
tableData: [],
@ -366,7 +428,7 @@ export default {
},
computed: {
maxTableHeight () {
maxTableHeight() {
const { ref_search_height } = this;
return this.$store.state.inIframe
? this.clientHeight - ref_search_height - 265 + this.iframeHeight
@ -377,7 +439,7 @@ export default {
watch: {},
async mounted () {
async mounted() {
console.log(this.$store.state);
this.user = this.$store.state.user;
@ -391,19 +453,19 @@ export default {
this.computeSearchHeight();
},
activated () {
activated() {
console.log("-------------activated");
this.$refs["ref_table"].doLayout();
},
methods: {
computeSearchHeight () {
computeSearchHeight() {
this.ref_search_height = this.$refs["ref_search"].clientHeight;
console.log(this.$refs["ref_search"]);
console.log(this.ref_search_height);
},
iniSearchData () {
iniSearchData() {
const { searchParams } = this;
searchParams.forEach((item, index) => {
if (item.type == "select" || item.type == "cascader") {
@ -419,7 +481,7 @@ export default {
});
},
async getFmOptions (index, url, params, cookFn) {
async getFmOptions(index, url, params, cookFn) {
const { data, code, msg } = await requestPost(url, {
...params,
});
@ -432,19 +494,19 @@ export default {
}
},
handleChangeCascader (vals, item) {
handleChangeCascader(vals, item) {
if (typeof item.handleChangeFn == "function") {
item.handleChangeFn(vals, item);
}
},
handleSearch (val) {
handleSearch(val) {
this.pageNo = 1;
this.getTableData();
},
beforeExcelUpload (file) {
beforeExcelUpload(file) {
console.log("file", file);
const isType = file.type === "application/vnd.ms-excel";
const isTypeComputer =
@ -462,7 +524,7 @@ export default {
return fileType && isLt1M;
},
async uploadHttpRequest (file) {
async uploadHttpRequest(file) {
let { importUrl: url } = this;
if (!url) return;
@ -491,7 +553,7 @@ export default {
});
},
async handleExportModule () {
async handleExportModule() {
let { mubanUrl: url } = this;
if (!url) return;
@ -528,7 +590,7 @@ export default {
});
},
async handleExport () {
async handleExport() {
const { exportUrl: url } = this;
if (!url) return;
@ -566,13 +628,13 @@ export default {
});
},
handleAdd () {
handleAdd() {
this.formType = "add";
this.formTitle = "新增";
this.formShow = true;
},
handleWatch (row) {
handleWatch(row) {
const { idName } = this;
this.formType = "watch";
this.formId = row[idName];
@ -580,7 +642,7 @@ export default {
this.formShow = true;
},
handleEdit (row) {
handleEdit(row) {
const { idName } = this;
this.formType = "edit";
this.formId = row[idName];
@ -588,17 +650,17 @@ export default {
this.formShow = true;
},
handleClose () {
handleClose() {
this.formShow = false;
this.getTableData();
},
handleEditSuccess () {
handleEditSuccess() {
this.handleClose();
// this.getTableData();
},
async handleDelete (rowData, rowIndex) {
async handleDelete(rowData, rowIndex) {
console.log(rowData, rowIndex);
let { delUrl: url } = this;
if (!url) return;
@ -621,7 +683,7 @@ export default {
}
},
computeFmData () {
computeFmData() {
let fmData = {};
this.searchParams.forEach((item) => {
fmData[item.keyName] = item.value;
@ -634,11 +696,11 @@ export default {
return fmData;
},
refresh () {
refresh() {
this.getTableData();
},
async getTableData () {
async getTableData() {
const { tableUrl: url } = this;
if (!url) return;
@ -653,25 +715,25 @@ export default {
this.total = data.total || 0;
this.tableData = data.list
? data.list.map((item) => {
return item;
})
return item;
})
: [];
} else {
this.$message.error(msg);
}
},
handleSizeChange (val) {
handleSizeChange(val) {
this.pageSize = val;
window.localStorage.setItem("pageSize", val);
this.getTableData();
},
handleCurrentChange (val) {
handleCurrentChange(val) {
this.pageNo = val;
this.getTableData();
},
resetSearch () {
resetSearch() {
console.log("----------------resetSearch", this.searchParams);
this.searchParams.forEach((item) => {
if (typeof item.value == "string") {

108
src/views/modules/renFangTongJi/cpts/shequtongji.vue

@ -0,0 +1,108 @@
<template>
<div v-if="iniLoaded">
<base-page
:searchParams="searchParams"
:tableParams="tableParams"
:tableUrl="tableUrl"
:operateCol="false"
idName="icDangerousChemicalsId"
></base-page>
</div>
</template>
<script>
import basePage from "@/views/modules/cpts/base/index";
import { getItemByIdInCascader, collapse } from "@/utils/cascader";
export default {
props: {
orgId: {
type: String,
default: "",
},
orgIds: {
type: String,
default: "",
},
},
data() {
return {
iniLoaded: false,
searchParams: [
{
field: "选择范围",
keyName: "org",
type: "cascader",
value: "",
// optionUrl: "/gov/org/customeragency/agencygridtree",
optionUrl: "/gov/org/customeragency/my-subagency-list",
optionUrlParams: {
agencyId: this.$store.state.user.agencyId,
},
optionList: [],
optionProps: {
multiple: false,
value: "agencyId",
label: "agencyName",
children: "subAgencyList",
checkStrictly: true,
},
optionCook(obj) {
return [obj];
},
supKeys: ["orgId", "orgType"],
supValues: ["", ""],
handleChangeFn(vals, item) {
const { optionList } = item;
if (vals.length > 0) {
item["supValues"][0] = vals[vals.length - 1];
item["supValues"][1] = getItemByIdInCascader(
optionList,
vals,
"agencyId",
"subAgencyList"
)[vals.length - 1]["level"];
item["supValues"][1] =
item["supValues"][1] == "grid" ? "grid" : "agency";
} else {
item["supValues"][0] = "";
item["supValues"][1] = "";
}
},
},
],
tableParams: [
{ field: "序号", keyName: "", type: "no" },
{ field: "所属组织", keyName: "orgName", type: "text", width: "220" },
{ field: "人口总数", keyName: "userTotal", type: "text" },
{ field: "常住人口数", keyName: "czUserTotal", type: "text" },
{ field: "流动人口数", keyName: "ldUserTotal", type: "text" },
{ field: "房屋总数", keyName: "houseTotal", type: "text" },
{ field: "自住房屋数", keyName: "zzHouseTotal", type: "text" },
{ field: "出租房屋数", keyName: "czHouseTotal", type: "text" },
{ field: "闲置房屋数", keyName: "xzHouseTotal", type: "text" },
],
tableUrl: "/gov/org/house/usingCommunityUserHouseStats",
};
},
components: { basePage },
computed: {},
watch: {},
async mounted() {
this.searchParams[0].value = this.orgIds;
this.searchParams[0].supValues[0] = this.orgId;
if (this.orgId) {
this.searchParams[0].supValues[1] = "agency";
}
this.iniLoaded = true;
},
methods: {},
};
</script>
<style lang="scss" scoped></style>

88
src/views/modules/renFangTongJi/index.vue

@ -1,7 +1,12 @@
<template>
<el-card class="g-cnt">
<div class="m-cards">
<div class="item" :key="item.name" v-for="item in list">
<div
class="item"
:key="item.name"
@click="handleClickCard(item)"
v-for="item in list"
>
<div class="item-left">
<div class="num">{{ item.num }}</div>
<div class="name">{{ item.name }}</div>
@ -24,46 +29,79 @@
style="width: 100%"
class="tb"
:height="maxTableHeight"
align="center"
>
<el-table-column label="序号" type="index" align="center" width="50" />
<el-table-column prop="orgName" label="所属组织"> </el-table-column>
<el-table-column prop="usingCommunityNum" label="开通平台社区数">
<el-table-column
prop="orgName"
label="所属组织"
width="150"
align="center"
>
</el-table-column>
<el-table-column
prop="usingCommunityNum"
label="开通平台社区数"
align="center"
>
<template slot-scope="scope">
<a style="cursor: pointer" @click="showDetail(scope.row.orgId)">{{
scope.row.usingCommunityNum
}}</a>
</template>
</el-table-column>
<el-table-column prop="userTotal" label="人口总数"></el-table-column>
<el-table-column
prop="userTotal"
label="人口总数"
align="center"
></el-table-column>
<el-table-column
prop="czUserTotal"
label="常住人口总数"
align="center"
></el-table-column>
<el-table-column
prop="ldUserTotal"
label="流动人口总数"
align="center"
></el-table-column>
<el-table-column
prop="houseTotal"
label="房屋总数"
align="center"
></el-table-column>
<el-table-column prop="houseTotal" label="房屋总数"></el-table-column>
<el-table-column
prop="zzHouseTotal"
label="自住房屋总数"
align="center"
></el-table-column>
<el-table-column
prop="czHouseTotal"
label="出租房屋总数"
align="center"
></el-table-column>
<el-table-column
prop="xzHouseTotal"
label="闲置房屋总数"
align="center"
></el-table-column>
</el-table>
</div>
<!-- 修改弹出框 -->
<el-dialog
:visible.sync="displayedDetail"
:close-on-click-modal="false"
:close-on-press-escape="false"
title="开放社区数"
width="850px"
v-if="displayedDetail"
:visible="true"
title="社区列表 "
width="1150px"
top="5vh"
@closed="displayedDetail = false"
@close="displayedDetail = false"
>
<shequtongji
ref="shequtongji"
:orgId="detailOrgId"
:orgIds="[orgId, detailOrgId]"
/>
</el-dialog>
</el-card>
</template>
@ -72,10 +110,11 @@
import { requestPost } from "@/js/dai/request";
import nextTick from "dai-js/tools/nextTick";
import { mapGetters } from "vuex";
import shequtongji from "./cpts/shequtongji";
export default {
name: "renFangTongJi",
components: {},
components: { shequtongji },
data() {
return {
displayedDetail: false,
@ -84,6 +123,8 @@ export default {
orgId: "",
orgType: "",
detailOrgId: "",
list: [
{
name: "开通平台社区数",
@ -161,6 +202,17 @@ export default {
this.getTableData();
},
methods: {
handleClickCard(item) {
if (item.name == "开通平台社区数") {
this.showDetail();
}
},
async showDetail(orgId = "") {
this.displayedDetail = true;
this.detailOrgId = orgId;
},
async getCommunityData() {
const url = "/gov/org/agency/usingCommunityStats";
@ -188,6 +240,8 @@ export default {
if (code === 0) {
const { list } = this;
this.orgId = data.orgId;
this.orgType = data.orgType;
let item1 = list.find((item) => item.name == "人口总数");
item1.num = data.userTotal;
item1.variation = parseInt(data.userTotalJSY);
@ -253,24 +307,26 @@ export default {
</script>
<style lang="scss" scoped>
@import "@/assets/scss/c/config";
@import "@/assets/scss/c/function";
@import "@/assets/scss/c/config.scss";
@import "@/assets/scss/c/function.scss";
.m-cards {
display: flex;
flex-wrap: wrap;
// align-items: center;
align-items: center;
justify-content: space-between;
.item {
display: flex;
width: 24%;
margin-top: 15px;
margin-right: 1%;
// margin-right: 1%;
box-sizing: border-box;
color: #ffffff;
padding: 12px;
border-radius: 4px;
background-image: linear-gradient(to left, #43c8c4, #2aa5c6);
cursor: pointer;
.item-right {
margin-left: auto;

Loading…
Cancel
Save