Merge branch 'dev-lmr'
# Conflicts: # manager/src/views/page/article-manage/hotWords.vuemaster
Chopper
commit
37064141c2
|
|
@ -439,11 +439,23 @@ export const setHotWords = (params) => {
|
|||
};
|
||||
|
||||
// 删除热搜词
|
||||
export const deleteHotWords = (words) => {
|
||||
return deleteRequest(`/hotwords/hotwords/${words}`);
|
||||
export const deleteHotWords = (params) => {
|
||||
return deleteRequest(`/hotwords/hotwords`,params);
|
||||
};
|
||||
|
||||
// 获取热搜词
|
||||
export const getHotWords = () => {
|
||||
return getRequest(`/hotwords/hotwords`);
|
||||
};
|
||||
|
||||
// 获取热词统计
|
||||
export const getHotWordsStatistics = (params) => {
|
||||
return getRequest(`/hotwords/hotwords/statistics`,params);
|
||||
};
|
||||
|
||||
// 获取历史热词
|
||||
export const getHotWordsHistory = (params) => {
|
||||
return getRequest(`/hotwords/hotwords/history`,params);
|
||||
};
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@ const app = {
|
|||
path: '',
|
||||
name: 'home_index'
|
||||
}],
|
||||
hotWords:[], //今日热词数据
|
||||
// 面包屑数组 左侧菜单
|
||||
menuList: [],
|
||||
tagsList: [...otherRouter.children], //这块是面包屑的内容不能删除
|
||||
|
|
|
|||
|
|
@ -0,0 +1,157 @@
|
|||
<template>
|
||||
<div class="search">
|
||||
<Card>
|
||||
<Row class="operation">
|
||||
<Button @click="add()" type="primary">设置今日热词</Button>
|
||||
</Row>
|
||||
<Row>
|
||||
<p>
|
||||
<Alert type="success">
|
||||
这里展示今日系统中搜索前一百的搜索热词，分数为热词在排序系统中的分数，分数越高，可以在用户获取热词时进行优先展示（首页商品搜索栏下方推荐位）（分数可以填写负数，会降低推荐度）
|
||||
</Alert>
|
||||
</p>
|
||||
</Row>
|
||||
|
||||
<div class="card-list">
|
||||
<Card v-for="words in data" class="card-item" :key="words" onclick="">
|
||||
<p>
|
||||
<a href="#" slot="extra" @click.prevent="add(words)">{{ words }}</a>
|
||||
</p>
|
||||
<p slot="extra">
|
||||
<a @click="deleteWords(words)">
|
||||
<Icon type="md-close"/>
|
||||
</a>
|
||||
</p>
|
||||
</Card>
|
||||
</div>
|
||||
</Card>
|
||||
<Modal :title="modalTitle" v-model="modalVisible" :mask-closable="false" :width="500">
|
||||
<Form ref="form" :model="form" :label-width="100" :rules="formValidate">
|
||||
<FormItem label="热词" prop="keywords">
|
||||
<Input v-model="form.keywords" clearable style="width: 100%"/>
|
||||
</FormItem>
|
||||
<FormItem label="分数" prop="point">
|
||||
<Input v-model="form.point" clearable style="width: 100%"/>
|
||||
</FormItem>
|
||||
</Form>
|
||||
<div slot="footer">
|
||||
<Button type="text" @click="modalVisible = false">取消</Button>
|
||||
<Button type="primary" :loading="submitLoading" @click="handleSubmit"
|
||||
>提交
|
||||
</Button
|
||||
>
|
||||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getHotWords, setHotWords, deleteHotWords} from "@/api/index";
|
||||
|
||||
import {regular} from "@/utils";
|
||||
|
||||
export default {
|
||||
name: "hotWords",
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
submitLoading: false,
|
||||
modalTitle: "",
|
||||
loading: true, // 表单加载状态
|
||||
modalVisible: false, //弹出框
|
||||
form: {
|
||||
keywords: "",
|
||||
point: 0,
|
||||
},
|
||||
data: [], // 表单数据
|
||||
|
||||
// 表单验证规则
|
||||
formValidate: {
|
||||
keywords: [regular.REQUIRED, regular.VARCHAR20],
|
||||
point: [regular.REQUIRED, regular.NUMBER],
|
||||
},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.getDataList();
|
||||
},
|
||||
getDataList() {
|
||||
this.loading = true;
|
||||
getHotWords().then((res) => {
|
||||
this.loading = false;
|
||||
if (res.success) {
|
||||
this.data = res.result;
|
||||
}
|
||||
});
|
||||
this.loading = false;
|
||||
},
|
||||
handleSubmit() {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.submitLoading = true;
|
||||
setHotWords(this.form).then((res) => {
|
||||
this.submitLoading = false;
|
||||
if (res.success) {
|
||||
this.$Message.success("操作成功");
|
||||
this.getDataList();
|
||||
this.modalVisible = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
//设置热词优先
|
||||
add(words) {
|
||||
this.modalType = 0;
|
||||
this.modalTitle = "设置热词";
|
||||
if (words) {
|
||||
this.form.keywords = words;
|
||||
} else {
|
||||
this.form.keywords = "";
|
||||
}
|
||||
this.form.point = 1;
|
||||
this.modalVisible = true;
|
||||
},
|
||||
deleteWords(words) {
|
||||
this.$Modal.confirm({
|
||||
title: "是否确定删除热词",
|
||||
content: "<p>您确定要删除此热词吗？</p>",
|
||||
okText: "确实",
|
||||
cancelText: "取消",
|
||||
onOk: () => {
|
||||
let params = {words: words}
|
||||
deleteHotWords(params).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("删除成功");
|
||||
this.getDataList();
|
||||
}
|
||||
});
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.card-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.card-item {
|
||||
min-width: 100px;
|
||||
margin: 20px;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.ivu-card-extra {
|
||||
right: 3px;
|
||||
top: 15px;
|
||||
z-index: 99;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,157 @@
|
|||
<template>
|
||||
<div class="search">
|
||||
<Card>
|
||||
<Row class="operation">
|
||||
<Button @click="add()" type="primary">设置今日热词</Button>
|
||||
</Row>
|
||||
<Row>
|
||||
<p>
|
||||
<Alert type="success">
|
||||
这里展示今日系统中搜索前一百的搜索热词，分数为热词在排序系统中的分数，分数越高，可以在用户获取热词时进行优先展示（首页商品搜索栏下方推荐位）（分数可以填写负数，会降低推荐度）
|
||||
</Alert>
|
||||
</p>
|
||||
</Row>
|
||||
|
||||
<div class="card-list">
|
||||
<Card v-for="words in data" class="card-item" :key="words" onclick="">
|
||||
<p>
|
||||
<a href="#" slot="extra" @click.prevent="add(words)">{{ words }}</a>
|
||||
</p>
|
||||
<p slot="extra">
|
||||
<a @click="deleteWords(words)">
|
||||
<Icon type="md-close"/>
|
||||
</a>
|
||||
</p>
|
||||
</Card>
|
||||
</div>
|
||||
</Card>
|
||||
<Modal :title="modalTitle" v-model="modalVisible" :mask-closable="false" :width="500">
|
||||
<Form ref="form" :model="form" :label-width="100" :rules="formValidate">
|
||||
<FormItem label="热词" prop="keywords">
|
||||
<Input v-model="form.keywords" clearable style="width: 100%"/>
|
||||
</FormItem>
|
||||
<FormItem label="分数" prop="point">
|
||||
<Input v-model="form.point" clearable style="width: 100%"/>
|
||||
</FormItem>
|
||||
</Form>
|
||||
<div slot="footer">
|
||||
<Button type="text" @click="modalVisible = false">取消</Button>
|
||||
<Button type="primary" :loading="submitLoading" @click="handleSubmit"
|
||||
>提交
|
||||
</Button
|
||||
>
|
||||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getHotWords, setHotWords, deleteHotWords} from "@/api/index";
|
||||
|
||||
import {regular} from "@/utils";
|
||||
|
||||
export default {
|
||||
name: "hotWords",
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
submitLoading: false,
|
||||
modalTitle: "",
|
||||
loading: true, // 表单加载状态
|
||||
modalVisible: false, //弹出框
|
||||
form: {
|
||||
keywords: "",
|
||||
point: 0,
|
||||
},
|
||||
data: [], // 表单数据
|
||||
|
||||
// 表单验证规则
|
||||
formValidate: {
|
||||
keywords: [regular.REQUIRED, regular.VARCHAR20],
|
||||
point: [regular.REQUIRED, regular.NUMBER],
|
||||
},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.getDataList();
|
||||
},
|
||||
getDataList() {
|
||||
this.loading = true;
|
||||
getHotWords().then((res) => {
|
||||
this.loading = false;
|
||||
if (res.success) {
|
||||
this.data = res.result;
|
||||
}
|
||||
});
|
||||
this.loading = false;
|
||||
},
|
||||
handleSubmit() {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.submitLoading = true;
|
||||
setHotWords(this.form).then((res) => {
|
||||
this.submitLoading = false;
|
||||
if (res.success) {
|
||||
this.$Message.success("操作成功");
|
||||
this.getDataList();
|
||||
this.modalVisible = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
//设置热词优先
|
||||
add(words) {
|
||||
this.modalType = 0;
|
||||
this.modalTitle = "设置热词";
|
||||
if (words) {
|
||||
this.form.keywords = words;
|
||||
} else {
|
||||
this.form.keywords = "";
|
||||
}
|
||||
this.form.point = 1;
|
||||
this.modalVisible = true;
|
||||
},
|
||||
deleteWords(words) {
|
||||
this.$Modal.confirm({
|
||||
title: "是否确定删除热词",
|
||||
content: "<p>您确定要删除此热词吗？</p>",
|
||||
okText: "确实",
|
||||
cancelText: "取消",
|
||||
onOk: () => {
|
||||
let params = {words: words}
|
||||
deleteHotWords(params).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("删除成功");
|
||||
this.getDataList();
|
||||
}
|
||||
});
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.card-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.card-item {
|
||||
min-width: 100px;
|
||||
margin: 20px;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.ivu-card-extra {
|
||||
right: 3px;
|
||||
top: 15px;
|
||||
z-index: 99;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,145 @@
|
|||
<template>
|
||||
<div class="layout">
|
||||
<Form ref="formValidate" :label-width="150" label-position="right" :model="formValidate" :rules="ruleValidate">
|
||||
|
||||
<FormItem class="label-item" v-for="(point,index) in formValidate.pointSettingItems" :key="index"
|
||||
:label="'签到设置'+(index+1)">
|
||||
<div class="label-item">
|
||||
|
||||
<InputNumber :min="1" v-model="point.day"></InputNumber>
|
||||
|
||||
<InputNumber :min="0" v-model="point.point"></InputNumber>
|
||||
|
||||
<Button ghost type="error" @click="delSign(point,index)">删除</Button>
|
||||
<span class="ml_10">签到<span class="theme_color">{{ point.day }}</span>天，赠送<span
|
||||
class="theme_color">{{ point.point }}</span>积分</span>
|
||||
</div>
|
||||
|
||||
</FormItem>
|
||||
<FormItem label="操作：">
|
||||
<Button @click="addSign">新增签到</Button>
|
||||
</FormItem>
|
||||
<div class="label-btns">
|
||||
<Button type="primary" @click="submit('formValidate')">保存</Button>
|
||||
</div>
|
||||
</Form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {setSetting} from "@/api/index";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
formValidate: {}, // 表单数据
|
||||
};
|
||||
},
|
||||
props: ["res", "type"],
|
||||
created() {
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
// 保存
|
||||
submit(name) {
|
||||
let that = this;
|
||||
this.setupSetting();
|
||||
},
|
||||
// 保存设置
|
||||
setupSetting() {
|
||||
setSetting(this.type, this.formValidate).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("保存成功!");
|
||||
} else {
|
||||
this.$Message.error("保存失败!");
|
||||
}
|
||||
});
|
||||
},
|
||||
delSign(item, index) {
|
||||
this.formValidate.pointSettingItems.splice(index, 1);
|
||||
},
|
||||
addSign() {
|
||||
if (this.formValidate.pointSettingItems.length >= 5) {
|
||||
this.$Message.error({
|
||||
content: "最多设置5项签到设置",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
this.formValidate.pointSettingItems.push({
|
||||
point: "0",
|
||||
day: this.formValidate.pointSettingItems.length,
|
||||
});
|
||||
},
|
||||
// 实例化数据
|
||||
init() {
|
||||
this.res = JSON.parse(this.res);
|
||||
Object.keys(this.res).map((item) => {
|
||||
if (item == "pointSettingItems") {
|
||||
return false;
|
||||
}
|
||||
this.res[item] += "";
|
||||
});
|
||||
|
||||
this.$set(this, "formValidate", {...this.res});
|
||||
|
||||
Object.keys(this.formValidate).forEach((item) => {
|
||||
this.ruleValidate[item] = [
|
||||
{
|
||||
required: true,
|
||||
message: "请填写必填项",
|
||||
trigger: "blur",
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (value < 0) {
|
||||
callback(new Error("不能输入负数！"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
trigger: "change",
|
||||
},
|
||||
];
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "./style.scss";
|
||||
|
||||
.label-item {
|
||||
display: flex;
|
||||
|
||||
> .ivu-input-number {
|
||||
width: 100px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
> .ivu-input-number:nth-last-of-type(1) {
|
||||
width: 150px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
> .ivu-input {
|
||||
width: 100px;
|
||||
margin: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/ .ivu-input {
|
||||
width: 70px !important;
|
||||
}
|
||||
|
||||
.ivu-input-wrapper {
|
||||
width: 70px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.label-btns {
|
||||
/deep/ .ivu-btn {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,161 +1,71 @@
|
|||
<template>
|
||||
<div class="search">
|
||||
<Card>
|
||||
<Row class="operation">
|
||||
<Button @click="add()" type="primary">设置今日热词</Button>
|
||||
<Button @click="deleteWords('')" type="primary">清空热词</Button>
|
||||
</Row>
|
||||
<Row>
|
||||
<p>
|
||||
<Alert type="success">
|
||||
这里展示今日系统中搜索前一百的搜索热词，分数为热词在排序系统中的分数，分数越高，可以在用户获取热词时进行优先展示（首页商品搜索栏下方推荐位）（分数可以填写负数，会降低推荐度）
|
||||
</Alert>
|
||||
</p>
|
||||
</Row>
|
||||
|
||||
<div class="card-list">
|
||||
<Card v-for="words in data" class="card-item" :key="words" onclick="">
|
||||
<p>
|
||||
<a href="#" slot="extra" @click.prevent="add(words)">{{ words }}</a>
|
||||
</p>
|
||||
<p slot="extra">
|
||||
<a @click="deleteWords(words)">
|
||||
<Icon type="md-close" />
|
||||
</a>
|
||||
</p>
|
||||
</Card>
|
||||
</div>
|
||||
</Card>
|
||||
<Modal :title="modalTitle" v-model="modalVisible" :mask-closable="false" :width="500">
|
||||
<Form ref="form" :model="form" :label-width="100" :rules="formValidate">
|
||||
<FormItem label="热词" prop="keywords">
|
||||
<Input v-model="form.keywords" clearable style="width: 100%" />
|
||||
</FormItem>
|
||||
<FormItem label="分数" prop="point">
|
||||
<Input v-model="form.point" clearable style="width: 100%" />
|
||||
</FormItem>
|
||||
</Form>
|
||||
<div slot="footer">
|
||||
<Button type="text" @click="modalVisible = false">取消</Button>
|
||||
<Button type="primary" :loading="submitLoading" @click="handleSubmit"
|
||||
>提交</Button
|
||||
<Tabs @on-click="handleClickTab">
|
||||
<TabPane
|
||||
v-for="(item, index) in templatesWay"
|
||||
:key="index"
|
||||
:name="item.template"
|
||||
:label="item.label"
|
||||
>
|
||||
</div>
|
||||
</Modal>
|
||||
<components v-if="item.template == currentTemplate" :is="currentTemplate"></components>
|
||||
</TabPane>
|
||||
</Tabs>
|
||||
</Card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getHotWords, setHotWords, deleteHotWords } from "@/api/index";
|
||||
|
||||
import { regular } from "@/utils";
|
||||
import todayHotWords from "./template/todayHotWords";
|
||||
import historyHotWords from "./template/historyHotWords";
|
||||
import setupHotWords from "./template/setupHotWords";
|
||||
import statisticsHotWords from "./template/statisticsHotWords";
|
||||
export default {
|
||||
name: "hotWords",
|
||||
components: {},
|
||||
components: {
|
||||
todayHotWords,
|
||||
historyHotWords,
|
||||
setupHotWords,
|
||||
statisticsHotWords
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
submitLoading: false,
|
||||
modalTitle: "",
|
||||
loading: true, // 表单加载状态
|
||||
modalVisible: false, //弹出框
|
||||
form: {
|
||||
keywords: "",
|
||||
point: 0,
|
||||
// 模版集合key value
|
||||
templatesWay: [
|
||||
{
|
||||
template: "todayHotWords",
|
||||
label: "今日热次",
|
||||
},
|
||||
data: [], // 表单数据
|
||||
|
||||
// 表单验证规则
|
||||
formValidate: {
|
||||
keywords: [regular.REQUIRED, regular.VARCHAR20],
|
||||
point: [regular.REQUIRED, regular.NUMBER],
|
||||
{
|
||||
template: "historyHotWords",
|
||||
label: "历史热词",
|
||||
},
|
||||
{
|
||||
template: "statisticsHotWords",
|
||||
label: "热词统计",
|
||||
},
|
||||
{
|
||||
template: "setupHotWords",
|
||||
label: "设置热词",
|
||||
},
|
||||
],
|
||||
// 引入模板
|
||||
templates: {
|
||||
todayHotWords,
|
||||
historyHotWords,
|
||||
setupHotWords,
|
||||
statisticsHotWords
|
||||
},
|
||||
// 当前模版
|
||||
currentTemplate: "todayHotWords",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.getDataList();
|
||||
},
|
||||
getDataList() {
|
||||
this.loading = true;
|
||||
getHotWords().then((res) => {
|
||||
this.loading = false;
|
||||
if (res.success) {
|
||||
this.data = res.result;
|
||||
}
|
||||
});
|
||||
this.loading = false;
|
||||
},
|
||||
handleSubmit() {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.submitLoading = true;
|
||||
setHotWords(this.form).then((res) => {
|
||||
this.submitLoading = false;
|
||||
if (res.success) {
|
||||
this.$Message.success("操作成功");
|
||||
this.getDataList();
|
||||
this.modalVisible = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
//设置热词优先
|
||||
add(words) {
|
||||
this.modalType = 0;
|
||||
this.modalTitle = "设置热词";
|
||||
if (words) {
|
||||
this.form.keywords = words;
|
||||
} else {
|
||||
this.form.keywords = "";
|
||||
}
|
||||
this.form.point = 1;
|
||||
this.modalVisible = true;
|
||||
},
|
||||
deleteWords(words) {
|
||||
let title = "是否确定删除热词";
|
||||
let content = "<p>您确定要删除此热词吗？</p>";
|
||||
if (words === '') {
|
||||
title = "是否确定清空热词";
|
||||
content = "<p>您确定要清空热词吗？</p>";
|
||||
}
|
||||
this.$Modal.confirm({
|
||||
title: title,
|
||||
content: content,
|
||||
okText: "确定",
|
||||
cancelText: "取消",
|
||||
onOk: () => {
|
||||
deleteHotWords(words).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("删除成功");
|
||||
this.getDataList();
|
||||
}
|
||||
});
|
||||
},
|
||||
});
|
||||
handleClickTab(val) {
|
||||
this.currentTemplate = val;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.card-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.card-item {
|
||||
min-width: 100px;
|
||||
margin: 20px;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.ivu-card-extra{
|
||||
right: 3px;
|
||||
top:15px;
|
||||
z-index: 99;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped></style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,22 @@
|
|||
/deep/ .ivu-input{
|
||||
width: 200px !important;
|
||||
}
|
||||
|
||||
.label-btns{
|
||||
margin-left: 150px;
|
||||
}
|
||||
|
||||
.ivu-form-item{
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
|
||||
.ivu-input-wrapper {
|
||||
width: 150px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
/deep/ .ivu-form-item-content {
|
||||
margin-left: 0 !important;
|
||||
display: flex;
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import HOTWORD_SETTING from "./HOTWORD_SETTING";
|
||||
import HOTWORDS_HISTORY from "./HOTWORDS_HISTORY";
|
||||
import HOTWORDS_TODAY from "./HOTWORDS_TODAY";
|
||||
export default {
|
||||
HOTWORD_SETTING,
|
||||
HOTWORDS_TODAY,
|
||||
HOTWORDS_HISTORY
|
||||
};
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<Row class="operation">
|
||||
<Col span="12">
|
||||
|
||||
<DatePicker @on-change="search" show-week-numbers type="date" placement="bottom-end" placeholder="选择查看日期"
|
||||
style="width: 200px"></DatePicker>
|
||||
|
||||
</Col>
|
||||
</Row>
|
||||
<Row>
|
||||
<p>
|
||||
<Alert type="success">
|
||||
这里展示历史某一天的热词数据统计，可根据需求配置每日持久化多少条数据。
|
||||
</Alert>
|
||||
</p>
|
||||
</Row>
|
||||
|
||||
|
||||
<div id="container"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {Chart} from "@antv/g2";
|
||||
import {getHotWordsHistory} from "@/api/index";
|
||||
import affixTime from "@/views/lili-components/affix-time";
|
||||
import {Message} from "view-design";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
affixTime,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
params: {
|
||||
date:this.$options.filters.unixToDate(new Date().getTime() / 1000,'yyyy-MM-dd')
|
||||
},
|
||||
hotWordsChart: "", //图表
|
||||
hotWordsData: [] //数据
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
clickBreadcrumb(val) {
|
||||
this.params = {...this.params, ...val}
|
||||
},
|
||||
// 初始化图表
|
||||
async search(val) {
|
||||
|
||||
val ? this.params.date = val : ''
|
||||
const res = await getHotWordsHistory(this.params);
|
||||
if (res.success) {
|
||||
this.hotWordsData = res.result;
|
||||
this.hotWordsChart.data(this.hotWordsData)
|
||||
this.hotWordsChart.render();
|
||||
if (!this.hotWordsData) {
|
||||
Message.error("暂无数据");
|
||||
}
|
||||
}
|
||||
},
|
||||
handleClickSearch() {
|
||||
|
||||
},
|
||||
init() {
|
||||
let chart = this.hotWordsChart
|
||||
chart = new Chart({
|
||||
container: "container",
|
||||
autoFit: true,
|
||||
height: 500,
|
||||
padding: [50, 20, 50, 20],
|
||||
});
|
||||
chart.scale("score", {
|
||||
alias: "搜索次数",
|
||||
});
|
||||
|
||||
chart.axis("keywords", {
|
||||
tickLine: {
|
||||
alignTick: false,
|
||||
},
|
||||
});
|
||||
chart.axis("score", false);
|
||||
|
||||
chart.tooltip({
|
||||
showMarkers: false,
|
||||
});
|
||||
chart.interval().position("keywords*score");
|
||||
chart.interaction("element-active");
|
||||
this.hotWordsChart = chart;
|
||||
this.search();
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.affix-time {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.box {
|
||||
min-height: 400px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -0,0 +1,135 @@
|
|||
<template>
|
||||
<div class="layout">
|
||||
<Form
|
||||
ref="formValidate"
|
||||
:label-width="150"
|
||||
label-position="right"
|
||||
:model="formValidate"
|
||||
:rules="ruleValidate"
|
||||
>
|
||||
<FormItem label="热词默认配置" prop="hotWordsSettingItems">
|
||||
<div
|
||||
class="item-label"
|
||||
v-for="(item, index) in formValidate.hotWordsSettingItems"
|
||||
:key="index"
|
||||
>
|
||||
<div>
|
||||
<div class="item-keyword">
|
||||
<div>热词：</div>
|
||||
<Input type="text" v-model="item.keywords"> </Input>
|
||||
</div>
|
||||
<div class="item-score">
|
||||
<div>分数：</div>
|
||||
<InputNumber :max="5" :min="0" v-model="item.score"></InputNumber>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<Button type="primary" @click="formValidate.hotWordsSettingItems.splice(index,1)">删除</Button>
|
||||
</div>
|
||||
</div>
|
||||
<Button @click="addSetItem">添加配置</Button>
|
||||
</FormItem>
|
||||
<FormItem label="每日持久化热词数量" prop="saveNum">
|
||||
<InputNumber :min="0" v-model="formValidate.saveNum" />
|
||||
</FormItem>
|
||||
|
||||
<div class="label-btns">
|
||||
<Button type="primary" @click="submit('formValidate')">保存</Button>
|
||||
</div>
|
||||
</Form>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { setSetting, getSetting } from "@/api/index";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
ruleValidate: {}, // 验证规则
|
||||
formValidate: {
|
||||
// 表单数据
|
||||
saveNum: 1, // 每日保存数量
|
||||
hotWordsSettingItems: [
|
||||
{
|
||||
keywords: "",
|
||||
score: 1,
|
||||
},
|
||||
], // 热词默认配置
|
||||
},
|
||||
};
|
||||
},
|
||||
|
||||
created() {
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
// 添加热词默认配置
|
||||
addSetItem(val) {
|
||||
if (this.formValidate.hotWordsSettingItems.length >= 5) {
|
||||
this.$Message.error("最多5个热词项");
|
||||
} else {
|
||||
this.formValidate.hotWordsSettingItems.push({
|
||||
keywords: "",
|
||||
score: 1,
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
submit(name) {
|
||||
this.$refs["formValidate"].validate(async (valid) => {
|
||||
if (valid) {
|
||||
this.setupSetting();
|
||||
} else {
|
||||
that.$Message.error("请正确填写内容!");
|
||||
return flag;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 保存设置
|
||||
setupSetting() {
|
||||
setSetting("HOT_WORDS", this.formValidate).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("保存成功!");
|
||||
} else {
|
||||
this.$Message.error("保存失败!");
|
||||
}
|
||||
this.init();
|
||||
});
|
||||
},
|
||||
// 实例化数据
|
||||
async init() {
|
||||
const res = await getSetting("HOT_WORDS");
|
||||
if (res.success) {
|
||||
this.formValidate = res.result;
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.item-label {
|
||||
border-bottom: 1px solid #ededed;
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width:500px;
|
||||
justify-content:space-between;
|
||||
}
|
||||
/deep/ .ivu-input {
|
||||
width: 100px !important;
|
||||
}
|
||||
.ivu-input-wrapper {
|
||||
width: 300px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.item-keyword,
|
||||
.item-score {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
> div {
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,98 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="affix-time">
|
||||
<Affix :offset-top="100">
|
||||
<div class="flex affix-box">
|
||||
<affixTime :closeShop="true" @selected="clickBreadcrumb"/>
|
||||
|
||||
<InputNumber
|
||||
placeholder="展示前N"
|
||||
:max="200"
|
||||
:min="10"
|
||||
v-model="params.top"
|
||||
></InputNumber>
|
||||
<Button style="margin-left: 10px" @click="search">搜索</Button>
|
||||
</div>
|
||||
</Affix>
|
||||
</div>
|
||||
<div id="container"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {Chart} from "@antv/g2";
|
||||
import {getHotWordsStatistics} from "@/api/index";
|
||||
import affixTime from "@/views/lili-components/affix-time";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
affixTime,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
params: {
|
||||
// 请求参数
|
||||
searchType: "LAST_SEVEN",
|
||||
year: "",
|
||||
month: "",
|
||||
top: 50
|
||||
},
|
||||
hotWordsChart:"", //图表
|
||||
hotWordsData:[] //数据
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
clickBreadcrumb(val) {
|
||||
this.params = {...this.params, ...val}
|
||||
},
|
||||
// 初始化图表
|
||||
async search() {
|
||||
const res = await getHotWordsStatistics(this.params);
|
||||
if (res.success) {
|
||||
this.hotWordsData=res.result;
|
||||
this.hotWordsChart.data(this.hotWordsData)
|
||||
this.hotWordsChart.render();
|
||||
}
|
||||
},
|
||||
handleClickSearch() {
|
||||
},
|
||||
init(){
|
||||
let chart = this.hotWordsChart
|
||||
chart = new Chart({
|
||||
container: "container",
|
||||
autoFit: true,
|
||||
height: 500,
|
||||
padding: [50, 20, 50, 20],
|
||||
});
|
||||
chart.scale("score", {
|
||||
alias: "搜索次数",
|
||||
});
|
||||
|
||||
chart.axis("keywords", {
|
||||
tickLine: {
|
||||
alignTick: false,
|
||||
},
|
||||
});
|
||||
chart.axis("score", false);
|
||||
|
||||
chart.tooltip({
|
||||
showMarkers: false,
|
||||
});
|
||||
chart.interval().position("keywords*score");
|
||||
chart.interaction("element-active");
|
||||
this.hotWordsChart=chart;
|
||||
this.search();
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.affix-time {
|
||||
padding-left: 15px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,162 @@
|
|||
<template>
|
||||
<div>
|
||||
<Row class="operation">
|
||||
<Button @click="add()" type="primary">设置今日热词</Button>
|
||||
</Row>
|
||||
<Row>
|
||||
<p>
|
||||
<Alert type="success">
|
||||
这里展示今日系统中搜索前一百的搜索热词，分数为热词在排序系统中的分数，分数越高，可以在用户获取热词时进行优先展示（首页商品搜索栏下方推荐位）（分数可以填写负数，会降低推荐度）
|
||||
</Alert>
|
||||
</p>
|
||||
</Row>
|
||||
|
||||
<div class="card-list">
|
||||
<Card v-for="words in data" class="card-item" :key="words" onclick="">
|
||||
<p>
|
||||
<a href="#" slot="extra" @click.prevent="add(words)">{{ words }}</a>
|
||||
</p>
|
||||
<p slot="extra">
|
||||
<a @click="deleteWords(words)">
|
||||
<Icon type="md-close" />
|
||||
</a>
|
||||
</p>
|
||||
</Card>
|
||||
</div>
|
||||
<Modal
|
||||
:title="modalTitle"
|
||||
v-model="modalVisible"
|
||||
:mask-closable="false"
|
||||
:width="500"
|
||||
>
|
||||
<Form ref="form" :model="form" :label-width="100" :rules="formValidate">
|
||||
<FormItem label="热词" prop="keywords">
|
||||
<Input v-model="form.keywords" clearable style="width: 100%" />
|
||||
</FormItem>
|
||||
<FormItem label="分数" prop="point">
|
||||
<InputNumber v-model="form.point" clearable style="width: 100%" />
|
||||
</FormItem>
|
||||
</Form>
|
||||
<div slot="footer">
|
||||
<Button type="text" @click="modalVisible = false">取消</Button>
|
||||
<Button type="primary" :loading="submitLoading" @click="handleSubmit"
|
||||
>提交</Button
|
||||
>
|
||||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getHotWords, setHotWords, deleteHotWords } from "@/api/index";
|
||||
|
||||
import { regular } from "@/utils";
|
||||
export default {
|
||||
name: "hotWords",
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
submitLoading: false,
|
||||
modalTitle: "",
|
||||
loading: true, // 表单加载状态
|
||||
modalVisible: false, //弹出框
|
||||
form: {
|
||||
keywords: "",
|
||||
point: 0,
|
||||
},
|
||||
data: [], // 表单数据
|
||||
|
||||
// 表单验证规则
|
||||
formValidate: {
|
||||
keywords: [regular.REQUIRED, regular.VARCHAR20],
|
||||
point: [regular.REQUIRED, regular.NUMBER],
|
||||
},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.getDataList();
|
||||
},
|
||||
handleClickTab(val) {
|
||||
console.log(val);
|
||||
},
|
||||
getDataList() {
|
||||
this.loading = true;
|
||||
getHotWords().then((res) => {
|
||||
this.loading = false;
|
||||
if (res.success) {
|
||||
this.data = res.result;
|
||||
this.$store.state.app.hotWords = this.data
|
||||
|
||||
}
|
||||
});
|
||||
this.loading = false;
|
||||
},
|
||||
handleSubmit() {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.submitLoading = true;
|
||||
setHotWords(this.form).then((res) => {
|
||||
this.submitLoading = false;
|
||||
if (res.success) {
|
||||
this.$Message.success("操作成功");
|
||||
this.getDataList();
|
||||
this.modalVisible = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
//设置热词优先
|
||||
add(words) {
|
||||
this.modalType = 0;
|
||||
this.modalTitle = "设置热词";
|
||||
if (words) {
|
||||
this.form.keywords = words;
|
||||
} else {
|
||||
this.form.keywords = "";
|
||||
}
|
||||
this.form.point = 1;
|
||||
this.modalVisible = true;
|
||||
},
|
||||
deleteWords(words) {
|
||||
this.$Modal.confirm({
|
||||
title: "是否确定删除热词",
|
||||
content: "<p>您确定要删除此热词吗？</p>",
|
||||
okText: "确实",
|
||||
cancelText: "取消",
|
||||
onOk: () => {
|
||||
deleteHotWords({words}).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("删除成功");
|
||||
this.getDataList();
|
||||
}
|
||||
});
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.card-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.card-item {
|
||||
min-width: 100px;
|
||||
margin: 20px;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.ivu-card-extra {
|
||||
right: 3px;
|
||||
top: 15px;
|
||||
z-index: 99;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue