演示项目
This commit is contained in:
208
web_home/src/components/menus/AllUsers.vue
Normal file
208
web_home/src/components/menus/AllUsers.vue
Normal file
@@ -0,0 +1,208 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="menu-title">
|
||||
全部用户
|
||||
</div>
|
||||
<div class="menu-content">
|
||||
<div>
|
||||
<el-form :inline="true" :model="qo" class="demo-form-inline">
|
||||
<el-form-item label="用户ID：">
|
||||
<el-input v-model="qo.LIKES_fid" placeholder="请输入用户ID" clearable style="width: 300px"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" @click="queryDataById()">搜 索</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="queryData(-1)">上一页</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="queryData(1)">下一页</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div>
|
||||
<el-table :data="result.records" style="width: 100%" v-loading="loading">
|
||||
<el-table-column type="index" label="行号" width="60"></el-table-column>
|
||||
<el-table-column prop="UserId" label="用户ID"></el-table-column>
|
||||
<el-table-column prop="Labels" label="标签">
|
||||
<div slot-scope="scope">
|
||||
<template v-if="scope.row.Labels">
|
||||
<template v-for="(tag,index) in scope.row.Labels">
|
||||
<el-tag :key="index" v-if="index < 5">{{ tag }}</el-tag>
|
||||
</template>
|
||||
<el-tag v-if="scope.row.Labels.length > 5">...</el-tag>
|
||||
</template>
|
||||
</div>
|
||||
</el-table-column>
|
||||
<el-table-column label="业务" width="80">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click.native.prevent="followUser(scope.row)" type="text" size="small">
|
||||
关注
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="280">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click.native.prevent="feedbackHistory(scope.row)" type="text" size="small">
|
||||
Ta的喜欢
|
||||
</el-button>
|
||||
<el-button @click.native.prevent="linkUser(scope.row)" type="text" size="small">
|
||||
Ta的好友
|
||||
</el-button>
|
||||
<el-button @click.native.prevent="similarUser(scope.row)" type="text" size="small">
|
||||
相似用户
|
||||
</el-button>
|
||||
<el-button @click.native.prevent="recommendItem(scope.row)" type="text" size="small">
|
||||
Ta的推荐
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request, {getBaseUrl} from '@/utils/request';
|
||||
|
||||
var _this;
|
||||
var _index = 0;
|
||||
export default {
|
||||
name: "allUsers",
|
||||
data() {
|
||||
return {
|
||||
qo: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
LIKES_fid: '',
|
||||
},
|
||||
result: {
|
||||
records: [],
|
||||
total: 0
|
||||
},
|
||||
loading: false,
|
||||
cursorArr: [''], // 分页游标
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
let _qo = _this.$route.query.qo;
|
||||
if (_qo) {
|
||||
_this.qo = JSON.parse(_qo);
|
||||
}
|
||||
_this.queryData(0);
|
||||
},
|
||||
methods: {
|
||||
queryDataById() {
|
||||
if (this.qo.LIKES_fid.length > 0) {
|
||||
this.loading = true;
|
||||
request({
|
||||
url: '/gorse/query_user/' + this.qo.LIKES_fid,
|
||||
method: 'get',
|
||||
}).then(res => {
|
||||
let user = res.data;
|
||||
if (!user) {
|
||||
_this.result.records = [];
|
||||
} else {
|
||||
_this.result.records = [user];
|
||||
}
|
||||
|
||||
this.loading = false;
|
||||
});
|
||||
} else {
|
||||
this.cursorArr = [''];
|
||||
this.queryData(1);
|
||||
}
|
||||
},
|
||||
queryData(index) { // index -1 上一页，0刷新， 1下一页
|
||||
this.loading = true;
|
||||
this.cursorArr = this.cursorArr.slice(0, this.cursorArr.length - 1 + index);
|
||||
this.cursorArr = this.cursorArr.length === 0 ? [''] : this.cursorArr;
|
||||
request({
|
||||
url: '/gorse/query_users?cursor=' + this.cursorArr[this.cursorArr.length - 1],
|
||||
method: 'get',
|
||||
}).then(res => {
|
||||
this.cursorArr.push(res.data.Cursor);
|
||||
_this.result.records = res.data.Users;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
feedbackHistory(item) {
|
||||
_this.$router.push({
|
||||
path: "feedbackHistory", query: {
|
||||
userId: item.UserId,
|
||||
cursorArr: JSON.stringify(_this.cursorArr)
|
||||
}
|
||||
});
|
||||
},
|
||||
linkUser(item) {
|
||||
_this.$router.push({
|
||||
path: "linkUser", query: {
|
||||
userId: item.UserId,
|
||||
qo: JSON.stringify(_this.qo)
|
||||
}
|
||||
});
|
||||
},
|
||||
similarUser(item) {
|
||||
_this.$router.push({
|
||||
path: "similarUser", query: {
|
||||
userId: item.UserId,
|
||||
qo: JSON.stringify(_this.qo)
|
||||
}
|
||||
});
|
||||
},
|
||||
recommendItem(item) {
|
||||
_this.$router.push({
|
||||
path: "recommendItem", query: {
|
||||
userId: item.UserId,
|
||||
qo: JSON.stringify(_this.qo)
|
||||
}
|
||||
});
|
||||
},
|
||||
followUser(item) {
|
||||
_this.$confirm('是否关注此用户?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
_this.loading = true;
|
||||
// 添加节点
|
||||
request({
|
||||
url: '/nebula_operate/insertvertex/user_relation/tag_252150072',
|
||||
method: 'post',
|
||||
data: {
|
||||
ob: {name: item.UserId},
|
||||
vid: item.UserId
|
||||
}
|
||||
}).then(res => {
|
||||
request({
|
||||
url: '/nebula_operate/insertvertex/user_relation/tag_252150072',
|
||||
method: 'post',
|
||||
data: {
|
||||
ob: {name: _this.$store.getters.name},
|
||||
vid: _this.$store.getters.name
|
||||
}
|
||||
}).then(res => {
|
||||
request({
|
||||
url: '/nebula_operate/insertedgeline/user_relation/edge_768395026',
|
||||
method: 'post',
|
||||
data: {
|
||||
dstId: item.UserId,
|
||||
srcId: _this.$store.getters.name
|
||||
}
|
||||
}).then(res => {
|
||||
_this.loading = false;
|
||||
_this.$message.success("关注成功");
|
||||
});
|
||||
});
|
||||
});
|
||||
}).catch(() => {
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
</style>
|
||||
203
web_home/src/components/menus/HotNews.vue
Normal file
203
web_home/src/components/menus/HotNews.vue
Normal file
@@ -0,0 +1,203 @@
|
||||
<template>
|
||||
<div style="height: 100%">
|
||||
<div class="menu-title">
|
||||
我的推荐
|
||||
</div>
|
||||
<div class="block_box">
|
||||
<el-form :inline="true" class="demo-form-inline">
|
||||
<el-form-item>
|
||||
<el-select v-model="gorseQo.recommendation" @change="getRecommendItem">
|
||||
<el-option :key="item.value" :value="item.value" :label="item.label"
|
||||
v-for="item in recommendList"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="种类">
|
||||
<el-select v-model="gorseQo.category" @change="getRecommendItem">
|
||||
<el-option value="" label="无"></el-option>
|
||||
<el-option :key="item.id" :value="item.name" :label="item.name"
|
||||
v-for="item in categoryList"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="line-item-box" v-loading="loading">
|
||||
<div class="line-item" v-for="item in list" :key="item.id">
|
||||
<div class="title-time">
|
||||
<div>{{ item.ItemId }}</div>
|
||||
<div>{{ item.Timestamp }}</div>
|
||||
</div>
|
||||
<div class="description">{{ item.Comment }}</div>
|
||||
<div class="labels">
|
||||
<el-tag v-for="(la,index) in item.Labels" :key="index">{{ la }}</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '@/utils/request';
|
||||
import {getFriends} from "@/api/user";
|
||||
|
||||
var _this;
|
||||
export default {
|
||||
name: "HotNews",
|
||||
data() {
|
||||
return {
|
||||
qo: "",
|
||||
gorseQo: {
|
||||
userId: '',
|
||||
n: 20,
|
||||
recommendation: '_',
|
||||
category: ''
|
||||
},
|
||||
user: {},
|
||||
categoryList: [],
|
||||
recommendList: [{
|
||||
label: '默认推荐',
|
||||
value: '_'
|
||||
}, {
|
||||
label: '基于物品推荐',
|
||||
value: 'item_based'
|
||||
}, {
|
||||
label: '基于用户推荐',
|
||||
value: 'user_based'
|
||||
}],
|
||||
list: [],
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
_this.gorseQo.userId = _this.$store.getters.name;
|
||||
_this.queryCategoryList();
|
||||
_this.getRecommendItem();
|
||||
},
|
||||
methods: {
|
||||
queryCategoryList() {
|
||||
request({
|
||||
url: '/category/query_list',
|
||||
method: 'post',
|
||||
data: {}
|
||||
}).then(res => {
|
||||
_this.categoryList = res.data;
|
||||
});
|
||||
},
|
||||
getRecommendItem() {
|
||||
_this.loading = true;
|
||||
if (_this.gorseQo.recommendation === 'user_based') {
|
||||
// 获取关注用户
|
||||
let myId = this.$store.getters.name;
|
||||
getFriends(myId).then(res => {
|
||||
let recommendList = [];
|
||||
let index = 0;
|
||||
res.data.nodes.forEach(user => {
|
||||
index++;
|
||||
if (user.vid !== myId) {
|
||||
request({
|
||||
url: '/gorse/get_recommend_by_user',
|
||||
method: 'post',
|
||||
data: {
|
||||
userId: user.vid,
|
||||
n: 20,
|
||||
recommendation: '_',
|
||||
category: _this.gorseQo.category
|
||||
}
|
||||
}).then(rec => {
|
||||
rec.data.forEach(row => {
|
||||
row.labelsArr = row.labels ? row.labels.split(',') : [];
|
||||
});
|
||||
recommendList = recommendList.concat(rec.data);
|
||||
if (index >= res.data.nodes.length) {
|
||||
shuffle(recommendList);
|
||||
_this.list = recommendList.slice(0, 20);
|
||||
_this.loading = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
request({
|
||||
url: '/gorse/get_recommend_by_user',
|
||||
method: 'post',
|
||||
data: _this.gorseQo
|
||||
}).then(res => {
|
||||
res.data.forEach(row => {
|
||||
row.labelsArr = row.labels ? row.labels.split(',') : [];
|
||||
});
|
||||
_this.list = res.data;
|
||||
_this.loading = false;
|
||||
});
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
// 数组乱序
|
||||
function shuffle(array) {
|
||||
array.sort(() => Math.random() - 0.5);
|
||||
}
|
||||
</script>
|
||||
<style src="../../css/back.css" scoped></style>
|
||||
<style scoped lang="scss">
|
||||
|
||||
.block_box {
|
||||
margin: 25px 25px 0 25px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 3px;
|
||||
height: calc(100% - 120px);
|
||||
|
||||
.title {
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 15px 25px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.demo-form-inline {
|
||||
padding: 25px 25px 0 25px;
|
||||
}
|
||||
|
||||
.line-item-box {
|
||||
height: calc(100% - 88px);
|
||||
overflow-y: auto;
|
||||
|
||||
.line-item {
|
||||
font-size: 14px;
|
||||
line-height: 32px;
|
||||
padding: 0 25px 10px 25px;
|
||||
margin: 20px 0;
|
||||
border-bottom: 1px solid #dee0e2;
|
||||
|
||||
|
||||
.title-time {
|
||||
display: flex;
|
||||
|
||||
div:first-child {
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
color: #9da2a8;
|
||||
}
|
||||
|
||||
div:last-child {
|
||||
margin-left: auto;
|
||||
color: #bbbcbd;
|
||||
}
|
||||
}
|
||||
|
||||
.description {
|
||||
color: #bbbcbd;
|
||||
}
|
||||
|
||||
.labels {
|
||||
color: #9da2a8;
|
||||
|
||||
.el-tag {
|
||||
margin: 0 10px 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
99
web_home/src/components/menus/MyFriends.vue
Normal file
99
web_home/src/components/menus/MyFriends.vue
Normal file
@@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="menu-title">
|
||||
我的好友
|
||||
</div>
|
||||
<div class="menu-content">
|
||||
<div>
|
||||
<el-table :data="list" style="width: 100%" v-loading="loading">
|
||||
<el-table-column type="index" label="行号" width="60"></el-table-column>
|
||||
<el-table-column prop="vid" label="用户ID"></el-table-column>
|
||||
<el-table-column prop="Labels" label="标签">
|
||||
<div slot-scope="scope">
|
||||
<template v-if="scope.row.Labels">
|
||||
<template v-for="(tag,index) in scope.row.Labels">
|
||||
<el-tag :key="index" v-if="index < 5">{{ tag }}</el-tag>
|
||||
</template>
|
||||
<el-tag v-if="scope.row.Labels.length > 5">...</el-tag>
|
||||
</template>
|
||||
</div>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="240">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click.native.prevent="feedbackHistory(scope.row)" type="text" size="small">
|
||||
Ta的喜欢
|
||||
</el-button>
|
||||
<el-button @click.native.prevent="similarUser(scope.row)" type="text" size="small">
|
||||
相似用户
|
||||
</el-button>
|
||||
<el-button @click.native.prevent="recommendItem(scope.row)" type="text" size="small">
|
||||
Ta的推荐
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request, {getBaseUrl} from '@/utils/request';
|
||||
import {getFriends} from "@/api/user";
|
||||
|
||||
var _this;
|
||||
export default {
|
||||
name: "userManage",
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
_this.queryData();
|
||||
},
|
||||
methods: {
|
||||
queryData() {
|
||||
_this.list = [];
|
||||
let myId = this.$store.getters.name;
|
||||
getFriends(myId).then(res => {
|
||||
let _list = res.data.nodes;
|
||||
_list.forEach(item => {
|
||||
if (item.vid !== myId) {
|
||||
_this.list.push(item);
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
feedbackHistory(item) {
|
||||
_this.$router.push({
|
||||
path: "feedbackHistory", query: {
|
||||
userId: item.UserId,
|
||||
cursorArr: JSON.stringify(_this.cursorArr)
|
||||
}
|
||||
});
|
||||
},
|
||||
similarUser(item) {
|
||||
_this.$router.push({
|
||||
path: "similarUser", query: {
|
||||
userId: item.UserId,
|
||||
qo: JSON.stringify(_this.qo)
|
||||
}
|
||||
});
|
||||
},
|
||||
recommendItem(item) {
|
||||
_this.$router.push({
|
||||
path: "recommendItem", query: {
|
||||
userId: item.UserId,
|
||||
qo: JSON.stringify(_this.qo)
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
</style>
|
||||
141
web_home/src/components/menus/MyStar.vue
Normal file
141
web_home/src/components/menus/MyStar.vue
Normal file
@@ -0,0 +1,141 @@
|
||||
<template>
|
||||
<div style="height: 100%">
|
||||
<div class="menu-title">
|
||||
我的喜欢
|
||||
</div>
|
||||
<div class="block_box">
|
||||
<div class="line-item-box">
|
||||
<div class="line-item" v-for="item in list" :key="item.id">
|
||||
<div class="title-time">
|
||||
<div>{{ item.ItemId }}</div>
|
||||
<div>{{ item.Timestamp }}</div>
|
||||
</div>
|
||||
<div class="description">{{ item.Comment }}</div>
|
||||
<div class="labels">
|
||||
<el-tag v-for="(la,index) in item.Labels" :key="index">{{ la }}</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '@/utils/request';
|
||||
import {getFriends} from "@/api/user";
|
||||
|
||||
var _this;
|
||||
export default {
|
||||
name: "MyStar",
|
||||
data() {
|
||||
return {
|
||||
qo: "",
|
||||
gorseQo: {
|
||||
userId: '',
|
||||
n: 20,
|
||||
recommendation: '_',
|
||||
category: ''
|
||||
},
|
||||
user: {},
|
||||
list: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
_this.gorseQo.userId = _this.$store.getters.name;
|
||||
_this.getRecommendItem();
|
||||
},
|
||||
methods: {
|
||||
getRecommendItem() {
|
||||
request({
|
||||
url: '/gorse/get_feedback_list/' + _this.gorseQo.userId + "/like",
|
||||
method: 'get'
|
||||
}).then(res => {
|
||||
res.data.forEach(row => {
|
||||
row.Labels = row.Item.Labels;
|
||||
row.ItemId = row.Item.ItemId;
|
||||
row.Comment = row.Item.Comment;
|
||||
if(_this.list.length < 20) {
|
||||
_this.list.push(row);
|
||||
}
|
||||
});
|
||||
});
|
||||
request({
|
||||
url: '/gorse/get_feedback_list/' + _this.gorseQo.userId + "/star",
|
||||
method: 'get'
|
||||
}).then(res => {
|
||||
res.data.forEach(row => {
|
||||
row.Labels = row.Item.Labels;
|
||||
row.ItemId = row.Item.ItemId;
|
||||
row.Comment = row.Item.Comment;
|
||||
if(_this.list.length < 20) {
|
||||
_this.list.push(row);
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style src="../../css/back.css" scoped></style>
|
||||
<style scoped lang="scss">
|
||||
|
||||
.block_box {
|
||||
margin: 25px 25px 0 25px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 3px;
|
||||
height: calc(100% - 120px);
|
||||
|
||||
.title {
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 15px 25px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.demo-form-inline {
|
||||
padding: 25px 25px 0 25px;
|
||||
}
|
||||
|
||||
.line-item-box {
|
||||
height: calc(100% - 88px);
|
||||
overflow-y: auto;
|
||||
|
||||
.line-item {
|
||||
font-size: 14px;
|
||||
line-height: 32px;
|
||||
padding: 0 25px 10px 25px;
|
||||
margin: 20px 0;
|
||||
border-bottom: 1px solid #dee0e2;
|
||||
|
||||
|
||||
.title-time {
|
||||
display: flex;
|
||||
|
||||
div:first-child {
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
color: #9da2a8;
|
||||
}
|
||||
|
||||
div:last-child {
|
||||
margin-left: auto;
|
||||
color: #bbbcbd;
|
||||
}
|
||||
}
|
||||
|
||||
.description {
|
||||
color: #bbbcbd;
|
||||
}
|
||||
|
||||
.labels {
|
||||
color: #9da2a8;
|
||||
|
||||
.el-tag {
|
||||
margin: 0 10px 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
157
web_home/src/components/menus/item/FeedbackHistory.vue
Normal file
157
web_home/src/components/menus/item/FeedbackHistory.vue
Normal file
@@ -0,0 +1,157 @@
|
||||
<template>
|
||||
<div style="height: 100%">
|
||||
<div class="menu-title">
|
||||
Ta的喜欢（{{ gorseQo.userId }}）
|
||||
<div class="icon icon-back" @click="backBtn">
|
||||
<i title="返回"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block_box">
|
||||
<div class="line-item-box">
|
||||
<div class="line-item" v-for="(item,index) in list" :key="index">
|
||||
<div class="title-time">
|
||||
<div>{{ item.ItemId }} <el-button @click.native.prevent="similarItem(item)" type="text" size="small">
|
||||
相似条目
|
||||
</el-button></div>
|
||||
<div>{{ item.Timestamp }}</div>
|
||||
</div>
|
||||
<div class="description">{{ item.Comment }}</div>
|
||||
<div class="labels">
|
||||
<el-tag v-for="la in item.Labels">{{ la }}</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '@/utils/request';
|
||||
|
||||
var _this;
|
||||
export default {
|
||||
name: "RecommendItem",
|
||||
data() {
|
||||
return {
|
||||
qo: "",
|
||||
gorseQo: {
|
||||
userId: '',
|
||||
n: 10,
|
||||
recommendation: '_',
|
||||
category: ''
|
||||
},
|
||||
user: {},
|
||||
list: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
_this.qo = _this.$route.query.qo;
|
||||
_this.gorseQo.userId = _this.$route.query.userId;
|
||||
_this.getFeedbackList();
|
||||
},
|
||||
methods: {
|
||||
getFeedbackList() {
|
||||
request({
|
||||
url: '/gorse/get_feedback_list/' + _this.gorseQo.userId + "/like",
|
||||
method: 'get'
|
||||
}).then(res => {
|
||||
res.data.forEach(row => {
|
||||
row.Labels = row.Item.Labels;
|
||||
row.ItemId = row.Item.ItemId;
|
||||
row.Comment = row.Item.Comment;
|
||||
if(_this.list.length < 20) {
|
||||
_this.list.push(row);
|
||||
}
|
||||
});
|
||||
});
|
||||
request({
|
||||
url: '/gorse/get_feedback_list/' + _this.gorseQo.userId + "/star",
|
||||
method: 'get'
|
||||
}).then(res => {
|
||||
res.data.forEach(row => {
|
||||
row.Labels = row.Item.Labels;
|
||||
row.ItemId = row.Item.ItemId;
|
||||
row.Comment = row.Item.Comment;
|
||||
if(_this.list.length < 20) {
|
||||
_this.list.push(row);
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
similarItem(item) {
|
||||
_this.$router.push({
|
||||
path: "similarItem", query: {
|
||||
itemId: item.ItemId
|
||||
}
|
||||
});
|
||||
},
|
||||
backBtn() {
|
||||
this.$router.go(-1);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style src="../../../css/back.css" scoped></style>
|
||||
<style scoped lang="scss">
|
||||
|
||||
.block_box {
|
||||
margin: 25px 25px 0 25px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 3px;
|
||||
height: calc(100% - 120px);
|
||||
|
||||
.title {
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 15px 25px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.demo-form-inline {
|
||||
padding: 25px 25px 0 25px;
|
||||
}
|
||||
|
||||
.line-item-box {
|
||||
height: calc(100% - 40px);
|
||||
overflow-y: auto;
|
||||
width: 100%;
|
||||
|
||||
.line-item {
|
||||
font-size: 14px;
|
||||
line-height: 32px;
|
||||
padding: 0 25px 10px 25px;
|
||||
margin: 20px 0;
|
||||
border-bottom: 1px solid #dee0e2;
|
||||
|
||||
|
||||
.title-time {
|
||||
display: flex;
|
||||
|
||||
div:first-child {
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
color: #9da2a8;
|
||||
}
|
||||
|
||||
div:last-child {
|
||||
margin-left: auto;
|
||||
color: #bbbcbd;
|
||||
}
|
||||
}
|
||||
|
||||
.description {
|
||||
color: #bbbcbd;
|
||||
}
|
||||
|
||||
.labels {
|
||||
color: #9da2a8;
|
||||
|
||||
.el-tag {
|
||||
margin: 0 10px 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
189
web_home/src/components/menus/item/RecommendItem.vue
Normal file
189
web_home/src/components/menus/item/RecommendItem.vue
Normal file
@@ -0,0 +1,189 @@
|
||||
<template>
|
||||
<div style="height: 100%">
|
||||
<div class="menu-title">
|
||||
Ta的推荐（{{ gorseQo.userId }}）
|
||||
<div class="icon icon-back" @click="backBtn">
|
||||
<i title="返回"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block_box">
|
||||
<el-form :inline="true" class="demo-form-inline">
|
||||
<el-form-item>
|
||||
<el-select v-model="gorseQo.recommendation" @change="getRecommendItem">
|
||||
<el-option :key="item.value" :value="item.value" :label="item.label"
|
||||
v-for="item in recommendList"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="种类">
|
||||
<el-select v-model="gorseQo.category" @change="getRecommendItem">
|
||||
<el-option value="" label="无"></el-option>
|
||||
<el-option :key="item.id" :value="item.name" :label="item.name"
|
||||
v-for="item in categoryList"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="line-item-box">
|
||||
<div class="line-item" v-for="item in list" :key="item.id">
|
||||
<el-row>
|
||||
<el-col :span="23">
|
||||
<div class="title-time">
|
||||
<div>{{ item.ItemId }} <el-button @click.native.prevent="similarItem(item)" type="text" size="small">
|
||||
相似条目
|
||||
</el-button></div>
|
||||
<div>{{ item.Timestamp }}</div>
|
||||
</div>
|
||||
<div class="description">{{ item.Comment }}</div>
|
||||
<div class="labels">
|
||||
<el-tag v-for="(la,index) in item.Labels" :key="index">{{ la }}</el-tag>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="1" style="text-align: center;padding-top: 50px">
|
||||
<i class="el-icon-star-off" @click="starItem(item)" style="font-size: 35px;cursor: pointer" title="喜欢"></i>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '@/utils/request';
|
||||
|
||||
var _this;
|
||||
export default {
|
||||
name: "RecommendItem",
|
||||
data() {
|
||||
return {
|
||||
qo: "",
|
||||
gorseQo: {
|
||||
userId: '',
|
||||
n: 10,
|
||||
recommendation: '_',
|
||||
category: ''
|
||||
},
|
||||
user: {},
|
||||
categoryList: [],
|
||||
recommendList: [{
|
||||
label: '默认推荐',
|
||||
value: '_'
|
||||
}, {
|
||||
label: '基于物品推荐',
|
||||
value: 'item_based'
|
||||
}],
|
||||
list: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
_this.qo = _this.$route.query.qo;
|
||||
_this.gorseQo.userId = _this.$route.query.userId;
|
||||
_this.queryCategoryList();
|
||||
_this.getRecommendItem();
|
||||
},
|
||||
methods: {
|
||||
queryCategoryList() {
|
||||
request({
|
||||
url: '/category/query_list',
|
||||
method: 'post',
|
||||
data: {}
|
||||
}).then(res => {
|
||||
_this.categoryList = res.data;
|
||||
});
|
||||
},
|
||||
similarItem(item) {
|
||||
_this.$router.push({
|
||||
path: "similarItem", query: {
|
||||
itemId: item.ItemId
|
||||
}
|
||||
});
|
||||
},
|
||||
getRecommendItem() {
|
||||
request({
|
||||
url: '/gorse/get_recommend_by_user',
|
||||
method: 'post',
|
||||
data: _this.gorseQo
|
||||
}).then(res => {
|
||||
res.data.forEach(row => {
|
||||
row.labelsArr = row.labels ? row.labels.split(',') : [];
|
||||
});
|
||||
_this.list = res.data;
|
||||
});
|
||||
},
|
||||
starItem(item) {
|
||||
request({
|
||||
url: `/gorse/insert_feedback/star/${this.$store.getters.name}/${item.ItemId}`,
|
||||
method: 'post',
|
||||
data: {}
|
||||
}).then(res => {
|
||||
this.$message.success("收藏成功")
|
||||
});
|
||||
},
|
||||
backBtn() {
|
||||
this.$router.go(-1);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style src="../../../css/back.css" scoped></style>
|
||||
<style scoped lang="scss">
|
||||
|
||||
.block_box {
|
||||
margin: 25px 25px 0 25px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 3px;
|
||||
height: calc(100% - 120px);
|
||||
|
||||
.title {
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 15px 25px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.demo-form-inline {
|
||||
padding: 25px 25px 0 25px;
|
||||
}
|
||||
|
||||
.line-item-box {
|
||||
height: calc(100% - 88px);
|
||||
overflow-y: auto;
|
||||
|
||||
.line-item {
|
||||
font-size: 14px;
|
||||
line-height: 32px;
|
||||
padding: 0 25px 10px 25px;
|
||||
margin: 20px 0;
|
||||
border-bottom: 1px solid #dee0e2;
|
||||
|
||||
|
||||
.title-time {
|
||||
display: flex;
|
||||
|
||||
div:first-child {
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
color: #9da2a8;
|
||||
}
|
||||
|
||||
div:last-child {
|
||||
margin-left: auto;
|
||||
color: #bbbcbd;
|
||||
}
|
||||
}
|
||||
|
||||
.description {
|
||||
color: #bbbcbd;
|
||||
}
|
||||
|
||||
.labels {
|
||||
color: #9da2a8;
|
||||
|
||||
.el-tag {
|
||||
margin: 0 10px 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
170
web_home/src/components/menus/item/SimilarItem.vue
Normal file
170
web_home/src/components/menus/item/SimilarItem.vue
Normal file
@@ -0,0 +1,170 @@
|
||||
<template>
|
||||
<div class="similar-item-box">
|
||||
<div class="menu-title">
|
||||
相似推荐（{{ gorseQo.itemId }}）
|
||||
<div class="icon icon-back" @click="backBtn">
|
||||
<i title="返回"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block_box" style="margin-top: 20px">
|
||||
<div class="title">信息</div>
|
||||
<div>
|
||||
<el-form label-width="50px">
|
||||
<el-form-item label="时间">{{ item.Timestamp }}</el-form-item>
|
||||
<el-form-item label="类别">
|
||||
<template v-for="(tag,index) in item.Categories">
|
||||
<el-tag :key="index">{{ tag }}</el-tag>
|
||||
</template>
|
||||
</el-form-item>
|
||||
<el-form-item label="标签">
|
||||
<template v-for="(tag,index) in item.Labels">
|
||||
<el-tag :key="index">{{ tag }}</el-tag>
|
||||
</template>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述">
|
||||
{{ item.Comment }}
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block_box">
|
||||
<div class="title">Related Items</div>
|
||||
<el-form :inline="true" class="demo-form-inline">
|
||||
<el-form-item label="categories">
|
||||
<el-select v-model="gorseQo.category" @change="getSimilarItem">
|
||||
<el-option value="" label="无"></el-option>
|
||||
<el-option :key="item.id" :value="item.name" :label="item.name"
|
||||
v-for="item in categoryList"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="padding-top: 0">
|
||||
<el-table :data="list" style="width: 100%">
|
||||
<el-table-column type="index" label="行号" width="60"></el-table-column>
|
||||
<el-table-column prop="ItemId" label="fid"></el-table-column>
|
||||
<el-table-column prop="labels" label="类别">
|
||||
<div slot-scope="scope">
|
||||
<template v-if="scope.row.Categories">
|
||||
<template v-for="(tag,index) in scope.row.Categories">
|
||||
<el-tag :key="index" v-if="index < 5">{{ tag }}</el-tag>
|
||||
</template>
|
||||
<el-tag v-if="scope.row.Categories.length > 5">...</el-tag>
|
||||
</template>
|
||||
</div>
|
||||
</el-table-column>
|
||||
<el-table-column prop="labels" label="标签">
|
||||
<div slot-scope="scope">
|
||||
<template v-if="scope.row.Labels">
|
||||
<template v-for="(tag,index) in scope.row.Labels">
|
||||
<el-tag :key="index" v-if="index < 10">{{ tag }}</el-tag>
|
||||
</template>
|
||||
<el-tag v-if="scope.row.Labels.length > 10">...</el-tag>
|
||||
</template>
|
||||
</div>
|
||||
</el-table-column>
|
||||
<el-table-column prop="Comment" label="描述">
|
||||
<template slot-scope="scope" v-if="scope.row.Comment">
|
||||
{{ scope.row.Comment.substring(0, 100) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="Score" label="相似度 [0, 1]" width="100">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.Score.toFixed(5) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="Timestamp" label="创建时间" width="200"></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '@/utils/request';
|
||||
|
||||
var _this;
|
||||
export default {
|
||||
name: "similarItem",
|
||||
data() {
|
||||
return {
|
||||
qo: "",
|
||||
gorseQo: {
|
||||
itemId: '',
|
||||
category: '',
|
||||
n: 10
|
||||
},
|
||||
item: {},
|
||||
list: [],
|
||||
categoryList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
_this.qo = _this.$route.query.qo;
|
||||
_this.gorseQo.itemId = _this.$route.query.itemId;
|
||||
_this.queryCategoryList();
|
||||
_this.queryItem();
|
||||
_this.getSimilarItem();
|
||||
},
|
||||
methods: {
|
||||
queryCategoryList() {
|
||||
request({
|
||||
url: '/category/query_list',
|
||||
method: 'post',
|
||||
data: {}
|
||||
}).then(res => {
|
||||
_this.categoryList = res.data;
|
||||
});
|
||||
},
|
||||
queryItem() {
|
||||
request({
|
||||
url: '/gorse/get_item/' + _this.gorseQo.itemId,
|
||||
method: 'get',
|
||||
}).then(res => {
|
||||
_this.item = res.data;
|
||||
});
|
||||
},
|
||||
getSimilarItem() {
|
||||
request({
|
||||
url: '/gorse/get_similar_item',
|
||||
method: 'post',
|
||||
data: _this.gorseQo
|
||||
}).then(res => {
|
||||
_this.list = res.data;
|
||||
});
|
||||
},
|
||||
backBtn() {
|
||||
this.$router.go(-1);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style src="../../../css/back.css" scoped></style>
|
||||
<style scoped lang="scss">
|
||||
|
||||
.similar-item-box {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
|
||||
.block_box {
|
||||
margin: 25px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 3px;
|
||||
|
||||
.title {
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 15px 25px;
|
||||
}
|
||||
|
||||
> div {
|
||||
padding: 25px;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.demo-form-inline {
|
||||
padding: 25px 25px 0 25px;
|
||||
}
|
||||
</style>
|
||||
228
web_home/src/components/menus/user/ImportUser.vue
Normal file
228
web_home/src/components/menus/user/ImportUser.vue
Normal file
@@ -0,0 +1,228 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="menu-title">
|
||||
导入用户
|
||||
<div class="icon icon-back" @click="backBtn">
|
||||
<i title="返回"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block_box" style="margin-top: 20px;padding: 20px">
|
||||
<el-form ref="cmd" label-width="100px" :rules="rules" :model="cmd" :inline="true">
|
||||
<el-form-item label="文件" prop="file">
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
action="#"
|
||||
:auto-upload="false"
|
||||
accept=".csv"
|
||||
:on-change="handleFileChange"
|
||||
:limit="1"
|
||||
:show-file-list="false">
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传csv文件</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<br/>
|
||||
<el-form-item label="字段分隔符" prop="field">
|
||||
<el-input v-model="cmd.field" placeholder="请输入字段分隔符" style="width: 300px"
|
||||
@change="handleFieldChange"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="类别分隔符" prop="categories">
|
||||
<el-input v-model="cmd.categories" placeholder="请输入类别分隔符" style="width: 300px"></el-input>
|
||||
</el-form-item>
|
||||
<br/>
|
||||
<el-form-item label="唯一ID" prop="id">
|
||||
<el-select v-model="cmd.id" style="width: 300px" @change="refreshList">
|
||||
<template v-if="cmd.ifFirstHead">
|
||||
<el-option :value="index" :label="item" v-for="(item,index) in columnList" :key="index"></el-option>
|
||||
</template>
|
||||
<template v-if="!cmd.ifFirstHead">
|
||||
<el-option :value="index" :label="index" v-for="(item,index) in columnList" :key="index"></el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" prop="labels">
|
||||
<el-select v-model="cmd.labels" style="width: 300px" @change="refreshList">
|
||||
<template v-if="cmd.ifFirstHead">
|
||||
<el-option :value="index" :label="item" v-for="(item,index) in columnList" :key="index"></el-option>
|
||||
</template>
|
||||
<template v-if="!cmd.ifFirstHead">
|
||||
<el-option :value="index" :label="index" v-for="(item,index) in columnList" :key="index"></el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<br/>
|
||||
<el-form-item label=" ">
|
||||
<el-checkbox label="第一行为表头" v-model="cmd.ifFirstHead" @change="refreshList"></el-checkbox>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table :data="list" style="width: 100%" height="400" v-show="list.length > 0">
|
||||
<el-table-column type="index" label="行号" width="60"></el-table-column>
|
||||
<el-table-column prop="id" :label="'ID('+(cmd.ifFirstHead ? columnList[cmd.id] : cmd.id)+')'"></el-table-column>
|
||||
<el-table-column prop="labels" :label="'标签('+(cmd.ifFirstHead ? columnList[cmd.labels] : cmd.labels)+')'">
|
||||
<template v-slot="scope">
|
||||
<label style="color: red" v-if="scope.row.errorFlag">JSON格式化异常</label>
|
||||
<label v-if="!scope.row.errorFlag">{{ scope.row.labels }}</label>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-button type="primary" class="submit-btn" @click="confirmSubmit" :disabled="list.length === 0">确认提交</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '@/utils/request';
|
||||
|
||||
var _this;
|
||||
export default {
|
||||
name: "ImportUser",
|
||||
data() {
|
||||
return {
|
||||
cmd: {
|
||||
field: ',',
|
||||
categories: '|',
|
||||
id: '',
|
||||
labels: '',
|
||||
ifFirstHead: true
|
||||
},
|
||||
file: [],
|
||||
originList: [], // 原始的可能包含表头的数据，默认存储最多21行（如果数据不止21行的话）
|
||||
list: [], // 页面table显示的数据
|
||||
columnList: [],// 上传csv的表头
|
||||
rules: {
|
||||
fid: [
|
||||
{required: true, message: '请选择文件'}
|
||||
],
|
||||
field: [
|
||||
{required: true, message: '字段分隔符不能为空'}
|
||||
],
|
||||
categories: [
|
||||
{required: true, message: '类别分隔符不能为空'}
|
||||
],
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
},
|
||||
methods: {
|
||||
handleFileChange(file, fileList) {
|
||||
_this.file = file.raw;
|
||||
if(_this.cmd.field.length > 0) {
|
||||
_this.handleFieldChange();
|
||||
}
|
||||
},
|
||||
handleFieldChange() {
|
||||
this.$papa.parse(_this.file, {
|
||||
delimiter: _this.cmd.field,
|
||||
complete: (results) => {
|
||||
_this.originList = results.data.slice(0, 21);
|
||||
// 提前填充一个默认的值给对应的ID列和标签列
|
||||
_this.prepareFieldAndLabels();
|
||||
_this.refreshList();
|
||||
}
|
||||
})
|
||||
},
|
||||
prepareFieldAndLabels() {
|
||||
_this.columnList = _this.originList[0];
|
||||
_this.cmd.id = 0;
|
||||
_this.cmd.labels = 1;
|
||||
},
|
||||
refreshList() {
|
||||
// 处理原始数据，将行文本截取成数组放入list
|
||||
_this.list = [];
|
||||
if (_this.cmd.field.length === 0) {
|
||||
return;
|
||||
}
|
||||
for (let i in _this.originList) {
|
||||
if (_this.cmd.ifFirstHead && i == 0) {
|
||||
// 第一行是表头，跳过list塞入
|
||||
continue;
|
||||
}
|
||||
let row = _this.originList[i];
|
||||
let errorFlag = false;
|
||||
try {
|
||||
JSON.parse(row[_this.cmd.labels]);
|
||||
} catch (e) {
|
||||
errorFlag = true;
|
||||
}
|
||||
_this.list.push({
|
||||
id: row[_this.cmd.id],
|
||||
labels: row[_this.cmd.labels],
|
||||
errorFlag: errorFlag
|
||||
});
|
||||
}
|
||||
},
|
||||
confirmSubmit() { // 提交确认
|
||||
this.$refs.cmd.validate((valid) => {
|
||||
let formData = new FormData();
|
||||
formData.append("sep", _this.cmd.field);
|
||||
formData.append("has-header", _this.cmd.ifFirstHead);
|
||||
formData.append("label-sep", _this.cmd.categories);
|
||||
formData.append("file", _this.file);
|
||||
let idIndex = _this.cmd.id;
|
||||
let labelIndex = _this.cmd.labels;
|
||||
let _format = '';
|
||||
for (let i = 0; i <= Math.max(idIndex, labelIndex); i++) {
|
||||
if (i == idIndex) {
|
||||
_format += "u";
|
||||
} else if (i == labelIndex) {
|
||||
_format += "l";
|
||||
} else {
|
||||
_format += "_";
|
||||
}
|
||||
}
|
||||
formData.append("format", _format);
|
||||
request({
|
||||
url: '/gorse/bulk/users',
|
||||
method: 'put',
|
||||
data: formData
|
||||
}).then(res => {
|
||||
if(res.data && res.data.RowAffected) {
|
||||
_this.$message.success(`成功导入${res.data.RowAffected}条记录`);
|
||||
} else {
|
||||
_this.$message.warning("导入异常");
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
backBtn() {
|
||||
this.$router.push({
|
||||
path: "userManage", query: {
|
||||
qo: JSON.stringify({
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
LIKES_fid: '',
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style src="../../../css/back.css" scoped></style>
|
||||
<style scoped lang="scss">
|
||||
|
||||
.block_box {
|
||||
margin: 25px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 3px;
|
||||
|
||||
.title {
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 15px 25px;
|
||||
}
|
||||
|
||||
> div {
|
||||
padding: 25px;
|
||||
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
margin-left: auto;
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
118
web_home/src/components/menus/user/LinkUser.vue
Normal file
118
web_home/src/components/menus/user/LinkUser.vue
Normal file
@@ -0,0 +1,118 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="menu-title">
|
||||
Ta的好友（{{ userId }}）
|
||||
<div class="icon icon-back" @click="backBtn">
|
||||
<i title="返回"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block_box" style="margin-top: 10px">
|
||||
<div class="title">信息</div>
|
||||
<div>
|
||||
<el-form label-width="100px">
|
||||
<el-form-item label="标签">
|
||||
<template v-for="(tag,index) in user.labelsArr">
|
||||
<el-tag :key="index">{{ tag }}</el-tag>
|
||||
</template>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block_box">
|
||||
<div class="title">Association Items</div>
|
||||
<div>
|
||||
<el-table :data="list" style="width: 100%">
|
||||
<el-table-column type="index" label="行号" width="60"></el-table-column>
|
||||
<el-table-column prop="vid" label="UserId"></el-table-column>
|
||||
<el-table-column label="操作" width="210">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click.native.prevent="recommendItem(scope.row)" type="text" size="small">
|
||||
查看推荐
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '@/utils/request';
|
||||
|
||||
var _this;
|
||||
export default {
|
||||
name: "linkUser",
|
||||
data() {
|
||||
return {
|
||||
qo: "",
|
||||
userId: '',
|
||||
user: {},
|
||||
list: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
_this.qo = _this.$route.query.qo;
|
||||
_this.userId = _this.$route.query.userId;
|
||||
_this.queryUser();
|
||||
_this.getLinkUser();
|
||||
},
|
||||
methods: {
|
||||
queryUser() {
|
||||
request({
|
||||
url: '/risk-user/query_unique',
|
||||
method: 'post',
|
||||
data: {
|
||||
EQS_fid: _this.userId
|
||||
}
|
||||
}).then(res => {
|
||||
res.data.labelsArr = res.data.labels ? res.data.labels.split(',') : [];
|
||||
_this.user = res.data;
|
||||
});
|
||||
},
|
||||
getLinkUser() {
|
||||
let space = 'user_relation';
|
||||
request({
|
||||
url: `/nebula_operate/findonepathbyidwithrelation/${space}/${_this.userId}`,
|
||||
method: 'post',
|
||||
data: {
|
||||
relations: ['edge_768395026']
|
||||
}
|
||||
}).then(res => {
|
||||
_this.list = res.data.nodes;
|
||||
});
|
||||
},
|
||||
recommendItem(item) {
|
||||
_this.$router.push({
|
||||
path: "recommendItem", query: {
|
||||
userId: item.vid,
|
||||
qo: JSON.stringify(_this.qo)
|
||||
}
|
||||
});
|
||||
},
|
||||
backBtn() {
|
||||
this.$router.go(-1);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style src="../../../css/back.css" scoped></style>
|
||||
<style scoped lang="scss">
|
||||
|
||||
.block_box {
|
||||
margin: 25px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 3px;
|
||||
|
||||
.title {
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 15px 25px;
|
||||
}
|
||||
|
||||
>div {
|
||||
padding: 25px;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
133
web_home/src/components/menus/user/SimilarUser.vue
Normal file
133
web_home/src/components/menus/user/SimilarUser.vue
Normal file
@@ -0,0 +1,133 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="menu-title">
|
||||
相似用户（{{ userId }}）
|
||||
<div class="icon icon-back" @click="backBtn">
|
||||
<i title="返回"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block_box" style="margin-top: 20px">
|
||||
<div class="title">信息</div>
|
||||
<div>
|
||||
<el-form label-width="100px">
|
||||
<el-form-item label="标签">
|
||||
<template v-for="(tag,index) in user.labelsArr">
|
||||
<el-tag :key="index">{{ tag }}</el-tag>
|
||||
</template>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block_box">
|
||||
<div class="title">Related Items</div>
|
||||
<div>
|
||||
<el-table :data="list" style="width: 100%">
|
||||
<el-table-column type="index" label="行号" width="60"></el-table-column>
|
||||
<el-table-column prop="UserId" label="UserId"></el-table-column>
|
||||
<el-table-column prop="labels" label="标签">
|
||||
<div slot-scope="scope">
|
||||
<template v-for="(tag,index) in scope.row.labelsArr">
|
||||
<el-tag :key="index" v-if="index < 5">{{ tag }}</el-tag>
|
||||
</template>
|
||||
<el-tag v-if="scope.row.labelsArr.length > 5">...</el-tag>
|
||||
</div>
|
||||
</el-table-column>
|
||||
<el-table-column prop="Score" label="相似度 [0, 1]">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.Score.toFixed(5)}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="210">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click.native.prevent="recommendItem(scope.row)" type="text" size="small">
|
||||
查看推荐
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '@/utils/request';
|
||||
|
||||
var _this;
|
||||
export default {
|
||||
name: "similarUser",
|
||||
data() {
|
||||
return {
|
||||
qo: "",
|
||||
userId: '',
|
||||
user: {},
|
||||
list: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
_this = this;
|
||||
_this.qo = _this.$route.query.qo;
|
||||
_this.userId = _this.$route.query.userId;
|
||||
_this.queryUser();
|
||||
_this.getSimilarUser();
|
||||
},
|
||||
methods: {
|
||||
queryUser() {
|
||||
request({
|
||||
url: '/risk-user/query_unique',
|
||||
method: 'post',
|
||||
data: {
|
||||
EQS_fid: _this.userId
|
||||
}
|
||||
}).then(res => {
|
||||
res.data.labelsArr = res.data.labels ? res.data.labels.split(',') : [];
|
||||
_this.user = res.data;
|
||||
});
|
||||
},
|
||||
getSimilarUser() {
|
||||
request({
|
||||
url: '/gorse/get_similar_user',
|
||||
method: 'post',
|
||||
data: {
|
||||
userId: _this.userId
|
||||
}
|
||||
}).then(res => {
|
||||
res.data.forEach(row => {
|
||||
row.labelsArr = row.labels ? row.labels.split(',') : [];
|
||||
});
|
||||
_this.list = res.data;
|
||||
});
|
||||
},
|
||||
recommendItem(item) {
|
||||
_this.$router.push({
|
||||
path: "recommendItem", query: {
|
||||
userId: item.UserId,
|
||||
qo: JSON.stringify(_this.qo)
|
||||
}
|
||||
});
|
||||
},
|
||||
backBtn() {
|
||||
this.$router.go(-1);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style src="../../../css/back.css" scoped></style>
|
||||
<style scoped lang="scss">
|
||||
|
||||
.block_box {
|
||||
margin: 25px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 3px;
|
||||
|
||||
.title {
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 15px 25px;
|
||||
}
|
||||
|
||||
>div {
|
||||
padding: 25px;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user