chenyuan1
/
dianshang-qianduan
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

提交

Browse Source
dev-QQq
qinzhenpen 2 years ago
parent 3dbfcd756d
commit f3d12d16a4
9 changed files with 528 additions and 526 deletions
Show Stats Download Patch File Download Diff File

25
src/api/marketing-algorithm.js
Unescape Escape View File

@ -0,0 +1,25 @@
/*
* @Author: qinzhenpen qzp1807@126.com
* @Date: 2024-08-16 10:14:59
* @LastEditors: qinzhenpen qzp1807@126.com
* @LastEditTime: 2024-08-16 15:37:34
* @FilePath: \vue3\src\api\marketing-algorithm.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import request from '@/utils/request'
// 选择指标分析数据展示
export function getMarketingAlgorithm(data) {
return request({
url: '/api/model/viewAnalyzeData',
method: 'POST',
data
})
}
// 查看指标
export function getMarketingAlgorithmList(params) {
return request({
url: '/api/model/viewMetrics',
method: 'POST',
params
})
}

13
src/router/index.js
Unescape Escape View File

@ -70,19 +70,6 @@ export const constantRoutes = [
}, },
], ],
}, },
{
path: "",
component: Layout,
redirect: "/digitalMarketAlgorithm",
children: [
{
path: "/digitalMarketAlgorithm",
component: () => import("@/views/digitalMarketAlgorithm/index"),
name: "digitalMarketAlgorithm",
meta: { title: "数字营销算法", icon: "dashboard", affix: true },
},
],
},
{ {
path: "", path: "",
component: Layout, component: Layout,

41
src/store/modules/algorithm.js
Unescape Escape View File

@ -0,0 +1,41 @@
import Cookies from "js-cookie";
import * as portraitModel from "@/api/portraitModel";
import * as marketingAlgorithmApi from "@/api/marketing-algorithm.js";
const useAlgorithmStore = defineStore("algorithm", {
state: () => ({
userDatabase: [],
tableData: [],
tableKey:[],
userDataLabel:["用户属性表", "用户登录活跃表", "用户消费能力表", "用户行为表", "用户评论表"], //用户数据标签
// 指标库
indexLibrary: [],
// 分析数据
analysisData: [],
}),
actions: {
getlist(data){
portraitModel.getUserTableData(data).then((res) => {
this.tableData = res?.data?.list;
this.tableKey = Object.keys(res?.data?.list[0]).map(item => {
return {
label: item,
};
});
})
},
getUserDatabase(val) {
marketingAlgorithmApi.getMarketingAlgorithmList(val).then((res) => {
this.indexLibrary= res?.data?.map(item => {
return {
label: item,
};
}
)
});
}
},
getters: {},
});
export default useAlgorithmStore;

13
src/store/modules/user.js
Unescape Escape View File

@ -1,5 +1,13 @@
/*
* @Author: qinzhenpen qzp1807@126.com
* @Date: 2024-08-15 09:41:09
* @LastEditors: qinzhenpen qzp1807@126.com
* @LastEditTime: 2024-08-16 10:33:08
* @FilePath: \vue3\src\store\modules\user.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { login, logout, getInfo } from '@/api/login' import { login, logout, getInfo } from '@/api/login'
import { getToken, setToken, removeToken,setUserInfo,removeUserInfo } from '@/utils/auth' import { getToken, setToken, removeToken,setUserInfo,removeUserInfo,getUserInfo } from '@/utils/auth'
import defAva from '@/assets/images/profile.jpg' import defAva from '@/assets/images/profile.jpg'
const useUserStore = defineStore( const useUserStore = defineStore(
@ -10,7 +18,8 @@ const useUserStore = defineStore(
name: '', name: '',
avatar: '', avatar: '',
roles: [], roles: [],
permissions: [] permissions: [],
userInfo: getUserInfo() ? JSON.parse(getUserInfo()) : {},
}), }),
actions: { actions: {
// 登录 // 登录

2
src/utils/request.js
Unescape Escape View File

@ -16,7 +16,7 @@ axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
const service = axios.create({ const service = axios.create({
// axios中请求配置有baseURL选项，表示请求URL公共部分 // axios中请求配置有baseURL选项，表示请求URL公共部分
// baseURL: import.meta.env.VITE_APP_BASE_API, // baseURL: import.meta.env.VITE_APP_BASE_API,
baseURL:'http://192.168.2.16:9868/', baseURL:'http://192.168.2.28:9868/',
// 超时 // 超时
timeout: 10000 timeout: 10000
}) })

176
src/views/digitalMarketingAlgorithms/components/bigData.vue
Unescape Escape View File

@ -2,117 +2,119 @@
<div class="app-main"> <div class="app-main">
<div class="main-left"> <div class="main-left">
<div class="left-top"> <div class="left-top">
<img style="width: 26px;height: 26px;" src="../../../assets/images/图标1.png" alt=""> <img style="width: 26px; height: 26px" src="../../../assets/images/图标1.png" alt="" />
<span>内置表</span> <span>内置表</span>
</div> </div>
<div class="left-item"> <div class="left-item">
<div v-for="(item,index) in nzData" :key="index" class="item" :class="{ 'is-active': nzIndex === index}" @click="goNZ(index)"> <div v-for="(item, index) in nzData" :key="index" class="item" :class="{ 'is-active': nzIndex === index }" @click="goNZ(index, item)">
<span>{{item}}</span> <span>{{ item }}</span>
</div> </div>
</div> </div>
<div class="left-top" style="margin-top:35px"> <div class="left-top" style="margin-top: 35px">
<img style="width: 26px;height: 26px;" src="../../../assets/images/图标.png" alt=""> <img style="width: 26px; height: 26px" src="../../../assets/images/图标.png" alt="" />
<span>自建表</span> <span>自建表</span>
</div> </div>
<div class="left-item"> <div class="left-item">
<div v-for="(item,index) in zjData" :key="index" class="item" :class="{ 'is-active': zjIndex === index}" @click="goZJ(index)"> <div v-for="(item, index) in zjData" :key="index" class="item" :class="{ 'is-active': zjIndex === index }" @click="goZJ(index)">
<span>{{item}}</span> <span>{{ item }}</span>
</div> </div>
</div> </div>
</div> </div>
<div class="main-right"> <div class="main-right">
<el-table :data="tableData" style="width: 94%" :header-cell-style="headerCellStyle"> <el-table :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle">
<el-table-column v-for="column in tableLabel" :key="column.prop" :prop="column.prop" :label="column.label" align="center"/> <el-table-column v-for="column in algorithmStore.tableKey" :key="column.prop" :prop="column.label" :label="column.label" align="center" />
<!-- <el-table-column v-for="column in tableLabel" :key="column.prop" :prop="column.prop" :label="column.label" align="center">
<template #default="{ row }">
<span>{{ row[column.prop] }}</span>
</template>
</el-table-column> -->
</el-table> </el-table>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { reactive } from "vue" import useUserStore from "@/store/modules/user";
import useAlgorithmStore from "@/store/modules/algorithm.js";
const nzIndex=ref(0) const userStore = useUserStore();
const nzData=['用户属性表','用户登录活跃表','用户消费能力表','用户行为表','用户评论表'] const algorithmStore = useAlgorithmStore();
const zjIndex=ref(-1) // 数据表query
const zjData=['用户属性表','用户登录活跃表','用户消费能力表','用户行为表','用户评论表'] const n_dataTableQuery = ref({
const tableLabel=reactive([ index: 1,
{prop:'date',label:'用户ID'}, size: 20,
{prop:'name',label:'登录名'}, tableName: "用户属性表",
{prop:'name',label:'用户姓名'}, userId: userStore.userInfo.userId,
{prop:'name',label:'学号'}, });
{prop:'name',label:'班级'}, const nzIndex = ref(0);
{prop:'name',label:'专业'}, const nzData = ["用户属性表", "用户登录活跃表", "用户消费能力表", "用户行为表", "用户评论表"];
{prop:'name',label:'学校'}, const zjIndex = ref(-1);
{prop:'name',label:'角色名称'}, const zjData = ["用户属性表", "用户登录活跃表", "用户消费能力表", "用户行为表", "用户评论表"];
{prop:'name',label:'角色性别'}, const tableLabel = reactive([
{prop:'name',label:'角色年龄'}, { prop: "id", label: "用户ID" },
{prop:'name',label:'注册时间'}, { prop: "loginName", label: "登录名" },
{prop:'name',label:'所在地'} { prop: "userName", label: "用户姓名" },
]) { prop: "studentId", label: "学号" },
const goNZ=(index)=>{ { prop: "stuClass", label: "班级" },
nzIndex.value=index { prop: "major", label: "专业" },
zjIndex.value=-1 { prop: "school", label: "学校" },
} { prop: "roleName", label: "角色名称" },
const goZJ=(index)=>{ { prop: "roleGender", label: "角色性别" },
zjIndex.value=index { prop: "roleAge", label: "角色年龄" },
nzIndex.value=-1 { prop: "updateTime", label: "注册时间" },
} { prop: "location", label: "所在地" },
]);
const goNZ = (index, item) => {
nzIndex.value = index;
zjIndex.value = -1;
n_dataTableQuery.value.tableName = item;
getSurface();
};
const goZJ = (index) => {
zjIndex.value = index;
nzIndex.value = -1;
};
const tableData = computed(() => {
return algorithmStore.tableData;
});
const tableData = [ const headerCellStyle = () => {
{
date: '2016-05-03',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles',
},
{
date: '2016-05-02',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles',
},
{
date: '2016-05-04',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles',
},
{
date: '2016-05-01',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles',
},
]
const headerCellStyle=()=>{
return { return {
// backgroundColor: "#0087F9 !important", // 设置表头背景颜色
// background:"linear-gradient(0deg, #002651 0%, #0087F9 100%) !important;",
color: "#ffffff !important", color: "#ffffff !important",
}; };
} };
// 选择内置或自建
const selectType = (type) => {};
const getSurface = () => {
algorithmStore.getlist(n_dataTableQuery.value);
};
onMounted(() => {
getSurface();
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.app-main { .app-main {
// background-color: #f5f5f5; // background-color: #f5f5f5;
margin: 20px 20px 0; margin: 20px 20px 0;
height: calc(100vh - 150px); height: calc(100vh - 150px);
display: flex; display: flex;
overflow: auto; overflow: auto;
.main-left{ .main-left {
width: 205px; width: 205px;
height: 100%; height: 100%;
background: #041C49; background: #041c49;
.left-top{ .left-top {
gap: 5px; gap: 5px;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 10px 20px; padding: 10px 20px;
span{ span {
font-weight: bold; font-weight: bold;
font-size: 18px; font-size: 18px;
color: #3596EB; color: #3596eb;
} }
} }
.left-item{ .left-item {
.item{ .item {
width: 195px; width: 195px;
height: 31px; height: 31px;
// background: #1983DD; // background: #1983DD;
@ -120,40 +122,40 @@ const headerCellStyle=()=>{
align-items: center; align-items: center;
justify-content: center; justify-content: center;
cursor: pointer; cursor: pointer;
span{ span {
color: #9BD1FF; color: #9bd1ff;
font-weight: 400; font-weight: 400;
font-size: 14px; font-size: 14px;
} }
} }
.is-active{ .is-active {
background: #1983DD; background: #1983dd;
span{ span {
color:#FFFFFF; color: #ffffff;
} }
} }
} }
} }
.main-right{ .main-right {
width: 1639px; width: 1639px;
height: 100%; height: 100%;
padding: 20px; padding: 20px;
// background: #001D40; // background: #001D40;
border: 1px solid #0452C6; border: 1px solid #0452c6;
// opacity: 0.5; // opacity: 0.5;
} }
} }
:deep(.el-table__header){ :deep(.el-table__header) {
.el-table__cell{ .el-table__cell {
background:linear-gradient(0deg, #002651 0%, #0087F9 100%) !important; background: linear-gradient(0deg, #002651 0%, #0087f9 100%) !important;
} }
} }
:deep(.el-table) { :deep(.el-table) {
--el-table-row-hover-bg-color:#002651 !important; --el-table-row-hover-bg-color: #002651 !important;
--el-table-border-color: #002651; --el-table-border-color: #002651;
.el-table__row{ .el-table__row {
background-color: #002652 !important; background-color: #002652 !important;
color: #E6E6E6; color: #e6e6e6;
} }
} }
</style> </style>

372
src/views/digitalMarketingAlgorithms/components/descriptiveStatistics.vue
Unescape Escape View File

@ -1,12 +1,18 @@
<template> <template>
<el-scrollbar height="800px"> <el-scrollbar height="800px">
<div class="main-top"> <div class="main-top">
<span style="font-weight: bold;font-size: 18px;color: #3596EB;">任务描述</span> <span style="font-weight: bold; font-size: 18px; color: #3596eb">任务描述</span>
<p style="font-weight: 400;font-size: 12px;color: #E6E6E6;">（给出任务清单参考，做哪些数据的统计分析）Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus pronin sapien nunc accuan eget.</p> <p style="font-weight: 400; font-size: 12px; color: #e6e6e6">（给出任务清单参考，做哪些数据的统计分析）Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus pronin sapien nunc accuan eget.</p>
</div> </div>
<div class="main-but"> <div class="main-but">
<el-button><img src="../../../assets/images/导入.png" alt="">算法知识导入</el-button> <el-button>
<el-button @click="taskSubmit"><img src="../../../assets/images/提交.png" alt="">实训任务提交</el-button> <img src="../../../assets/images/导入.png" alt="" />
算法知识导入
</el-button>
<el-button @click="taskSubmit">
<img src="../../../assets/images/提交.png" alt="" />
实训任务提交
</el-button>
</div> </div>
<div class="app-main"> <div class="app-main">
<div class="main-left"> <div class="main-left">
@ -14,204 +20,268 @@
<span>一、选择指标</span> <span>一、选择指标</span>
</div> </div>
<div class="metrics"> <div class="metrics">
<el-select v-model="input" placeholder="请选择数据" style="width: 180px"> <el-select v-model="input" placeholder="请选择数据" style="width: 180px" @change="selectType">
<el-option <el-option v-for="item in algorithmStore.userDataLabel" :key="item" :label="item" :value="item" />
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</div> </div>
<div class="metrics-table" style="margin-top: 10px"> <div class="metrics-table" style="margin-top: 10px">
<el-table border :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle"> <el-table border :data="algorithmStore.indexLibrary" style="width: 100%; height: 350px" :header-cell-style="headerCellStyle" @selection-change="handleSelectionChange">
<el-table-column type="selection" prop="date" label="Date" align="center"/> <el-table-column type="selection" prop="date" label="Date" align="center" />
<el-table-column prop="name" label="指标" align="center"/> <el-table-column label="指标" align="center" prop="label" />
</el-table> </el-table>
<el-button>确定</el-button> <el-button @click="submit">确定</el-button>
</div> </div>
<div class="left-top"> <div class="left-top">
<span>二、数据预处理</span> <span>二、数据预处理</span>
</div> </div>
<div class="metrics"> <div class="metrics">
<el-select v-model="input" placeholder="请选择数据" style="width: 180px"> <el-select placeholder="请选择数据" style="width: 180px">
<el-option <el-option label="数据去重" value="数据去重" />
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</div> </div>
<div class="metrics" style="margin-top:15px"> <div class="metrics" style="margin-top: 15px">
<el-select v-model="input" placeholder="请选择数据" style="width: 180px"> <el-select placeholder="请选择数据" style="width: 180px">
<el-option <el-option label="缺失值处理-剔除数据" value="缺失值处理-剔除数据" />
v-for="item in options" <el-option label="缺失值处理一均值替代" value="缺失值处理一均值替代" />
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</div> </div>
<div class="left-top" style="margin-top: 10px"> <div class="left-top" style="margin-top: 10px">
<span>三、模型参数设置</span> <span>三、模型参数设置</span>
</div> </div>
<div class="metrics-table" style="margin-top: 10px"> <div class="metrics-table" style="margin-top: 10px">
<el-table border :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle"> <el-table border :data="modelParams" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handlemodelSelectionChange">
<el-table-column type="selection" prop="date" label="Date" align="center"/> <el-table-column type="selection" prop="date" label="Date" align="center" />
<el-table-column prop="name" label="指标" align="center"/> <el-table-column prop="name" label="统计量" align="center" />
</el-table> </el-table>
<el-button>计算</el-button> <el-button>计算</el-button>
</div> </div>
<div class="startOver"> <div class="startOver">
<img src="../../../assets/images/重新开始.png" alt=""> <img src="../../../assets/images/重新开始.png" alt="" />
<span>重新开始</span> <span>重新开始</span>
</div> </div>
</div> </div>
<div class="main-right"> <div class="main-right">
<div> <div>
<span style="font-weight: bold;font-size: 18px;color: #3596EB;">分析数据：</span> <span style="font-weight: bold; font-size: 18px; color: #3596eb">分析数据：</span>
<el-table :data="tableData" style="width: 94%;margin-top:10px" :header-cell-style="headerCellStyle" height="350"> <el-table :data="analysisData" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
<el-table-column v-for="column in tableLabel" :key="column.prop" :prop="column.prop" :label="column.label" align="center"/> <el-table-column v-for="column in analysisHanderKry" :key="column" :prop="column" :label="column" align="center" />
</el-table> </el-table>
<el-pagination style="margin-top:10px" background layout="prev, pager, next" :total="1000" /> <el-pagination style="margin-top: 10px" background layout="prev, pager, next" :total="1000" />
</div> </div>
<div class="analysisResults" style="margin-top: 20px"> <div class="analysisResults" style="margin-top: 20px">
<span style="font-weight: bold;font-size: 18px;color: #3596EB;display: block;">分析结果：</span> <span style="font-weight: bold; font-size: 18px; color: #3596eb; display: block">分析结果：</span>
<el-button>下载</el-button> <el-button>下载</el-button>
<el-table :data="tableData" style="width: 94%;margin-top:10px" :header-cell-style="headerCellStyle" height="350"> <el-table :data="tableData" style="width: 94%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
<el-table-column v-for="column in tableLabel" :key="column.prop" :prop="column.prop" :label="column.label" align="center"/> <el-table-column v-for="column in tableLabel" :key="column.label" :prop="column.label" :label="column.label" align="center"></el-table-column>
<p v-for="column in tableLabel" :key="column.label">{{ column.label }}</p>
</el-table> </el-table>
<el-pagination style="margin-top:10px" background layout="prev, pager, next" :total="1000" /> <el-pagination style="margin-top: 10px" background layout="prev, pager, next" :total="1000" />
</div> </div>
</div> </div>
</div> </div>
</el-scrollbar> </el-scrollbar>
<el-dialog <el-dialog v-model="dialogVisible" title="实训任务提交" width="545" custom-class="dialogClass" :show-close="false">
v-model="dialogVisible"
title="实训任务提交"
width="545"
custom-class="dialogClass"
:show-close="false"
>
<template #header="{ close, titleId, titleClass }"> <template #header="{ close, titleId, titleClass }">
<div class="my-header"> <div class="my-header">
<span :id="titleId" :class="titleClass">实训任务提交</span> <span :id="titleId" :class="titleClass">实训任务提交</span>
<img class="gbImg" src="../../../assets/images/关闭.png" @click="close" alt=""> <img class="gbImg" src="../../../assets/images/关闭.png" @click="close" alt="" />
</div> </div>
<img class="xtImg" src="../../../assets/images/线条.png" alt=""> <img class="xtImg" src="../../../assets/images/线条.png" alt="" />
</template> </template>
This is dialog content. This is dialog content.
<span>This is a message</span> <span>This is a message</span>
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button @click="dialogVisible = false">Cancel</el-button> <el-button @click="dialogVisible = false">Cancel</el-button>
<el-button type="primary" @click="dialogVisible = false"> <el-button type="primary" @click="dialogVisible = false">Confirm</el-button>
Confirm
</el-button>
</div> </div>
</template> </template>
</el-dialog> </el-dialog>
</template> </template>
<script setup> <script setup>
const dialogVisible=ref(false) import * as marketingAlgorithmApi from "@/api/marketing-algorithm.js";
const tableLabel=reactive([ import useAlgorithmStore from "@/store/modules/algorithm.js";
{prop:'date',label:'用户ID'}, import useUserStore from "@/store/modules/user";
{prop:'name',label:'登录名'}, import { onMounted, ref } from "vue";
{prop:'name',label:'用户姓名'}, const userStore = useUserStore();
{prop:'name',label:'学号'}, const algorithmStore = useAlgorithmStore();
{prop:'name',label:'班级'}, const n_dataTableQuery = ref({
{prop:'name',label:'专业'}, index: 1,
{prop:'name',label:'学校'}, size: 20,
{prop:'name',label:'角色名称'}, tableName: "用户属性表",
{prop:'name',label:'角色性别'}, userId: userStore.userInfo.userId,
{prop:'name',label:'角色年龄'}, });
{prop:'name',label:'注册时间'}, const dialogVisible = ref(false);
{prop:'name',label:'所在地'} // 模型参数
]) const modelParams = reactive([
const input=ref() {
name: "统计量",
},
{
name: "平均数",
},
{
name: "中位数",
},
{
name: "众数",
},
{
name: "标准差",
},
{
name: "方差",
},
{
name: "标准误差",
},
{
name: "峰度;",
},
{
name: "偏度",
},
{
name: "最大值",
},
{
name: "最小值",
},
{
name: "求和",
},
{
name: "观测数",
},
]);
const analysisData=ref([])
const analysisHanderKry=ref([])
const tableLabel = reactive([
{ prop: "date", label: "用户ID" },
{ prop: "name", label: "登录名" },
{ prop: "name", label: "用户姓名" },
{ prop: "name", label: "学号" },
{ prop: "name", label: "班级" },
{ prop: "name", label: "专业" },
{ prop: "name", label: "学校" },
{ prop: "name", label: "角色名称" },
{ prop: "name", label: "角色性别" },
{ prop: "name", label: "角色年龄" },
{ prop: "name", label: "注册时间" },
{ prop: "name", label: "所在地" },
]);
const input = ref();
const options = [ const options = [
{ {
value: 'Option1', value: "Option1",
label: 'Option1', label: "Option1",
}, },
{ {
value: 'Option2', value: "Option2",
label: 'Option2', label: "Option2",
}, },
{ {
value: 'Option3', value: "Option3",
label: 'Option3', label: "Option3",
}, },
{ {
value: 'Option4', value: "Option4",
label: 'Option4', label: "Option4",
}, },
{ {
value: 'Option5', value: "Option5",
label: 'Option5', label: "Option5",
}, },
] ];
const taskSubmit=()=>{ const g_indicatorData = ref([]);
dialogVisible.value=true const taskSubmit = () => {
} dialogVisible.value = true;
};
const tableData = [ const tableData = [
{ {
date: '2016-05-03', date: "2016-05-03",
name: 'Tom', name: "Tom",
address: 'No. 189, Grove St, Los Angeles', address: "No. 189, Grove St, Los Angeles",
}, },
{ {
date: '2016-05-02', date: "2016-05-02",
name: 'Tom', name: "Tom",
address: 'No. 189, Grove St, Los Angeles', address: "No. 189, Grove St, Los Angeles",
}, },
{ {
date: '2016-05-04', date: "2016-05-04",
name: 'Tom', name: "Tom",
address: 'No. 189, Grove St, Los Angeles', address: "No. 189, Grove St, Los Angeles",
}, },
{ {
date: '2016-05-01', date: "2016-05-01",
name: 'Tom', name: "Tom",
address: 'No. 189, Grove St, Los Angeles', address: "No. 189, Grove St, Los Angeles",
}, },
] ];
const headerCellStyle=()=>{ const headerCellStyle = () => {
return { return {
backgroundColor: "#1882DE !important", // 设置表头背景颜色 backgroundColor: "#1882DE !important", // 设置表头背景颜色
color: "#ffffff !important", color: "#ffffff !important",
}; };
} };
// 选择指标
const selectType = (type) => {
n_dataTableQuery.value.tableName = type;
getIndicator()
};
// 选择数据
const handleSelectionChange = (type) => {
g_indicatorData.value = type.map((item) => item.label);
};
// 提交指標
const submit = () => {
marketingAlgorithmApi.getMarketingAlgorithm({ userId: n_dataTableQuery.value.userId, tableName: n_dataTableQuery.value.tableName, fieldList: g_indicatorData.value }).then(res=>{
analysisData.value=res.data
analysisHanderKry.value=Object.keys(res.data[0])
})
};
// 选择模型
const handlemodelSelectionChange = (type) => {
console.log(type);
};
onMounted(()=>{
getIndicator()
})
// 获取指标
const getIndicator = () => {
algorithmStore.getUserDatabase({userId:n_dataTableQuery.value.userId,tableName:n_dataTableQuery.value.tableName });
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.main-top { .main-top {
margin: 20px 20px 0; margin: 20px 20px 0;
margin-top: 10px; margin-top: 10px;
height: 85px; height: 85px;
background: #001d40; background: #001d40;
border: 1px solid #0452c6; border: 1px solid #0452c6;
padding: 5px 20px; padding: 5px 20px;
} }
.main-but{ .main-but {
margin: 5px 20px 0; margin: 5px 20px 0;
display: flex; display: flex;
.el-button:nth-child(1) { .el-button:nth-child(1) {
width: 180px; width: 180px;
height: 56px; height: 56px;
background: url('../../../assets/images/011.png'); background: url("../../../assets/images/011.png");
color:#FFFFFF; color: #ffffff;
border-color:#FFFFFF00; border-color: #ffffff00;
} }
.el-button:nth-child(2) { .el-button:nth-child(2) {
width: 180px; width: 180px;
height: 56px; height: 56px;
background: url('../../../assets/images/022.png'); background: url("../../../assets/images/022.png");
color:#FFFFFF; color: #ffffff;
border-color:#FFFFFF00; border-color: #ffffff00;
} }
} }
.app-main { .app-main {
@ -234,23 +304,23 @@ margin: 20px 20px 0;
color: #3596eb; color: #3596eb;
} }
} }
.metrics-table{ .metrics-table {
.el-button { .el-button {
width: 149px; width: 149px;
height: 48px; height: 48px;
background: url('../../../assets/images/确定.png'); background: url("../../../assets/images/确定.png");
color:#FFFFFF; color: #ffffff;
border-color:#FFFFFF00; border-color: #ffffff00;
background-size: 100% 100%; background-size: 100% 100%;
margin: 15px; margin: 15px;
} }
} }
.startOver{ .startOver {
margin-top: 70px; margin-top: 70px;
margin-left: -10px; margin-left: -10px;
width: 205px; width: 205px;
height: 55px; height: 55px;
background: #00F4FF; background: #00f4ff;
//水平居中 //水平居中
display: flex; display: flex;
align-items: center; align-items: center;
@ -258,74 +328,73 @@ margin: 20px 20px 0;
cursor: pointer; cursor: pointer;
} }
:deep(.el-table) { :deep(.el-table) {
--el-table-row-hover-bg-color:#002651 !important; --el-table-row-hover-bg-color: #002651 !important;
--el-table-border-color: #7AC1FF; --el-table-border-color: #7ac1ff;
.el-table__row{ .el-table__row {
background-color: #002652 !important; background-color: #002652 !important;
color: #E6E6E6; color: #e6e6e6;
}
} }
}
} }
.main-right { .main-right {
width: 1639px; width: 1639px;
height: 100%; height: 100%;
padding: 20px; padding: 20px;
border: 1px solid #0452c6; border: 1px solid #0452c6;
:deep(.el-table__header){ :deep(.el-table__header) {
.el-table__cell{ .el-table__cell {
background:linear-gradient(0deg, #5304BE 0%, #9126FE 100%) !important; background: linear-gradient(0deg, #5304be 0%, #9126fe 100%) !important;
} }
} }
:deep(.el-table) { :deep(.el-table) {
--el-table-row-hover-bg-color:#002651 !important; --el-table-row-hover-bg-color: #002651 !important;
--el-table-border-color: #002651; --el-table-border-color: #002651;
--el-table-bg-color:#FFFFFF00; --el-table-bg-color: #ffffff00;
.el-table__row{ .el-table__row {
background-color: #002652 !important; background-color: #002652 !important;
color: #E6E6E6; color: #e6e6e6;
} }
} }
} }
.metrics{ .metrics {
:deep(.el-input){ :deep(.el-input) {
.el-input__wrapper{ .el-input__wrapper {
background-color:#FFFFFF00; background-color: #ffffff00;
background-image:url('../../../assets/images/下拉框.png'); background-image: url("../../../assets/images/下拉框.png");
background-size: 100% 100%; background-size: 100% 100%;
} }
--el-input-text-color:#FFFFFF; --el-input-text-color: #ffffff;
--el-input-border-color:#FFFFFF00; --el-input-border-color: #ffffff00;
--el-input-hover-border-color:#FFFFFF00; --el-input-hover-border-color: #ffffff00;
--el-input-hover-border:#FFFFFF00; --el-input-hover-border: #ffffff00;
--el-select-border-color-hover:#FFFFFF00; --el-select-border-color-hover: #ffffff00;
--el-select-input-focus-border-color:#FFFFFF00; --el-select-input-focus-border-color: #ffffff00;
--el-input-placeholder-color:#FFFFFF; --el-input-placeholder-color: #ffffff;
.el-input__inner{ .el-input__inner {
color:#FFFFFF; color: #ffffff;
} }
} }
} }
} }
.analysisResults{ .analysisResults {
.el-button { .el-button {
width: 89px; width: 89px;
height: 31px; height: 31px;
background: url('../../../assets/images/下载.png'); background: url("../../../assets/images/下载.png");
color:black; color: black;
border-color:#FFFFFF00; border-color: #ffffff00;
// background-size: 100% 100%; // background-size: 100% 100%;
margin: 15px 0px 5px; margin: 15px 0px 5px;
} }
} }
</style> </style>
<style lang="scss"> <style lang="scss">
.el-dialog{ .el-dialog {
background:url('../../../assets/images/弹框.png') !important; background: url("../../../assets/images/弹框.png") !important;
.el-dialog__header{ .el-dialog__header {
padding: 5px 0px; padding: 5px 0px;
margin-right: -4px !important; margin-right: -4px !important;
.gbImg{ .gbImg {
cursor: pointer; cursor: pointer;
width: 51px; width: 51px;
height: 31px; height: 31px;
@ -339,12 +408,11 @@ margin: 20px 20px 0;
justify-content: space-between; justify-content: space-between;
gap: 16px; gap: 16px;
text-align: center; text-align: center;
span{ span {
color: #FFFFFF; color: #ffffff;
padding: 38px 20px 0; padding: 38px 20px 0;
} }
.xtImg{ .xtImg {
} }
} }
</style> </style>

6
src/views/digitalMarketingAlgorithms/index.vue
Unescape Escape View File

@ -1,9 +1,9 @@
<template> <template>
<div class="rgzn_top"> <div class="rgzn_top">
<div class="top_item"> <div class="top_item">
<el-button :class="{'active':isActive===1}" @click="activeIndex(1)">大数据</el-button> <el-button :class="{'active':isActive===1}" @click="activeIndex(1)">用户数据库</el-button>
<el-button :class="{'active':isActive===2}" @click="activeIndex(2)">人工智能</el-button> <el-button :class="{'active':isActive===2}" @click="activeIndex(2)">描述性统计</el-button>
<el-button :class="{'active':isActive===3}" @click="activeIndex(3)">AIGC大模型</el-button> <el-button :class="{'active':isActive===3}" @click="activeIndex(3)">聚类分析</el-button>
<el-button :class="{'active':isActive===4}" @click="activeIndex(4)">关联规则挖掘</el-button> <el-button :class="{'active':isActive===4}" @click="activeIndex(4)">关联规则挖掘</el-button>
<el-button :class="{'active':isActive===5}" @click="activeIndex(5)">回归分析</el-button> <el-button :class="{'active':isActive===5}" @click="activeIndex(5)">回归分析</el-button>
<el-button :class="{'active':isActive===6}" @click="activeIndex(6)">情感分析/文本挖掘</el-button> <el-button :class="{'active':isActive===6}" @click="activeIndex(6)">情感分析/文本挖掘</el-button>

248
src/views/portraitModel/index.vue
Unescape Escape View File

@ -1,12 +1,7 @@
<template> <template>
<div class="content"> <div class="content">
<div class="tabList"> <div class="tabList">
<div <div class="tabs" v-for="item in tabList" :key="item.id" @click="changeTab(item)">
class="tabs"
v-for="item in tabList"
:key="item.id"
@click="changeTab(item)"
>
<div style="display: flex; align-items: center"> <div style="display: flex; align-items: center">
<img :src="item.backImg" alt="" /> <img :src="item.backImg" alt="" />
<span>{{ item.title }}</span> <span>{{ item.title }}</span>
@ -23,16 +18,7 @@
<img src="@/assets/images/图标1.png" alt="" /> <img src="@/assets/images/图标1.png" alt="" />
<span>内置表</span> <span>内置表</span>
</div> </div>
<el-menu <el-menu default-active="1" @open="handleOpen" @close="handleClose" @select="handleChange" background-color="#041C49" style="border-right: none" active-text-color="#ffffff" text-color="#9BD1FF">
default-active="1"
@open="handleOpen"
@close="handleClose"
@select="handleChange"
background-color="#041C49"
style="border-right: none"
active-text-color="#ffffff"
text-color="#9BD1FF"
>
<el-menu-item index="1"> <el-menu-item index="1">
<span>用户属性表</span> <span>用户属性表</span>
</el-menu-item> </el-menu-item>
@ -61,30 +47,18 @@
background: `linear-gradient(0deg, #002651 0%, #0087F9 100%)`, background: `linear-gradient(0deg, #002651 0%, #0087F9 100%)`,
}" }"
> >
<el-table-column label="用户ID" align="center" prop="id"> <el-table-column label="用户ID" align="center" prop="id"></el-table-column>
</el-table-column> <el-table-column label="登录名" align="center" prop="loginName"></el-table-column>
<el-table-column label="登录名" align="center" prop="loginName"> <el-table-column label="用户姓名" align="center" prop="userName"></el-table-column>
</el-table-column> <el-table-column label="学号" align="center" prop="studentId"></el-table-column>
<el-table-column label="用户姓名" align="center" prop="userName"> <el-table-column label="班级" align="center" prop="stuClass"></el-table-column>
</el-table-column> <el-table-column label="专业" align="center" prop="major"></el-table-column>
<el-table-column label="学号" align="center" prop="studentId"> <el-table-column label="学校" align="center" prop="school"></el-table-column>
</el-table-column> <el-table-column label="角色名称" align="center" prop="roleName"></el-table-column>
<el-table-column label="班级" align="center" prop="stuClass"> <el-table-column label="角色性别" align="center" prop="roleGender"></el-table-column>
</el-table-column> <el-table-column label="角色年龄" align="center" prop="roleAge"></el-table-column>
<el-table-column label="专业" align="center" prop="major"> <el-table-column label="注册时间" align="center" prop="updateTime"></el-table-column>
</el-table-column> <el-table-column label="所在地" align="center" prop="location"></el-table-column>
<el-table-column label="学校" align="center" prop="school">
</el-table-column>
<el-table-column label="角色名称" align="center" prop="roleName">
</el-table-column>
<el-table-column label="角色性别" align="center" prop="roleGender">
</el-table-column>
<el-table-column label="角色年龄" align="center" prop="roleAge">
</el-table-column>
<el-table-column label="注册时间" align="center" prop="updateTime">
</el-table-column>
<el-table-column label="所在地" align="center" prop="location">
</el-table-column>
</el-table> </el-table>
<el-table <el-table
v-if="menuIndex == 2" v-if="menuIndex == 2"
@ -96,30 +70,18 @@
background: `linear-gradient(0deg, #002651 0%, #0087F9 100%)`, background: `linear-gradient(0deg, #002651 0%, #0087F9 100%)`,
}" }"
> >
<el-table-column label="用户ID" align="center" prop="a1"> <el-table-column label="用户ID" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="登录名" align="center" prop="a1"></el-table-column>
<el-table-column label="登录名" align="center" prop="a1"> <el-table-column label="用户姓名" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="学号" align="center" prop="a1"></el-table-column>
<el-table-column label="用户姓名" align="center" prop="a1"> <el-table-column label="班级" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="专业" align="center" prop="a1"></el-table-column>
<el-table-column label="学号" align="center" prop="a1"> <el-table-column label="学校" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="角色名称" align="center" prop="a1"></el-table-column>
<el-table-column label="班级" align="center" prop="a1"> <el-table-column label="常登录地" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="最近登录日期" align="center" prop="a1"></el-table-column>
<el-table-column label="专业" align="center" prop="a1"> <el-table-column label="登录频次" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="登录时长" align="center" prop="a1"></el-table-column>
<el-table-column label="学校" align="center" prop="a1">
</el-table-column>
<el-table-column label="角色名称" align="center" prop="a1">
</el-table-column>
<el-table-column label="常登录地" align="center" prop="a1">
</el-table-column>
<el-table-column label="最近登录日期" align="center" prop="a1">
</el-table-column>
<el-table-column label="登录频次" align="center" prop="a1">
</el-table-column>
<el-table-column label="登录时长" align="center" prop="a1">
</el-table-column>
</el-table> </el-table>
<el-table <el-table
v-if="menuIndex == 3" v-if="menuIndex == 3"
@ -131,71 +93,21 @@
background: `linear-gradient(0deg, #002651 0%, #0087F9 100%)`, background: `linear-gradient(0deg, #002651 0%, #0087F9 100%)`,
}" }"
> >
<el-table-column label="用户ID" align="center" prop="a1"> <el-table-column label="用户ID" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="登录名" align="center" prop="a1"></el-table-column>
<el-table-column label="登录名" align="center" prop="a1"> <el-table-column label="用户姓名" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="学号" align="center" prop="a1"></el-table-column>
<el-table-column label="用户姓名" align="center" prop="a1"> <el-table-column label="班级" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="专业" align="center" prop="a1"></el-table-column>
<el-table-column label="学号" align="center" prop="a1"> <el-table-column label="学校" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="角色名称" align="center" prop="a1"></el-table-column>
<el-table-column label="班级" align="center" prop="a1"> <el-table-column label="消费商品小类" align="center" prop="a1" width="110"></el-table-column>
</el-table-column> <el-table-column label="消费商品类型" align="center" prop="a1" width="110"></el-table-column>
<el-table-column label="专业" align="center" prop="a1"> <el-table-column label="累计消费金额" align="center" prop="a1" width="110"></el-table-column>
</el-table-column> <el-table-column label="累计消费次数" align="center" prop="a1" width="110"></el-table-column>
<el-table-column label="学校" align="center" prop="a1"> <el-table-column label="近七天消费金额" align="center" prop="a1" width="130"></el-table-column>
</el-table-column> <el-table-column label="近七天消费次数" align="center" prop="a1" width="130"></el-table-column>
<el-table-column label="角色名称" align="center" prop="a1"> <el-table-column label="最近消费时间" align="center" prop="a1" width="110"></el-table-column>
</el-table-column>
<el-table-column
label="消费商品小类"
align="center"
prop="a1"
width="110"
>
</el-table-column>
<el-table-column
label="消费商品类型"
align="center"
prop="a1"
width="110"
>
</el-table-column>
<el-table-column
label="累计消费金额"
align="center"
prop="a1"
width="110"
>
</el-table-column>
<el-table-column
label="累计消费次数"
align="center"
prop="a1"
width="110"
>
</el-table-column>
<el-table-column
label="近七天消费金额"
align="center"
prop="a1"
width="130"
>
</el-table-column>
<el-table-column
label="近七天消费次数"
align="center"
prop="a1"
width="130"
>
</el-table-column>
<el-table-column
label="最近消费时间"
align="center"
prop="a1"
width="110"
>
</el-table-column>
</el-table> </el-table>
<el-table <el-table
v-if="menuIndex == 4" v-if="menuIndex == 4"
@ -207,65 +119,23 @@
background: `linear-gradient(0deg, #002651 0%, #0087F9 100%)`, background: `linear-gradient(0deg, #002651 0%, #0087F9 100%)`,
}" }"
> >
<el-table-column label="用户ID" align="center" prop="a1"> <el-table-column label="用户ID" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="登录名" align="center" prop="a1"></el-table-column>
<el-table-column label="登录名" align="center" prop="a1"> <el-table-column label="用户姓名" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="学号" align="center" prop="a1"></el-table-column>
<el-table-column label="用户姓名" align="center" prop="a1"> <el-table-column label="班级" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="专业" align="center" prop="a1"></el-table-column>
<el-table-column label="学号" align="center" prop="a1"> <el-table-column label="学校" align="center" prop="a1"></el-table-column>
</el-table-column> <el-table-column label="角色名称" align="center" prop="a1"></el-table-column>
<el-table-column label="班级" align="center" prop="a1"> <el-table-column label="商品名称" align="center" prop="a1" width="110"></el-table-column>
</el-table-column> <el-table-column label="商品小类" align="center" prop="a1" width="110"></el-table-column>
<el-table-column label="专业" align="center" prop="a1"> <el-table-column label="商品类型" align="center" prop="a1" width="110"></el-table-column>
</el-table-column> <el-table-column label="用户行为类型" align="center" prop="a1" width="110"></el-table-column>
<el-table-column label="学校" align="center" prop="a1"> <el-table-column label="行为日期" align="center" prop="a1" width="130"></el-table-column>
</el-table-column>
<el-table-column label="角色名称" align="center" prop="a1">
</el-table-column>
<el-table-column
label="商品名称"
align="center"
prop="a1"
width="110"
>
</el-table-column>
<el-table-column
label="商品小类"
align="center"
prop="a1"
width="110"
>
</el-table-column>
<el-table-column
label="商品类型"
align="center"
prop="a1"
width="110"
>
</el-table-column>
<el-table-column
label="用户行为类型"
align="center"
prop="a1"
width="110"
>
</el-table-column>
<el-table-column
label="行为日期"
align="center"
prop="a1"
width="130"
>
</el-table-column>
</el-table> </el-table>
</div> </div>
</div> </div>
<main-content <main-content v-if="menuIndex == 0" :currentComponent="currentComponent" ref="contentRef"></main-content>
v-if="menuIndex == 0"
:currentComponent="currentComponent"
ref="contentRef"
></main-content>
</div> </div>
</template> </template>
@ -363,12 +233,12 @@ const getTableData = (name) => {
.getUserTableData({ .getUserTableData({
userId: 492, userId: 492,
tableName: name, tableName: name,
size:10, size: 10,
index:1 index: 1,
}) })
.then((res) => { .then((res) => {
// fileTable.value.push(res.data.list); // fileTable.value.push(res.data.list);
fileTable.value = res.data.list fileTable.value = res.data.list;
// console.log(res,'--'); // console.log(res,'--');
}) })
.catch((error) => {}); .catch((error) => {});
@ -398,7 +268,7 @@ const submit = () => {
}; };
const retrain = () => { const retrain = () => {
contentRef.value.retrainMethod(); contentRef.value.retrainMethod();
} };
// defineExpose({ // defineExpose({
// submit, // submit,
// }); // });

Write Preview
Loading…
Cancel
Save