elink-star
/
epmet-work-pc
17
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

优化

V1.0
dai 3 years ago
parent
093c54e0f5
commit
19c835c585
3 changed files with 706 additions and 605 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 10
      src/assets/scss/modules/index.scss
  2. 881
      src/views/modules/home/index.vue
  3. 420
      src/views/modules/home/notice.vue

10
src/assets/scss/modules/index.scss
View File

@ -323,6 +323,16 @@
border-radius: 2px; border-radius: 2px;
overflow: hidden; overflow: hidden;
.empty {
text-align: center;
color: #999;
img {
display: block;
width: 120px;
margin: 100px auto 20px;
}
}
.item { .item {
padding: 16px 0 12px; padding: 16px 0 12px;
border-bottom: 1px dashed #f0f5fa; border-bottom: 1px dashed #f0f5fa;

881
src/views/modules/home/index.vue
View File

@ -1,215 +1,282 @@
<template> <template>
<div> <div>
<div class="g-row"> <div class="g-row">
<div class="g-row-left"> <div class="g-row-left">
<div class="m-box m-search"> <div class="m-box m-search">
<div class="wrap"> <div class="wrap">
<div class="title"> <div class="title">
<span>社区查询</span> <span>社区查询</span>
</div> </div>
<div class="tabs"> <div class="tabs">
<div <div
:class="{ 'z-on': searchData.type == 'jumin' }" :class="{ 'z-on': searchData.type == 'jumin' }"
@click="searchData.type = 'jumin'" @click="searchData.type = 'jumin'"
> >
查居民 查居民
</div> </div>
<div <div
:class="{ 'z-on': searchData.type == 'fangwu' }" :class="{ 'z-on': searchData.type == 'fangwu' }"
@click="searchData.type = 'fangwu'" @click="searchData.type = 'fangwu'"
> >
查房屋 查房屋
</div> </div>
</div> </div>
<div class="search"> <div class="search">
<div class="search-input"> <div class="search-input">
<div class="input"> <div class="input">
<input <input
type="text" type="text"
:placeholder="typePlaceholder[searchData.type]" :placeholder="
v-model="searchData.searchKey" typePlaceholder[searchData.type]
@keyup.enter="handleClickSearchBtn" "
/> v-model="searchData.searchKey"
@keyup.enter="handleClickSearchBtn"
<div />
class="close-btn"
v-if="searchData.searchKey != ''" <div
@click="searchData.searchKey = ''" class="close-btn"
> v-if="searchData.searchKey != ''"
<img src="@/assets/img/shequ/close.png" /> @click="searchData.searchKey = ''"
</div> >
</div> <img
<div class="btn" @click="handleClickSearchBtn">查一下</div> src="@/assets/img/shequ/close.png"
</div> />
<div class="btn2" @click="handleClickSearchBtn"> </div>
<img src="@/assets/images/index/i-search.png" /> </div>
智能搜索 <div class="btn" @click="handleClickSearchBtn">
</div> 查一下
</div> </div>
</div> </div>
</div> <div class="btn2" @click="handleClickSearchBtn">
<img src="@/assets/images/index/i-search.png" />
<div class="m-box m-pan"> 智能搜索
<div class="wrap"> </div>
<div class="header"> </div>
<img src="@/assets/images/index/title-icon-sqzl.png" /> </div>
<span>社区总览</span> </div>
</div>
<div class="cnt"> <div class="m-box m-pan">
<div class="cnt-left"> <div class="wrap">
<div class="subtitle"> <div class="header">
<img src="@/assets/images/index/i-sqjj.png" /> <img
<span>社区简介</span> src="@/assets/images/index/title-icon-sqzl.png"
</div> />
<p> <span>社区总览</span>
{{ pandectData.deptName }}，<span v-if="pandectData.gridCount" </div>
>划分为{{ pandectData.underCount }}个{{ <div class="cnt">
pandectData.underName <div class="cnt-left">
}}，</span <div class="subtitle">
>现有居民{{ pandectData.homeCount }}户、{{ <img
pandectData.resiCount src="@/assets/images/index/i-sqjj.png"
}}人，其中常住人口{{ />
pandectData.permanentResiCount <span>社区简介</span>
}}人，流动人口{{ </div>
pandectData.floatingResiCount <p>
}}人，各类群体分布如下： {{ pandectData.deptName }}，<span
</p> v-if="pandectData.gridCount"
>划分为{{ pandectData.underCount }}个{{
<div class="subtitle"> pandectData.underName
<img src="@/assets/images/index/i-fxjg.png" /> }}，</span
<span>分析结果</span> >现有居民{{ pandectData.homeCount }}户、{{
</div> pandectData.resiCount
}}人，其中常住人口{{
<p class="hint" v-if="resiCategory.list.length > 0"> pandectData.permanentResiCount
<i>*</i> 根据数据分析结果，建议重点关注 }}人，流动人口{{
<b pandectData.floatingResiCount
>{{ resiCategory.list[0].name }}、{{ }}人，各类群体分布如下：
resiCategory.list[1].name </p>
}}、{{ resiCategory.list[2].name }}</b
> <div class="subtitle">
三类群体，开展相关的社区服务和活动。 <img
</p> src="@/assets/images/index/i-fxjg.png"
</div> />
<div class="cnt-right"> <span>分析结果</span>
<div class="list"> </div>
<div
class="item" <p
@click="handleClickCategory(item)" class="hint"
:key="item.code" v-if="resiCategory.list.length > 0"
v-for="(item, index) in resiCategory.list" >
> <i>*</i> 根据数据分析结果，建议重点关注
<div>{{ ("0" + (index + 1)).substr(-2) }}.</div> <b
<div class="item-name">{{ item.name }}</div> >{{ resiCategory.list[0].name }}、{{
<div class="item-div"></div> resiCategory.list[1].name
<div class="item-count">{{ item.count }}人</div> }}、{{ resiCategory.list[2].name }}</b
<div class="item-progress"> >
<b :style="{ width: item.per + '%' }"></b> 三类群体，开展相关的社区服务和活动。
</div> </p>
<div class="item-per">{{ item.per }} %</div> </div>
</div> <div class="cnt-right">
</div> <div class="list">
</div> <div
</div> class="item"
</div> @click="handleClickCategory(item)"
</div> :key="item.code"
</div> v-for="(
item, index
<div class="g-row-right"> ) in resiCategory.list"
<div class="m-box m-tx"> >
<div class="wrap"> <div>
<div class="header"> {{
<img src="@/assets/images/index/title-icon-zntx.png" /> ("0" + (index + 1)).substr(-2)
<span>智能提醒</span> }}.
</div> </div>
<div class="more" @click="toNoticePage">更多></div> <div class="item-name">
<div class="cnt"> {{ item.name }}
<div </div>
@click="handleClickNotice(item)" <div class="item-div"></div>
class="item" <div class="item-count">
:key="'notice' + item.targetId + index" {{ item.count }}人
v-for="(item, index) in noticeData" </div>
> <div class="item-progress">
<div class="item-date">{{ item.createdTime }}</div> <b
<div class="item-title"> :style="{
{{ item.content }} width: item.per + '%',
</div> }"
</div> ></b>
</div> </div>
</div> <div class="item-per">
</div> {{ item.per }} %
<div class="m-box m-tb"> </div>
<div class="wrap"> </div>
<div class="header"> </div>
<img src="@/assets/images/index/title-icon-zntb.png" /> </div>
<span>智能填报</span> </div>
</div> </div>
</div> </div>
<div class="more">更多></div> </div>
<div class="cnt">
<div class="item"> <div class="g-row-right">
<img class="item-tag" src="@/assets/images/index/i-zntb.png" /> <div class="m-box m-tx">
<div class="item-name">《80-90周岁高龄老人生活补助申请表》</div> <div class="wrap">
<div class="item-btns"> <div class="header">
<div class="item-btn"> <img
<img src="@/assets/images/index/i-tx.png" /> src="@/assets/images/index/title-icon-zntx.png"
<span>填写</span> />
</div> <span>智能提醒</span>
<div class="item-btn"> </div>
<img src="@/assets/images/index/i-xz.png" /> <div class="more" @click="toNoticePage">更多></div>
<span>下载</span> <div class="cnt" v-if="noticeData.length > 0">
</div> <div
</div> @click="handleClickNotice(item)"
</div> class="item"
<div class="item"> :key="'notice' + item.targetId + index"
<img class="item-tag" src="@/assets/images/index/i-zntb.png" /> v-for="(item, index) in noticeData"
<div class="item-name">《80-90周岁高龄老人生活补助申请表》</div> >
<div class="item-btns"> <div class="item-date">
<div class="item-btn"> {{ item.createdTime }}
<img src="@/assets/images/index/i-tx.png" /> </div>
<span>填写</span> <div class="item-title">
</div> {{ item.content }}
<div class="item-btn"> </div>
<img src="@/assets/images/index/i-xz.png" /> </div>
<span>下载</span> </div>
</div>
</div> <div class="cnt" v-else>
</div> <div class="empty">
<div class="item"> <img
<img class="item-tag" src="@/assets/images/index/i-zntb.png" /> src="~@/assets/images/shuju/renfang/index/empty.png"
<div class="item-name">《80-90周岁高龄老人生活补助申请表》</div> />
<div class="item-btns"> <span>暂无提醒～</span>
<div class="item-btn"> </div>
<img src="@/assets/images/index/i-tx.png" /> </div>
<span>填写</span> </div>
</div> </div>
<div class="item-btn"> <div class="m-box m-tb">
<img src="@/assets/images/index/i-xz.png" /> <div class="wrap">
<span>下载</span> <div class="header">
</div> <img
</div> src="@/assets/images/index/title-icon-zntb.png"
</div> />
<div class="item"> <span>智能填报</span>
<img class="item-tag" src="@/assets/images/index/i-zntb.png" /> </div>
<div class="item-name">《80-90周岁高龄老人生活补助申请表》</div> </div>
<div class="item-btns"> <div class="more">更多></div>
<div class="item-btn"> <div class="cnt">
<img src="@/assets/images/index/i-tx.png" /> <div class="item">
<span>填写</span> <img
</div> class="item-tag"
<div class="item-btn"> src="@/assets/images/index/i-zntb.png"
<img src="@/assets/images/index/i-xz.png" /> />
<span>下载</span> <div class="item-name">
</div> 《80-90周岁高龄老人生活补助申请表》
</div> </div>
</div> <div class="item-btns">
</div> <div class="item-btn">
</div> <img src="@/assets/images/index/i-tx.png" />
</div> <span>填写</span>
</div> </div>
<fastcall ref="fastcall" /> <div class="item-btn">
</div> <img src="@/assets/images/index/i-xz.png" />
<span>下载</span>
</div>
</div>
</div>
<div class="item">
<img
class="item-tag"
src="@/assets/images/index/i-zntb.png"
/>
<div class="item-name">
《80-90周岁高龄老人生活补助申请表》
</div>
<div class="item-btns">
<div class="item-btn">
<img src="@/assets/images/index/i-tx.png" />
<span>填写</span>
</div>
<div class="item-btn">
<img src="@/assets/images/index/i-xz.png" />
<span>下载</span>
</div>
</div>
</div>
<div class="item">
<img
class="item-tag"
src="@/assets/images/index/i-zntb.png"
/>
<div class="item-name">
《80-90周岁高龄老人生活补助申请表》
</div>
<div class="item-btns">
<div class="item-btn">
<img src="@/assets/images/index/i-tx.png" />
<span>填写</span>
</div>
<div class="item-btn">
<img src="@/assets/images/index/i-xz.png" />
<span>下载</span>
</div>
</div>
</div>
<div class="item">
<img
class="item-tag"
src="@/assets/images/index/i-zntb.png"
/>
<div class="item-name">
《80-90周岁高龄老人生活补助申请表》
</div>
<div class="item-btns">
<div class="item-btn">
<img src="@/assets/images/index/i-tx.png" />
<span>填写</span>
</div>
<div class="item-btn">
<img src="@/assets/images/index/i-xz.png" />
<span>下载</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<fastcall ref="fastcall" />
</div>
</template> </template>
<script> <script>
@ -220,201 +287,203 @@ import nextTick from "dai-js/tools/nextTick";
import fastcall from "@/views/modules/cpts/fastcall"; import fastcall from "@/views/modules/cpts/fastcall";
export default { export default {
components: { fastcall }, components: { fastcall },
data() { data() {
return { return {
searchStatus: "ini", //ing over searchStatus: "ini", //ing over
searchData: { searchData: {
type: "jumin", type: "jumin",
searchKey: "", searchKey: "",
}, },
typePlaceholder: { typePlaceholder: {
jumin: "请输入姓名或电话或身份证号", jumin: "请输入姓名或电话或身份证号",
fangwu: "请输入“小区名称，楼号”，如：亿联小区，1号楼", fangwu: "请输入“小区名称，楼号”，如：亿联小区，1号楼",
xuqiu: "请输入需求人或需求内容或服务方", xuqiu: "请输入需求人或需求内容或服务方",
}, },
resiCategory: { resiCategory: {
loading: false, loading: false,
total: "", total: "",
list: [], list: [],
}, },
orgData: { orgData: {
id: "", id: "",
level: "agency", level: "agency",
}, },
pandectData: { pandectData: {
communityName: "", communityName: "",
streetName: "", streetName: "",
gridCount: "", gridCount: "",
resiCount: "", resiCount: "",
homeCount: "", homeCount: "",
floatingResiCount: "", floatingResiCount: "",
permanentResiCount: "", permanentResiCount: "",
}, },
noticeData: [], noticeData: [],
}; };
}, },
computed: { computed: {
maxTableHeight() { maxTableHeight() {
// return this.clientHeight - 450; // return this.clientHeight - 450;
return 420; return 420;
}, },
...mapGetters(["clientHeight"]), ...mapGetters(["clientHeight"]),
}, },
watch: { watch: {
"searchData.searchKey": function (val) { "searchData.searchKey": function (val) {
if (val == "") { if (val == "") {
this.searchStatus = "ini"; this.searchStatus = "ini";
} }
}, },
}, },
mounted() { mounted() {
this.getApiData(); this.getApiData();
console.log( console.log(
"dynamicMenuRoutes----------------------------", "dynamicMenuRoutes----------------------------",
this.$store.state.sidebarMenuList this.$store.state.sidebarMenuList
); );
}, },
methods: { methods: {
handleClickCategory(item) { handleClickCategory(item) {
this.$router.push({ this.$router.push({
path: "/main/base-resi", path: "/main/base-resi",
query: { query: {
category: item.code, category: item.code,
}, },
}); });
}, },
handleClickNotice(item) { handleClickNotice(item) {
const { msgType, targetId } = item; const { msgType, targetId } = item;
if (msgType == "community_house") { if (msgType == "community_house") {
this.$refs.fastcall.showHouseInfo(targetId); this.$refs.fastcall.showHouseInfo(targetId);
} else if (msgType == "resident_base_info") { } else if (msgType == "resident_base_info") {
this.$refs.fastcall.showResiInfo(targetId); this.$refs.fastcall.showResiInfo(targetId);
} }
}, },
toNoticePage() { toNoticePage() {
this.$router.push({ this.$router.push({
path: "/main/home-notice", path: "/main/home-notice",
}); });
}, },
toSearchPage(type, searchKey) { toSearchPage(type, searchKey) {
this.$router.push({ this.$router.push({
path: "/main/shequ-chaxun", path: "/main/shequ-chaxun",
query: { query: {
type, type,
searchKey, searchKey,
}, },
}); });
}, },
handleClickSearchBtn() { handleClickSearchBtn() {
const { const {
searchData: { type, searchKey }, searchData: { type, searchKey },
} = this; } = this;
if (!searchKey) return this.$message.error("请输入搜索条件"); if (!searchKey) return this.$message.error("请输入搜索条件");
this.toSearchPage(type, searchKey); this.toSearchPage(type, searchKey);
}, },
async getApiData() { async getApiData() {
await this.getOrgData(); await this.getOrgData();
this.getWarningList(); this.getWarningList();
this.getPandectData(); this.getPandectData();
this.getNoticeData(); this.getNoticeData();
}, },
//加载组织数据 //加载组织数据
async getOrgData() { async getOrgData() {
const url = "/gov/org/agency/maporg"; const url = "/gov/org/agency/maporg";
let params = { let params = {
orgId: "", orgId: "",
level: "", level: "",
}; };
const { data, code, msg } = await requestPost(url, params); const { data, code, msg } = await requestPost(url, params);
if (code === 0) { if (code === 0) {
this.orgData = data; this.orgData = data;
} else { } else {
this.$message.error(msg); this.$message.error(msg);
} }
}, },
//加载组织数据 //加载组织数据
async getPandectData() { async getPandectData() {
const url = "/actual/base/residentHouseMerge/communityOverview"; const url = "/actual/base/residentHouseMerge/communityOverview";
let params = { let params = {
// orgId: "", // orgId: "",
// level: "", // level: "",
}; };
const { data, code, msg } = await requestGet(url, params); const { data, code, msg } = await requestGet(url, params);
if (code === 0) { if (code === 0) {
if (data) { if (data) {
this.pandectData = data; this.pandectData = data;
} }
} else { } else {
this.$message.error(msg); this.$message.error(msg);
} }
}, },
//加载组织数据 //加载组织数据
async getNoticeData() { async getNoticeData() {
const url = "/message/intelligentMessage/list"; const url = "/message/intelligentMessage/list";
let params = { let params = {
last: "6", last: "6",
}; };
const { data, code, msg } = await requestGet(url, params); const { data, code, msg } = await requestGet(url, params);
if (code === 0) { if (code === 0) {
if (data) { if (data) {
this.noticeData = data; this.noticeData = data;
} }
} else { } else {
this.$message.error(msg); this.$message.error(msg);
} }
}, },
//加载组织数据 //加载组织数据
async getWarningList() { async getWarningList() {
const url = "/actual/base/resiCategory/categoryCountList"; const url = "/actual/base/resiCategory/categoryCountList";
let params = { let params = {
// id: this.orgData.id, // id: this.orgData.id,
// level: "agency", // level: "agency",
}; };
this.resiCategory.loading = true; this.resiCategory.loading = true;
const { data, code, msg } = await requestGet(url, params); const { data, code, msg } = await requestGet(url, params);
this.resiCategory.loading = false; this.resiCategory.loading = false;
if (code === 0) { if (code === 0) {
if (data) { if (data) {
this.resiCategory.count = data.resiCount; this.resiCategory.count = data.resiCount;
this.resiCategory.list = data.categoryList.map((item) => { this.resiCategory.list = data.categoryList.map((item) => {
return { return {
code: item.categoryName, code: item.categoryName,
name: resiCategoryMap[item.categoryName] || "", name: resiCategoryMap[item.categoryName] || "",
count: item.categoryCount, count: item.categoryCount,
per: parseInt((100 * item.categoryCount) / data.resiCount), per: parseInt(
const: "const", (100 * item.categoryCount) / data.resiCount
}; ),
}); const: "const",
} };
} else { });
this.$message.error(msg); }
} } else {
}, this.$message.error(msg);
}, }
},
},
}; };
</script> </script>

