123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291 |
- <template>
- <div style="width: 100%;background: #fff;min-height: 700px;color: #666;" class="userCenterMyProject">
- <div style="height: 60px;line-height: 60px;padding-top: 10px;margin-left: 30px;margin-right: 30px; border-bottom: 1px solid rgba(228, 228, 228, 1);">
- <el-button @click="deleteItems()">{{$t('common.Delete')}}</el-button>
- <el-button type="warning" @click="changeReadStatus()">{{$t('common.MarkRead')}}</el-button>
- <el-button type="primary" @click="msgTypeChange(0)">{{$t('common.AllNews')}}</el-button>
- <!-- <el-button @click="msgTypeChange(1)">服务消息</el-button>
- <el-button @click="msgTypeChange(2)">活动消息</el-button>
- <el-button @click="msgTypeChange(3)">审核消息</el-button> -->
- <el-button type="info" @click="unReadMsg">{{$t('common.UnreadNews')}}</el-button>
- <el-select v-model="msgType" :placeholder="$t('common.MessageType')" style="margin-left:20px;">
- <el-option :label="$t('common.ServiceMessage')" value="dict_msg_fw"></el-option>
- <el-option :label="$t('common.ActiveMessage')" value="dict_msg_hd"></el-option>
- <el-option :label="$t('common.ReviewMessage')" value="dict_msg_sh"></el-option>
- </el-select>
- <el-input :placeholder="$t('common.keywordSearch')" v-model="keyWord" style="float: right;margin-top: 10px;" maxlength="10" show-word-limit>
- <template slot="append"><i class="el-icon-search" @click="keyWordSearch()"></i></template>
- </el-input>
- </div>
- <div style="margin-left: 30px;">
- <el-table
- :data="tableData"
- stripe
- highlight-current-row
- @selection-change="handleSelectionChange"
- :row-class-name="tableRowClassName"
- style="width: 100%" >
- <template slot="empty">
- {{$t('common.UserNoData')}}
- </template>
- <el-table-column type="selection" width="50"> </el-table-column>
- <el-table-column prop="title" :label="$t('common.Title')" width='200'> </el-table-column>
- <el-table-column prop="content" :label="$t('common.Content')" width='300'> </el-table-column>
- <el-table-column prop="createDate" :label="$t('common.ReceivingTime')" width="250"></el-table-column>
- <el-table-column prop="pushMessageType" :label="$t('common.Type')" width="150"></el-table-column>
-
- </el-table>
- </div>
- <div style="width: 100%;text-align: center;">
- <el-pagination
- style="margin-top: 50px;height: 80px;"
- background
- layout="prev, pager, next"
- :total="totalCount" @size-change="handleSizeChange"
- @current-change="handleCurrentChange">
- </el-pagination>
- </div>
- </div>
- </template>
- <script>
- import {selectPushMsg} from '@/api/userCenter'
- import {deleteMsgItems} from '@/api/userCenter'
- import {updateReadStatus} from '@/api/userCenter'
- export default {
- name: 'userCenterNotificationNews',
- data () {
- return {
- formInline: {
- user: '',
- region: ''
- },
- keyWord:'',
- tableData:'',
- // label:'',
- pageSize:10,
- currentPage:1,
- totalCount:0,
- msgType:'', //消息类型
- ids:'', //选择的多个id串
- array : [], //选择的多个id数组
- array2: [], //选择的多个读取状态数组
- readStatus:'', //读取状态
- multipleSelection:[],
- messageType:{
- "dict_msg_fw":this.$t('common.ServiceMessage'),
- "dict_msg_hd":this.$t('common.ActiveMessage'),
- "dict_msg_sh":this.$t('common.ReviewMessage')},
- }
- },
- mounted () {
- this.initTableData();//默认消息类型为全部
- },
- watch:{
- '$i18n.locale' () {
- this.initTableData()
- },
- "msgType"(){
- this.currentPage = 1;
- this.initTableData();
- }
- },
- methods:{
- changeType(){
- this.messageType={
- "dict_msg_fw":this.$t('common.ServiceMessage'),
- "dict_msg_hd":this.$t('common.ActiveMessage'),
- "dict_msg_sh":this.$t('common.ReviewMessage')
- }
- },
- tableRowClassName({ row }) {
- if (row.params =='unread') {
- return 'not-finish';
- }
- return '';
- },
- // 发布
- release(index, rows) {
- console.log(index, rows)
- },
- // 编辑
- change(index, rows) {
- console.log(index, rows)
- },
- // 删除
- deleteRow(index, rows) {
- console.log(index, rows)
- },
- // 撤回
- withdraw(index,rows) {
- console.log(index, rows)
- },
- handleSizeChange(val) {
- console.log(`每页 ${val} 条`);
- },
- handleCurrentChange(val) {
- console.log(`当前页: ${val}`);
- this.currentPage = val;
- this.initTableData();
- },
- handleSelectionChange(val) {
- console.log(val,'this is val')
- this.multipleSelection = val;
- var list = this.multipleSelection;
- if(list.length==0){
- this.array = [];
- this.array2 = [];
- }
- for(var i=0;i<list.length;i++){
- // array.push('"' + list[i].id +'"');
- // array.push("'" + list[i].id +"'");
- this.array.push(list[i].id);
- this.array2.push(list[i].params);
- }
- //var str = array.toString(); notification
- //this.ids = str.substr(1,str.length-2); //去掉2边空格
- },
- //初始化表格数据
- initTableData(){
- this.changeType();
- selectPushMsg(this.msgType,this.keyWord, this.pageSize,this.currentPage,this.readStatus).then(res=>{
- if(res.data.page.totalCount>0){
- var list = res.data.page.list;
- for(var i=0;i<list.length;i++){
- list[i].createDate = this.formatDateAndHouse(parseInt(list[i].createDate));
- list[i].pushMessageType=this.messageType[list[i].pushMessageTypeDict];
- }
- this.tableData = list;
- }else{
- this.tableData = '';
- }
-
- this.totalCount =Number(res.data.page.totalCount);
- })
- },
- //消息类型切换
- msgTypeChange(index){
- if(index==0){
- this.msgType = '';
- }
- // else if(index==1){
- // this.msgType = "dict_msg_fw";
- // }else if(index==2){
- // this.msgType = "dict_msg_hd";
- // }else if(index==3){
- // this.msgType = "dict_msg_sh";
- // }
- this.currentPage = 1;
- this.initTableData();
- },
- //未读消息 按钮触发
- unReadMsg(){
- this.readStatus = 'unread';
- this.currentPage = 1;
- this.initTableData();
- this.readStatus = '';
- },
- //中国标准时间 转 yy-MM-dd hh:mm:ss
- YymmddFormat(newDate) {
- let Month = newDate.getMonth() + 1;
- Month = Month >= 10 ? Month : '0' + Month;
- let d = newDate.getDate();
- d = d >= 10 ? d : '0' + d
- return [
- [newDate.getFullYear(), Month, d].join('-'), [newDate.getHours(), newDate.getMinutes(), newDate.getSeconds()].join(':')
- ].join(' ');
- },
- //关键词搜索
- keyWordSearch(){
- this.currentPage = 1;
- this.initTableData();
- },
- deleteItems(){
- if(this.array.length == 0){
- this.$message.warning(this.$i18n.locale === 'zh' ?"请先选择要删除的记录":'Please select the record to delete first');
- return;
- }else{
- this.$confirm(this.$t('common.Thisoperationwillpermanently'), this.$t('common.Tips'), {
- confirmButtonText: this.$t('common.OK'),
- cancelButtonText: this.$t('common.cancel'),
- type: 'warning'
- }).then(() => {
- deleteMsgItems(this.array).then(res=>{
-
- })
- this.$message({
- type: 'success',
- message: this.$i18n.locale === 'zh' ? '删除成功!' : 'Successfully deleted'
- });
- this.currentPage = 1;
- this.initTableData();
- }).catch(() => {
- this.$message({
- type: 'info',
- message: this.$i18n.locale === 'zh' ? '已取消删除' : 'Deletion canceled',
- });
- });
- }
-
- },
- changeReadStatus(){
- var status = this.array2;
- if(status.indexOf('read')>=0 || status.length==0){
- this.$message.warning(this.$t('common.Pleaseselectallunreadrecords'));
- }else{
- this.$confirm(this.$t('common.Areyousureyouwanttomarkasread'), this.$t('common.Tips'), {
- confirmButtonText: this.$t('common.OK'),
- cancelButtonText: this.$t('common.cancel'),
- type: 'warning'
- }).then(() => {
- updateReadStatus(this.array).then(res=>{
-
- })
- this.$message({
- type: 'success',
- message: this.$i18n.locale === 'zh' ?'更新成功!':'Update succeeded'
- });
- this.currentPage = 1;
- this.initTableData();
- }).catch(() => {
- this.$message({
- type: 'info',
- message: this.$i18n.locale === 'zh' ?'已取消更新':'Update canceled'
- });
- });
- }
- }
- }
- }
- </script>
- <style scoped>
- .el-input {
- width: 200px ;
- }
- .el-form-item__content,.el-select {
- width: 200px !important;
- }
- .el-table thead {
- background: #eee;
- }
- .userCenterMyProject >>> .el-pagination .el-pager li,
- .userCenterMyProject >>> .el-pagination .btn-next,
- .userCenterMyProject >>> .el-pagination .btn-prev{
- width: 35px;
- height: 35px;
- line-height: 35px;
- }
- .userCenterMyProject >>> .el-pagination.is-background .el-pager li:not(.disabled).active {
- background: #0050d8;
- }
- .userCenterMyProject >>> .not-finish td:nth-child(2) .cell{
- color:#FFFFFF;
- background: #909399;
- }
- </style>
|