<template>

<div>    <el-form>        <el-form-item>            <el-button type="primary" size="mini" @click='readed'>标记为已读</el-button>        </el-form-item>    </el-form><el-table ref="multitable" :data="tableData" border tooltip-effect="dark" style="width:100%" @selection-change = "handleSelected">    <el-table-column type="selection" width="55">   </el-table-column>    <el-table-column prop="sender" label="发送人姓名"> </el-table-column>    <el-table-column prop="title" label="题目"> </el-table-column>    <el-table-column prop="content" label="内容"> </el-table-column>    <el-table-column prop="read" label="状态" sortable>        <template slot-scope='scope'>             <div v-if="scope.row.is_read==1"><el-link type="primary" @click="handleRead(scope.row)">未读</el-link></div>             <div v-else>已读</div>           </template>        </el-table-column>    <el-table-column prop="created_at" label="发送工夫"> </el-table-column></el-table><el-pagination layout="total,prev, pager, next" @current-change="requestData" :total="paginate.total" :current-page.sync='paginate.current_page' :page-size='paginate.size'></el-pagination></div>

</template>
<script>
import http from '../../../libs/http';
export default {

data(){    return {        tableData:[],        multiVal:[],        paginate:{            current_page:1,            total:1,            from:1,            to:1,            size:15        }    }},methods:{    handleSelected(val){        this.multiVal = [];        this.multiVal = val;    },    requestData(){        http.get('/api/supplier/supplierPrivateMessage',{params:{page:this.paginate.current_page}}).then(res=>{            this.tableData = res.data.data;            this.paginate.current_page= res.data.meta.current_page;            this.paginate.total = res.data.meta.total;            this.paginate.from = res.data.meta.from;            this.paginate.to = res.data.meta.to;        })    },    handleRead(row){        console.log(row);        this.multiVal =[];        this.multiVal.push( row.id );        this.readed();    },    readed(){        let data={            msg_ids : this.multiVal        }        http.post('/api/supplier/backPrivateMessageToRead',data).then(res=>{            if(res.data.code==200){                this.$message({type:'success',message:"批改胜利"});                this.requestData();            }else{                this.$message({type:'danger',message:'批改失败'});            }        })    }},created(){    this.requestData();}

}
</script>

http.js

import axios from 'axios'
import config from '../config'
import { Message } from 'element-ui'

const httpRequest = axios.create({
timeout: 5000,
baseURL: config.apiUrl
})

httpRequest.interceptors.request.use(
config => {

return config

},
error => {

return Promise.reject(error)

}
)

export function setHttpToken (token) {
httpRequest.defaults.headers.common.Authorization = Bearer ${token}
}

httpRequest.interceptors.response.use(
response => {

return response

},
error => {

let message = error.response.data.message ? error.response.data.message : error.response.statusTextlet dangerouslyUseHTMLString = falseif (error.response.status === 422 && error.response.data.hasOwnProperty('errors')) {  message += '<br>'  for (let key in error.response.data.errors) {    let items = error.response.data.errors[key]    if (typeof items === 'string') {      message += `${items} <br>`    } else {      error.response.data.errors[key].forEach(item => {        message += `${item} <br>`      })    }  }  dangerouslyUseHTMLString = true}Message({  dangerouslyUseHTMLString,  message: message,  type: 'error'})return Promise.reject(error)

}
)

export default httpRequest