"express-ws": "^3.0.0",
"devDependencies": {
"socket.io": "^2.0.4"
}
message.js
router.get('/current', function(req, res, next) {
console.log("current:----------");
var userid=req.session.loginUser.id;
var usrname= req.session.loginUser.usrname;
console.log("userid:"+userid+"，usrname:"+usrname);
var sqlstr= "SELECT count(1) FROM message where username ='" +usrname+"' and readed=0";
console.log(sqlstr);
var connection=myCreateCon();
connection.connect();
//原来就是select * from
connection.query(sqlstr, function(err, rows, fields) {
if (err) throw err;
console.log('查询结果为: ', rows);
//res.send(rows);
res.json({ret_code: 0, data: rows});
});
connection.end();
});
router.get('/', function(req, res, next) {
var userid=req.session.loginUser.id;
var usrname= req.session.loginUser.usrname;
console.log("userid:"+userid+"，usrname:"+usrname);
var sqlstr= "SELECT c.* FROM message c where c.username ='" +usrname+"'";
FindPerson.vue
<small v-html='room.roominfo'></small>
Messages.vue
getRows(){
var gvue=this;
this.$ajax({
method: 'get',
url: 'api/message/?time='+new Date().getTime(),
}).then(function (response) {
console.log(response.data.rows);
debugger;
if(response.data.count>0){
var messages = new Array(response.data.rows.length);
//var messages = response.data.ret_msg;
for (var x=0;x<response.data.rows.length;x++)
{
var msg={};
msg.liid=response.data.rows[x].id;
msg.posttime=response.data.rows[x].time;
msg.areaname=response.data.rows[x].text;
messages[x]=msg;
}
gvue.tableData=messages;
}else
myMenu.vue
msgcount:'',
logined_prop:true
};
},
mounted:function () {
this.getLoginStatus();
setInterval(this.getUsrCurMsgCount,50000)
// this.getUsrCurMsgCount();
},
methods: {
getUsrCurMsgCount(){
var gvue=this;
this.$ajax({
method: 'get',
url: 'api/message/current?time='+new Date().getTime(),
/*
data: {
usrname: this.ruleForm2.usrname,
pass: this.ruleForm2.pass
}*/
}).then(function (response) {
//alert("11");
//debugger;
console.log(response);
if(response.data.ret_code==0){
console.log(response.data);
//gvue.$store.state.logined=true;
//gvue.$store.state.identification=response.data.ret_msg.identification;
gvue.msgcount=response.data.data[0]['count(1)'];
}
})
.catch(function (error) {
console.log(error);
});
},
Mapsearch.Vue
<template>
<el-row id="Homepan" :gutter="10">
<el-col :xs="0" :sm="1" :md="2" :lg="2">.</el-col>
<el-col :xs="24" :sm="22" :md="20" :lg="20">.
<el-row :gutter="10">
<el-col :xs="0" :sm="1" :md="2" :lg="2">.
</el-col>
<el-col :xs="24" :sm="22" :md="20" :lg="20">
<div class="am-list-news-bd">
<ul class="am-list">
<li v-for="room in rooms" class=" am-list-item-desced am-list-item-thumbed am-list-item-thumb-left">
<el-row :gutter="10">
<el-col :xs="17" :sm="17" :md="17" :lg="17" >
<div class=" am-list-main" >
<el-row :gutter="10">
<el-col :xs="15" :sm="15" :md="14" :lg="12">
<h4 class="" style="margin-top: 1.1em;margin-bottom: 0.5em;"><router-link :to="'/findperson/'+room.id">
{{room.areaname}}--{{room.courtname}}<small></small> </router-link>
</h4>
</el-col>
<el-col :xs="9" :sm="9" :md="10" :lg="12">
<h5 style="margin-top: 1.5em;margin-bottom: 0.5em;">
</h5>
</el-col>
</el-row>
<div class="am-list-item-text" style="margin-top: 0.3em;">
<el-row :gutter="10">
<el-col :xs="17" :sm="17" :md="17" :lg="17" class="hidden-sm-and-down">
<small style="padding-top: 30px;" v-html="room.roominfo"></small>
</el-col>
</el-row>
<el-row style="margin-top: 1.2em;margin-bottom: 0.3em;" :gutter="10">
<el-col :xs="12" :sm="12" :md="12" :lg="12" class="hidden-sm-and-down">
<small> <small>{{room.posttime}} wang</small></small>
</el-col>
<el-col :xs="12" :sm="12" :md="12" :lg="12" >
<i style="padding-right: 1em" class="el-icon-news">2</i>
</el-col>
</el-row>
</div>
</div>
</el-col>
<el-col :xs="6" :sm="6" :md="6" :lg="6" class="hidden-sm-and-down">
.<img src='/api/150_dd.JPG' style="margin-top: 5%;margin-bottom:5%;height: 80px; "/>
</el-col>
</el-row>
</li>
</ul>
</div>
</el-col>
</el-row>
<div class="block">
<span class="demonstration"></span>
<!--
<el-pagination
layout="prev, pager, next"
:total="50">
</el-pagination>
-->
<el-pagination style="text-align: center;"
@current-change="handleCurrentChange"
:current-page.sync="currentPage1"
:page-size.sync="pagesize"
layout="total, prev, pager, next"
:total.sync="total">
</el-pagination>
</div>
</el-col>
<el-col :xs="0" :sm="1" :md="2" :lg="2">.</el-col>
</el-row>
</template>
<style type="text/css">
#Homepan {
text-align:left;
/*float: left;*/
}
#Homepan img{
auto;
height:auto;
max-90%;
max-height:90%;
margin-top: 8%;
margin-bottom: 6%；
}
#Homepan .am-panel-default {
border-color: #ddd;
}
#Homepan .am-panel {
margin-bottom: 20px;
background-color: #fff;
border: 1px solid transparent;
border-radius: 0;
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
box-shadow: 0 1px 1px rgba(0,0,0,.05);
}
#Homepan .am-list-news-default {
margin: 10px;
}
#Homepan .am-list{
padding-left: 0.1em;
padding-right: 0.1em;
}
#Homepan .am-list-news-hd {
padding-top: 1.2rem;
padding-bottom: .4rem;
}
#Homepan .am-list-news-default .am-list .am-list-item-desced .am-list-item-text {
margin-top: .5rem;
color: #757575;
}
#Homepan .am-list li {
position: relative;
display: block;
margin-bottom: -1px;
background-color: #fff;
border: 1px solid #dedede;
border- 1px 0;
}
#Homepan .am-list-news-default .am-list .am-list-item-text {
overflow: hidden;
text-overflow: ellipsis;
line-height: 1.1em;
max-height: 2.6em;
}
#Homepan.am-list-item-text {
line-height: 1.3;
font-size: 1.1rem;
color: #999;
margin: 0;
}
#Homepan.am-list-news-default .am-list .am-list-item-thumb-left .am-list-thumb {
padding-left: 0;
}
#Homepan.am-list .am-list-item-desced a, .am-list .am-list-item-thumbed a {
padding-right: 0;
}
#Homepan a {
color: #0e90d2;
}
#Homepan a, ins {
text-decoration: none;
}
#Homepan a {
background-color: transparent;
}
</style>
<script>
export default {
data() {
return {
value3: true,
rooms:[ {
areaname:'雨花台',
courtname:'双龙嘉园',
acreage:'',
price:'',
decoration:'',
orientation:'',
identification:'',
rentmethod:'',
roomnum:'',
tingnum:'',
washroomnum:'',
surroundinginfo:'',
roominfo:''
}
],
areaname: '*',
currentPage1: 1,
total:20,
pagesize:10,
my:1
}
},
mounted:function () {
this.handleChangeValue();
},
methods: {
handleCurrentChange(val) {
this.handleChangeValue();
},
handleChangeValue(){
var url ="&areaname="+this.areaname+"¤tpage="+this.currentPage1+"&pagesize="+this.pagesize;
this.getRooms(url);
},
formatTooltip(val) {
return val ;
},
getRooms(url){
Object.assign(this.$data.my, 100);
this.my=99;
var gvue=this;
this.$ajax({
method: 'get',
url: 'api/roommate/all?time='+new Date().getTime(),
changeOrigin:true,
}).then(function (response) {
console.log(response);
var Things = response.data.rows;
gvue.rooms=Things;
gvue.total=response.data.count;
})
.catch(function (error) {
console.log(error);
});
}
}
}
</script>
AddPerson.vue
<template>
<el-row id="AddRoom">
<el-col :span="5">.</el-col>
<el-col :span="14">
<el-card class="box-card">
<div slot="header" class="clearfix">
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">找室友信息</el-breadcrumb-item>
<el-breadcrumb-item>{{action}}</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="text item">
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="位置" required>
<el-col :span="10">
<el-form-item prop="areaname">
<el-select v-model="form.areaname" placeholder="所在区(如朝阳)" >
<el-option label="建邺" value="建邺"></el-option>
<el-option label="玄武" value="玄武"></el-option>
<el-option label="江宁" value="江宁"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4"><el-form-item label="位置" required></el-form-item></el-col>
<el-col :span="10">
<el-form-item prop="courtname">
<el-input v-model="form.courtname" placeholder="输入期待租房位置(如万达附近)" ></el-input>
</el-form-item>
</el-col>
</el-form-item>
<el-form-item label="标签" required>
<el-col :span="7">
<el-form-item prop="tag1">
<el-input v-model="form.tag1" placeholder="可输年龄信息(如80后、90后)"></el-input>
</el-form-item>
</el-col>
<el-col :span="1">.</el-col>
<el-col :span="7">
<el-form-item prop="tag2">
<el-input v-model="form.tag2" placeholder="可输职业信息(如it、金融等)"></el-input>
</el-form-item>
</el-col>
<el-col :span="1">.</el-col>
<el-col :span="8">
<el-form-item prop="tag3">
<el-input v-model="form.tag3" placeholder="其他标签"></el-input>
</el-form-item>
</el-col>
</el-form-item>
</el-form-item>
<el-form-item label="小区周边" require prop="surroundinginfo">
<el-radio-group v-model="form.identification">
<el-radio label="0">无房共同找</el-radio>
<el-radio label="1">有房求室友</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="首段" require prop="roominfo">
<el-input type="textarea" placeholder="介绍一下自己和期待租房的价位、位置、装修、室友要求等..." v-model="form.roominfo"></el-input>
<!-- <button v-on:click="getContent">查看内容</button> -->
</el-form-item>
<el-form-item label="正文" require prop="roominfo">
<div id="editorElem" style="text-align:left"></div>
<el-button type="primary" @click="submitForm('form')">{{gonext}}</el-button>
<el-button @click="resetForm('form')">重置</el-button>
</el-form-item>
</el-form>
</div>
</el-card>
</el-col>
<el-col :span="5">.</el-col>
</el-row>
</template>
<style>
.text {
font-size: 14px;
}
.item {
margin-bottom: 18px;
}
.clearfix:before,
.clearfix:after {
display: table;
content: "";
}
.clearfix:after {
clear: both
}
.box-card{
margin-top:30px;
}
#AddRoom {
text-align: left;
}
</style>
<script>
import E from 'wangeditor'
var editor = new E('#editorElem')
export default {
data() {
return {
editorContent: '',
radio: '1',
action:"添加",
gonext:"立即创建",
form: {
areaname:'',
courtname:'',
tag1:'',
tag2:'',
tag3:'',
identification:'0',
surroundinginfo:'',
},
rules: {
courtname: [
{ required: true, message: '请输入位置', trigger: 'blur' },
{ min: 2, max: 15, message: '长度在 2 到 15 个字符', trigger: 'blur' }
],
areaname: [
{ required: true, message: '请选择所在区', trigger: 'change' }
],
tag1: [
{ required: true, message: '请输入标签', trigger: 'change' }
],
tag2: [
{ required: true, message: '请输入标签', trigger: 'change' }
],
tag3: [
{ required: true, message: '请输入标签', trigger: 'change' }
],
identification: [
{ required: true, message: '请选择', trigger: 'change' }
],
roominfo: [
{ required: true, message: '请输入正文', trigger: 'blur' }
]
}
}
},
mounted:function () {
editor.customConfig.onchange = (html) => {
this.editorContent = html
}
editor.create()
if(this.$route.params.id)
this.getRoom();
},
methods: {
getContent: function () {
alert(this.editorContent)
},
cancelForm(){
this.$router.push("/postrooms");
},
resetForm(formName) {
this.$refs[formName].resetFields();
},
getRoom(){
var id=this.$route.params.id;
//alert(id);
//alert(this.dynamicSegment);
this.editorContent='111';
var gvue=this;
this.$ajax({
method: 'get',
url: 'api/room/'+id+'?time='+new Date().getTime(),
changeOrigin:true,
}).then(function (response) {
console.log(response.data);
gvue.form=response.data[0];
gvue.form.identification=response.data[0].identification+'';
gvue.action="编辑 (房间号:"+id+")";
gvue.gonext="立即修改";
gvue.editorContent=response.data[0].roominfo;
editor.txt.html(response.data[0].roominfo);
})
.catch(function (error) {
console.log(error);
});
},
submitForm(form) {//2表示是求组
console.log('submit!');
this.$refs[form].validate((valid) => {
if (valid) {
//alert('submit!');
var url = 'api/roommate/add?time='+new Date().getTime();
if(this.$route.params.id)
url = 'api/room/edit?time='+new Date().getTime();
var gvue=this;
this.form.roominfo=this.editorContent;
this.$ajax({
method: 'post',
url:url ,
changeOrigin:true,
data: this.form//"courtname="+this.form.courtname+"&areaname="+this.form.areaname
}).then(function (response) {
console.log(response);
if(response.data.ret_code===0){
gvue.$message({
showClose: true,
message: response.data.ret_msg+'，操作成功1',
type: 'success'
});
//gvue.$router.push("/addroom2/"+response.data.ret_roomid);
gvue.$router.push("/postrooms");
}
})
.catch(function (error) {
console.log(error);
});
} else {
console.log('error submit!!');
return false;
}
});
}
}
}
</script>