420
src/views/modules/home/notice.vue
View File

@ -1,50 +1,59 @@
<template> <template>
<div> <div>
<div class="m-tx"> <div class="m-tx">
<div class="wrap"> <div class="wrap">
<div class="tabs"> <div class="tabs">
<el-tabs v-model="type" @tab-click="handleClickTab"> <el-tabs v-model="type" @tab-click="handleClickTab">
<el-tab-pane label="全部" name="all"></el-tab-pane> <el-tab-pane label="全部" name="all"></el-tab-pane>
<el-tab-pane label="已读" name="readed"></el-tab-pane> <el-tab-pane label="已读" name="readed"></el-tab-pane>
<el-tab-pane label="未读" name="unreaded"></el-tab-pane> <el-tab-pane label="未读" name="unreaded"></el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>
<!-- <div class="btn-clear">清除未读</div> --> <!-- <div class="btn-clear">清除未读</div> -->
<div class="cnt"> <div class="cnt" v-if="noticeData.length > 0">
<div <div
@click="handleClickNotice(item, index)" @click="handleClickNotice(item, index)"
:class="{ 'z-readed': item.readFlag == 1 }" :class="{ 'z-readed': item.readFlag == 1 }"
class="item" class="item"
:key="'notice' + item.targetId + index" :key="'notice' + item.targetId + index"
v-for="(item, index) in noticeData" v-for="(item, index) in noticeData"
> >
<img <img
class="item-tag" class="item-tag"
src="@/assets/images/index/title-icon-zntb.png" src="@/assets/images/index/title-icon-zntb.png"
/> />
<div class="item-title"> <div class="item-title">
{{ item.content }} {{ item.content }}
</div> </div>
<div class="item-date">{{ item.createdTime }}</div> <div class="item-date">{{ item.createdTime }}</div>
</div> </div>
</div> </div>
<div> <div class="cnt" v-else>
<el-pagination <div class="empty">
@size-change="handleSizeChange" <img
@current-change="handleCurrentChange" src="~@/assets/images/shuju/renfang/index/empty.png"
:current-page.sync="pageNo" />
:page-sizes="[20, 50, 100, 200]" <span>暂无提醒～</span>
:page-size="parseInt(pageSize)" </div>
layout="sizes, prev, pager, next, total" </div>
:total="total"
> <div>
</el-pagination> <el-pagination
</div> @size-change="handleSizeChange"
</div> @current-change="handleCurrentChange"
</div> :current-page.sync="pageNo"
<fastcall ref="fastcall" /> :page-sizes="[20, 50, 100, 200]"
</div> :page-size="parseInt(pageSize)"
layout="sizes, prev, pager, next, total"
:total="total"
>
</el-pagination>
</div>
</div>
</div>
<fastcall ref="fastcall" />
</div>
</template> </template>
<script> <script>
@ -53,88 +62,90 @@ import nextTick from "dai-js/tools/nextTick";
import fastcall from "@/views/modules/cpts/fastcall"; import fastcall from "@/views/modules/cpts/fastcall";
export default { export default {
components: { fastcall }, components: { fastcall },
data() { data() {
return { return {
type: "all", type: "all",
pageNo: 1, pageNo: 1,
pageSize: window.localStorage.getItem("pageSize") || 20, pageSize: window.localStorage.getItem("pageSize") || 20,
total: 1, total: 1,
noticeData: [], noticeData: [],
}; };
}, },
computed: {}, computed: {},
watch: {}, watch: {},
mounted() { mounted() {
this.getList(); this.getList();
}, },
methods: { methods: {
handleClickNotice(item, index) { handleClickNotice(item, index) {
const { msgType, targetId } = item; const { msgType, targetId } = item;
if (msgType == "community_house") { if (msgType == "community_house") {
this.$refs.fastcall.showHouseInfo(targetId); this.$refs.fastcall.showHouseInfo(targetId);
} else if (msgType == "resident_base_info") { } else if (msgType == "resident_base_info") {
this.$refs.fastcall.showResiInfo(targetId); this.$refs.fastcall.showResiInfo(targetId);
} }
this.read(item, index); this.read(item, index);
}, },
async read(item) { async read(item) {
if (item.readFlag == 1) return; if (item.readFlag == 1) return;
const url = "/message/intelligentMessage/msg/clear"; const url = "/message/intelligentMessage/msg/clear";
let params = { let params = {
id: item.id, id: item.id,
}; };
const { data, code, msg } = await requestPost(url, params); const { data, code, msg } = await requestPost(url, params);
if (code === 0) { if (code === 0) {
this.noticeData[index].readFlag = 1; const { noticeData } = this;
console.log("消息已读"); noticeData[index].readFlag = 1;
} else { this.noticeData = noticeData;
this.$message.error(msg); console.log("消息已读");
} } else {
}, this.$message.error(msg);
}
handleClickTab(type) { },
console.log(type);
this.getList(); handleClickTab(type) {
}, console.log(type);
handleSizeChange(val) { this.getList();
this.pageSize = val; },
localStorage.setItem("pageSize", val); handleSizeChange(val) {
this.getList(); this.pageSize = val;
}, localStorage.setItem("pageSize", val);
handleCurrentChange(val) { this.getList();
this.pageNo = val; },
this.getList(); handleCurrentChange(val) {
}, this.pageNo = val;
//加载组织数据 this.getList();
async getList() { },
const url = "/message/intelligentMessage/page"; //加载组织数据
let params = { async getList() {
page: this.pageNo, const url = "/message/intelligentMessage/page";
limit: this.pageSize, let params = {
}; page: this.pageNo,
const { type } = this; limit: this.pageSize,
if (type == "readed") { };
params.readFlag = 1; const { type } = this;
} else if (type == "unreaded") { if (type == "readed") {
params.readFlag = 0; params.readFlag = 1;
} } else if (type == "unreaded") {
params.readFlag = 0;
const { data, code, msg } = await requestGet(url, params); }
if (code === 0) { const { data, code, msg } = await requestGet(url, params);
this.total = data.total;
this.noticeData = data.list; if (code === 0) {
} else { this.total = data.total;
this.$message.error(msg); this.noticeData = data.list;
} } else {
}, this.$message.error(msg);
}, }
},
},
}; };
</script> </script>
@ -142,82 +153,93 @@ export default {
@import "~@/assets/scss/c/function.scss"; @import "~@/assets/scss/c/function.scss";
.m-tx { .m-tx {
position: relative; position: relative;
margin: 10px 6px; margin: 10px 6px;
padding: 12px 20px; padding: 12px 20px;
background: #ffffff; background: #ffffff;
box-shadow: 0px 6px 16px 0px rgba(0, 0, 0, 0.08), box-shadow: 0px 6px 16px 0px rgba(0, 0, 0, 0.08),
0px 3px 6px -4px rgba(0, 0, 0, 0.12); 0px 3px 6px -4px rgba(0, 0, 0, 0.12);
border-radius: 2px; border-radius: 2px;
.cnt { .cnt {
box-sizing: border-box; box-sizing: border-box;
border-radius: 2px; border-radius: 2px;
overflow: hidden; overflow: hidden;
padding: 0 12px; padding: 0 12px;
.z-readed { .empty {
opacity: 0.5; margin: 100px 0;
} text-align: center;
color: #999;
.item { img {
display: flex; display: block;
align-items: center; width: 120px;
padding: 16px 0 12px; margin: 20px auto;
border-bottom: 1px dashed #f0f5fa; }
&:last-child { }
border-bottom: none;
} .z-readed {
opacity: 0.5;
.item-tag { }
display: block;
margin-right: 15px; .item {
width: 24px; display: flex;
height: 24px; align-items: center;
} padding: 16px 0 12px;
.item-title { border-bottom: 1px dashed #f0f5fa;
// @include toe; &:last-child {
width: 60%; border-bottom: none;
margin-right: 100px; }
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC; .item-tag {
font-weight: 400; display: block;
color: rgba(0, 0, 0, 0.85); margin-right: 15px;
line-height: 22px; width: 24px;
} height: 24px;
.item-date { }
font-size: 12px; .item-title {
font-family: PingFangSC-Regular, PingFang SC; // @include toe;
font-weight: 400; width: 60%;
color: rgba(0, 0, 0, 0.45); margin-right: 100px;
line-height: 17px; font-size: 14px;
} font-family: PingFangSC-Regular, PingFang SC;
} font-weight: 400;
} color: rgba(0, 0, 0, 0.85);
.btn-clear { line-height: 22px;
position: absolute; }
top: 14px; .item-date {
right: 15px; font-size: 12px;
width: 32px; font-family: PingFangSC-Regular, PingFang SC;
height: 12px; font-weight: 400;
width: 75px; color: rgba(0, 0, 0, 0.45);
height: 25px; line-height: 17px;
background: linear-gradient(0deg, #db3b3b 1%, #ff8080 100%); }
border-radius: 3px; }
font-size: 14px; }
font-weight: 500; .btn-clear {
color: #ffffff; position: absolute;
line-height: 25px; top: 14px;
text-align: center; right: 15px;
} width: 32px;
height: 12px;
width: 75px;
height: 25px;
background: linear-gradient(0deg, #db3b3b 1%, #ff8080 100%);
border-radius: 3px;
font-size: 14px;
font-weight: 500;
color: #ffffff;
line-height: 25px;
text-align: center;
}
} }
/deep/ .el-tabs__nav-wrap::after { /deep/ .el-tabs__nav-wrap::after {
height: 1px; height: 1px;
background-color: #f0f5fa; background-color: #f0f5fa;
} }
/deep/ .el-pagination__total { /deep/ .el-pagination__total {
// float: left; // float: left;
} }
</style> </style>

Write Preview
Loading…
Cancel
Save