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 eee2db0820
commit 7bba7aff51
5 changed files with 388 additions and 350 deletions
Show Stats Download Patch File Download Diff File

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

@ -16,8 +16,8 @@ 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://118.31.7.2:9868/', // baseURL:'http://118.31.7.2:9868/',
// baseURL:'http://192.168.2.16:9868/', baseURL:'http://192.168.2.28:9868/',
// 超时 // 超时
timeout: 100000 timeout: 100000
}) })

128
src/views/digitalMarketingAlgorithms/components/associationRuleMining.vue
Unescape Escape View File

@ -1,22 +1,22 @@
<template> <template>
<!-- <el-scrollbar ref="scrollbar" height="800px"> --> <!-- <el-scrollbar ref="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 @click="runResultShow = true"> <el-button @click="runResultShow = true">
<img src="../../../assets/images/导入.png" alt="" /> <img src="../../../assets/images/导入.png" alt="" />
算法知识导入 算法知识导入
</el-button> </el-button>
<el-button @click="taskSubmit"> <el-button @click="taskSubmit">
<img src="../../../assets/images/提交.png" alt="" /> <img src="../../../assets/images/提交.png" alt="" />
实训任务提交 实训任务提交
</el-button> </el-button>
</div> </div>
<div class="app-main"> <div class="app-main">
<div class="main-left"> <div class="main-left">
<el-scrollbar height="550px" style="padding: 0 10px" min-size="5"> <el-scrollbar height="550px" style="padding: 0 10px" min-size="5">
<div> <div>
<div class="left-top"> <div class="left-top">
<span>一、选择指标</span> <span>一、选择指标</span>
@ -69,16 +69,16 @@
<el-button @click="computation">计算</el-button> <el-button @click="computation">计算</el-button>
</div> </div>
</div> </div>
</el-scrollbar> </el-scrollbar>
<div style="margin-top: auto"> <div style="margin-top: auto">
<div class="startOver" @click="startOver()"> <div class="startOver" @click="startOver()">
<img src="../../../assets/images/重新开始.png" alt="" /> <img src="../../../assets/images/重新开始.png" alt="" />
<span>重新开始</span> <span>重新开始</span>
</div>
</div> </div>
</div> </div>
<div class="main-right"> </div>
<el-scrollbar height="500px" ref="scrollbar" style="padding: 20px"> <div class="main-right">
<el-scrollbar height="500px" ref="scrollbar" style="padding: 20px">
<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="tableData2" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350"> <el-table :data="tableData2" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
@ -94,9 +94,9 @@
</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>
</el-scrollbar> </el-scrollbar>
</div>
</div> </div>
</div>
<!-- </el-scrollbar> --> <!-- </el-scrollbar> -->
<el-dialog v-model="dialogVisible" title="实训任务提交" width="400" custom-class="dialogClass" :show-close="false"> <el-dialog v-model="dialogVisible" title="实训任务提交" width="400" custom-class="dialogClass" :show-close="false">
@ -124,7 +124,6 @@
<div> <div>
<el-checkbox v-model="formData.value5" label="{'面包', '啤酒'}" size="large" /> <el-checkbox v-model="formData.value5" label="{'面包', '啤酒'}" size="large" />
</div> </div>
</div> </div>
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
@ -324,6 +323,7 @@
</template> </template>
<script setup> <script setup>
import * as portraitModel from "@/api/portraitModel";
import * as echarts from "echarts"; import * as echarts from "echarts";
import * as XLSX from "XLSX"; import * as XLSX from "XLSX";
import { MdEditor, MdPreview } from "md-editor-v3"; import { MdEditor, MdPreview } from "md-editor-v3";
@ -333,17 +333,29 @@ import { getUserInfo } from "@/utils/auth";
import { onMounted, reactive } from "vue"; import { onMounted, reactive } from "vue";
import popModel from "@/views/components/popModal.vue"; import popModel from "@/views/components/popModal.vue";
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const formData=reactive({ const formData = reactive({
value1:'', value1: "",
value2:'', value2: "",
value3:'', value3: "",
value4:'', value4: "",
value5:'', value5: "",
}) });
const task=()=>{ const task = () => {
dialogVisible.value = false if (Object.values(formData).every((item) => item == "")) {
proxy.$modal.msgSuccess("提交完成!"); proxy.$modal.msgWarning("请填写完整");
} return;
}
portraitModel
.submit({
userId: JSON.parse(getUserInfo()).userId,
taskName: "关联规则挖掘",
numberOfErrors: 0,
})
.then((res) => {
dialogVisible.value = false;
proxy.$modal.msgSuccess("提交成功");
});
};
const dialogVisible = ref(false); const dialogVisible = ref(false);
const runResultShow = ref(false); const runResultShow = ref(false);
const tableLabel = reactive([{ prop: "date", label: "" }]); const tableLabel = reactive([{ prop: "date", label: "" }]);
@ -433,27 +445,27 @@ const handleChange = (info) => {
}; };
const flag = ref(false); const flag = ref(false);
onMounted(()=>{ onMounted(() => {
getList() getList();
}) });
const optionData=()=>{ const optionData = () => {
API.viewingMetrics({userId:JSON.parse(getUserInfo()).userId,tableName:input.value,algorithmName:'关联规则挖掘'}).then((res)=>{ API.viewingMetrics({ userId: JSON.parse(getUserInfo()).userId, tableName: input.value, algorithmName: "关联规则挖掘" }).then((res) => {
tableData.value=[] tableData.value = [];
input3.value='' input3.value = "";
res.data.forEach(element => { res.data.forEach((element) => {
tableData.value.push({ tableData.value.push({
text:element text: element,
}) });
}) });
}) });
} };
const selectedRows = ref([]); const selectedRows = ref([]);
const handleSelectionChange = (selection) => { const handleSelectionChange = (selection) => {
selectedRows.value = selection; selectedRows.value = selection;
}; };
const tableData2 = ref([]); const tableData2 = ref([]);
const tableData3 = ref([]); const tableData3 = ref([]);
const resTable2 = ref(); const resTable2 = ref([]);
const taskZB = () => { const taskZB = () => {
flag.value = true; flag.value = true;
if (selectedRows.value.length === 0) { if (selectedRows.value.length === 0) {
@ -545,7 +557,7 @@ const optionData2 = () => {
const exportTableRef = ref(null); const exportTableRef = ref(null);
const uplodFlag = ref(false); const uplodFlag = ref(false);
const computation = () => { const computation = () => {
if (resTable2.value.length === 0 || input2.value == "" || input3.value == "") { if (resTable2.value.length == 0 || input2.value == "" || input3.value == "") {
proxy.$modal.msgWarning("请先计算/对数据进行预处理！"); proxy.$modal.msgWarning("请先计算/对数据进行预处理！");
return; return;
} }
@ -637,7 +649,7 @@ const startOver = () => {
// min-height: 965px; // min-height: 965px;
display: flex; display: flex;
width: 205px; width: 205px;
height: 100%; height: 100%;
background: #041c49; background: #041c49;
// padding: 0px 10px; // padding: 0px 10px;
.left-top { .left-top {
@ -755,7 +767,7 @@ const startOver = () => {
font-size: 16px; font-size: 16px;
} }
} }
:deep(.el-checkbox){ :deep(.el-checkbox) {
color:#ffffff; color: #ffffff;
} }
</style> </style>

449
src/views/digitalMarketingAlgorithms/components/clusterAnalysis.vue
Unescape Escape View File

@ -1,23 +1,22 @@
<template> <template>
<!-- <el-scrollbar ref="scrollbar" height="800px"> --> <!-- <el-scrollbar ref="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 @click="algorithmicKnowledge()"> <el-button @click="algorithmicKnowledge()">
<img src="../../../assets/images/导入.png" alt="" /> <img src="../../../assets/images/导入.png" alt="" />
算法知识导入 算法知识导入
</el-button> </el-button>
<el-button @click="taskSubmit"> <el-button @click="taskSubmit">
<img src="../../../assets/images/提交.png" alt="" /> <img src="../../../assets/images/提交.png" alt="" />
实训任务提交 实训任务提交
</el-button> </el-button>
</div> </div>
<div class="app-main"> <div class="app-main">
<div class="main-left">
<div class="main-left"> <el-scrollbar height="550px" style="padding: 0 10px" min-size="5">
<el-scrollbar height="550px" style="padding: 0 10px" min-size="5">
<div> <div>
<div class="left-top"> <div class="left-top">
<span>一、选择指标</span> <span>一、选择指标</span>
@ -65,21 +64,20 @@
<span style="font-weight: 400; font-size: 12px; color: #ffffff">最大迭代次数：</span> <span style="font-weight: 400; font-size: 12px; color: #ffffff">最大迭代次数：</span>
<el-input v-model="input6" style="width: 180px; margin-top: 5px" /> <el-input v-model="input6" style="width: 180px; margin-top: 5px" />
</div> </div>
<el-button @click="computation">计算</el-button> <el-button @click="clusterAnalysisCalculation">计算</el-button>
</div> </div>
</div> </div>
</el-scrollbar> </el-scrollbar>
<div style="margin-top: auto"> <div style="margin-top: auto">
<div class="startOver" @click="startOver()"> <div class="startOver" @click="startOver()">
<img src="../../../assets/images/重新开始.png" alt="" /> <img src="../../../assets/images/重新开始.png" alt="" />
<span>重新开始</span> <span>重新开始</span>
</div>
</div> </div>
</div> </div>
</div>
<div class="main-right"> <div class="main-right">
<el-scrollbar height="500px" ref="scrollbar" style="padding: 20px"> <el-scrollbar height="500px" ref="scrollbar" style="padding: 20px">
<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 ref="exportTableRef" :data="tableData2" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350"> <el-table ref="exportTableRef" :data="tableData2" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
@ -105,9 +103,9 @@
<div id="main2" style="width: 500px; height: 500px"></div> <div id="main2" style="width: 500px; height: 500px"></div>
</div> </div>
</div> </div>
</el-scrollbar> </el-scrollbar>
</div>
</div> </div>
</div>
<!-- </el-scrollbar> --> <!-- </el-scrollbar> -->
<el-dialog v-model="dialogVisible" title="实训任务提交" width="600" custom-class="dialogClass" :show-close="false"> <el-dialog v-model="dialogVisible" title="实训任务提交" width="600" custom-class="dialogClass" :show-close="false">
@ -274,6 +272,8 @@
</template> </template>
<script setup> <script setup>
import * as portraitModel from "@/api/portraitModel";
import popModel from "@/views/components/popModal.vue"; import popModel from "@/views/components/popModal.vue";
import { htmlPdf } from "@/utils/pdf.js"; import { htmlPdf } from "@/utils/pdf.js";
import * as echarts from "echarts"; import * as echarts from "echarts";
@ -287,18 +287,33 @@ const { proxy } = getCurrentInstance();
const dialogVisible = ref(false); const dialogVisible = ref(false);
const tableLabel = reactive([{ prop: "date", label: "" }]); const tableLabel = reactive([{ prop: "date", label: "" }]);
const isFlag = ref(false); const isFlag = ref(false);
const formInline2=reactive({ const formInline2 = reactive({
value1:'', value1: "",
value2:'', value2: "",
value3:'', value3: "",
value4:'', value4: "",
value5:'', value5: "",
value6:'', value6: "",
}) });
const task=()=>{ const task = () => {
dialogVisible.value = false for(let key in formInline2){
proxy.$modal.msgSuccess("提交完成!"); if(formInline2[key] == ""){
} proxy.$modal.msgError("请填写完整!");
return;
}
}
portraitModel
.submit({
userId: JSON.parse(getUserInfo()).userId,
taskName: "聚类分析",
numberOfErrors: 0,
})
.then((res) => {
dialogVisible.value = false;
proxy.$modal.msgSuccess("提交成功");
});
};
const algorithmicKnowledge = () => { const algorithmicKnowledge = () => {
runResultShow.value = true; runResultShow.value = true;
}; };
@ -361,7 +376,8 @@ onMounted(() => {
getList(); getList();
var chartDom = document.getElementById("main"); var chartDom = document.getElementById("main");
var chartDom2 = document.getElementById("main2"); var chartDom2 = document.getElementById("main2");
myChart = echarts.init(chartDom);472 myChart = echarts.init(chartDom);
472;
myChart2 = echarts.init(chartDom2); myChart2 = echarts.init(chartDom2);
// 初始化图表配置 // 初始化图表配置
var option = { var option = {
@ -389,46 +405,46 @@ onMounted(() => {
// 设置初始的配置 // 设置初始的配置
myChart.setOption(option); myChart.setOption(option);
myChart2.setOption(option); myChart2.setOption(option);
}) });
const optionData=()=>{ const optionData = () => {
API.viewingMetrics({userId:JSON.parse(getUserInfo()).userId,tableName:input.value,algorithmName:'聚类分析'}).then((res)=>{ API.viewingMetrics({ userId: JSON.parse(getUserInfo()).userId, tableName: input.value, algorithmName: "聚类分析" }).then((res) => {
tableData.value=[] tableData.value = [];
input3.value='' input3.value = "";
res.data.forEach(element => { res.data.forEach((element) => {
tableData.value.push({ tableData.value.push({
text:element text: element,
}) });
}) });
}) });
};
const selectedRows = ref([]);
const handleSelectionChange = (selection) => {
selectedRows.value = selection;
};
const tableData2 = ref([]);
const tableData3 = ref([]);
const resTable2 = ref();
const taskZB = () => {
flag.value = true;
if (selectedRows.value.length === 0) {
return proxy.$modal.msgWarning("请选择指标!");
} }
const selectedRows = ref([]); const sendData = {
const handleSelectionChange = (selection) => { tableName: input.value,
selectedRows.value = selection; userId: JSON.parse(getUserInfo()).userId,
}; fieldList: selectedRows.value.map((item) => item.text),
const tableData2=ref([]) };
const tableData3=ref([]) API.analysisDataDisplay(sendData).then((res) => {
const resTable2=ref() tableLabel.length = 0;
const taskZB=()=>{ for (const key in res.data[0]) {
flag.value=true tableLabel.push({
if(selectedRows.value.length===0){ label: key,
return prop: key,
} });
const sendData={ }
tableName:input.value, tableData2.value = res.data;
userId:JSON.parse(getUserInfo()).userId, flag.value = true;
fieldList:selectedRows.value.map(item=>item.text)
}
API.analysisDataDisplay(sendData).then((res)=>{
tableLabel.length=0
for (const key in res.data[0]) {
tableLabel.push({
label:key,
prop:key
})
}
tableData2.value=res.data
flag.value=true
proxy.$modal.msgSuccess("计算完成!"); proxy.$modal.msgSuccess("计算完成!");
tableData2.value = res.data; tableData2.value = res.data;
flag.value = true; flag.value = true;
@ -497,147 +513,148 @@ const optionData2 = () => {
proxy.$modal.msgSuccess("预处理成功！"); proxy.$modal.msgSuccess("预处理成功！");
}); });
} }
}
const showChart = ref(false); const showChart = ref(false);
//生产表格 //生产表格
const nowData = ref([]); const nowData = ref([]);
const computation = () => { const clusterAnalysisCalculation = () => {
if (tableData2.value.length === 0 && input2.value == "" && input3.value == "") { if (tableData2.value.length === 0 || input2.value == "" || input3.value == "") {
proxy.$modal.msgWarning("请先计算/对数据进行预处理！"); proxy.$modal.msgWarning("请先计算/对数据进行预处理！");
return; return;
} }
if (input5.value && input6.value && input4.value) { if (input5.value && input6.value && input4.value) {
const sendData = { const sendData = {
k: input5.value, k: input5.value,
t: input6.value, t: input6.value,
userId: JSON.parse(getUserInfo()).userId, userId: JSON.parse(getUserInfo()).userId,
deduplicatedDataList: resTable2.value, deduplicatedDataList: resTable2.value,
}; };
API.clusterAnalysisPlot(sendData) API.clusterAnalysisPlot(sendData)
.then((res) => { .then((res) => {
showChart.value = true; showChart.value = true;
let sex = 1; let sex = 1;
tableData3.value = []; tableData3.value = [];
nowData.value = res.data; nowData.value = res.data;
res.data.forEach((item, index) => { res.data.forEach((item, index) => {
const newItem = {}; const newItem = {};
tableLabel.forEach((label, index) => { tableLabel.forEach((label, index) => {
if (index === 0) { if (index === 0) {
newItem[label.prop] = "簇" + sex; // 动态设置字段名 newItem[label.prop] = "簇" + sex; // 动态设置字段名
} else { } else {
newItem[label.prop] = ""; newItem[label.prop] = "";
} }
});
newItem["TSuid"] = sex;
sex++;
tableData3.value.push(newItem);
tableData3.value[index].children = [];
const children = ref([]);
item.forEach((item2, sexx) => {
const newItem2 = {};
tableLabel.forEach((label, index2) => {
newItem2[label.prop] = item2[index2]; // 动态设置字段名
}); });
newItem2["TSuid"] = "" + sex + sexx; newItem["TSuid"] = sex;
children.value.push(newItem2); sex++;
}); tableData3.value.push(newItem);
tableData3.value[index].children = children.value; tableData3.value[index].children = [];
console.log(tableData3.value); const children = ref([]);
}); item.forEach((item2, sexx) => {
}) const newItem2 = {};
.then(() => { tableLabel.forEach((label, index2) => {
API.clusterAnalysis(sendData).then((res) => { newItem2[label.prop] = item2[index2]; // 动态设置字段名
myChart.setOption({ });
series: [ newItem2["TSuid"] = "" + sex + sexx;
{ children.value.push(newItem2);
data: [], // 清空数据 });
}, tableData3.value[index].children = children.value;
], console.log(tableData3.value);
});
myChart2.setOption({
series: [
{
data: [], // 清空数据
},
],
});
Object.keys(res.data.dataSet).forEach((key) => {
const bgColor = getRandomColorHex();
addData(myChart, res.data.dataSet[key], bgColor);
addData(myChart2, res.data.dataSet[key], bgColor);
}); });
Object.keys(res.data.centroid).forEach((key) => { })
addData(myChart2, res.data.centroid[key], "red"); .then(() => {
API.clusterAnalysis(sendData).then((res) => {
myChart.setOption({
series: [
{
data: [], // 清空数据
},
],
});
myChart2.setOption({
series: [
{
data: [], // 清空数据
},
],
});
Object.keys(res.data.dataSet).forEach((key) => {
const bgColor = getRandomColorHex();
addData(myChart, res.data.dataSet[key], bgColor);
addData(myChart2, res.data.dataSet[key], bgColor);
});
Object.keys(res.data.centroid).forEach((key) => {
addData(myChart2, res.data.centroid[key], "red");
});
}); });
}); });
nextTick(() => {
setTimeout(() => {
const scrollContainer = scrollbar.value?.$el.querySelector(".el-scrollbar__wrap");
if (scrollContainer) {
scrollContainer.scrollTo({
top: scrollContainer.scrollHeight,
behavior: "smooth", // 平滑滚动
});
}
}, 100);
}); });
nextTick(() => { } else {
setTimeout(() => { proxy.$modal.msgWarning("请模型参数进行设置！");
const scrollContainer = scrollbar.value?.$el.querySelector(".el-scrollbar__wrap"); }
if (scrollContainer) { };
scrollContainer.scrollTo({ const exportTableRef = ref(null);
top: scrollContainer.scrollHeight, const upLoad = () => {
behavior: "smooth", // 平滑滚动 const tableDom = exportTableRef.value?.$el;
}); if (!tableDom) {
} return;
}, 100); }
const wb = XLSX.utils.table_to_book(tableDom);
// XLSX.writeFile(wb, '聚类分析.xlsx');
const zip = new JSZip();
const excelBlob = XLSX.write(wb, { bookType: "xlsx", type: "array" });
zip.file("聚类分析.xlsx", new Blob([excelBlob], { type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" }));
zip.file("聚类分析图表.pdf", handleExport());
zip.generateAsync({ type: "blob" }).then((content) => {
saveAs(content, "聚类分析.zip");
}); });
} else { };
proxy.$modal.msgWarning("请模型参数进行设置！");
} const startOver = () => {
}; myChart.setOption({
const exportTableRef = ref(null); series: [
const upLoad = () => { {
const tableDom = exportTableRef.value?.$el; data: [], // 清空数据
if (!tableDom) { },
return; ],
} });
const wb = XLSX.utils.table_to_book(tableDom); myChart2.setOption({
// XLSX.writeFile(wb, '聚类分析.xlsx'); series: [
const zip = new JSZip(); {
const excelBlob = XLSX.write(wb, { bookType: "xlsx", type: "array" }); data: [], // 清空数据
zip.file("聚类分析.xlsx", new Blob([excelBlob], { type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" })); },
zip.file("聚类分析图表.pdf", handleExport()); ],
zip.generateAsync({ type: "blob" }).then((content) => { });
saveAs(content, "聚类分析.zip"); input.value = "";
}); tableData.value = [];
}; tableData2.value = [];
tableData3.value = [];
input2.value = "";
input3.value = "";
input4.value = "";
input5.value = "";
input6.value = "";
showChart.value = false;
tableLabel.length = 0;
nowData.value = [];
};
//图表导出pdf
const handleExport = async (name) => {
var fileName = "聚类分析图表";
const fileList = document.getElementsByClassName("pdfRef"); // 很重要
const pdfBlob = await htmlPdf(fileName, document.querySelector("#pdfRef"), fileList, true);
return pdfBlob;
};
const startOver = () => {
myChart.setOption({
series: [
{
data: [], // 清空数据
},
],
});
myChart2.setOption({
series: [
{
data: [], // 清空数据
},
],
});
input.value = "";
tableData.value = [];
tableData2.value = [];
tableData3.value = [];
input2.value = "";
input3.value = "";
input4.value = "";
input5.value = "";
input6.value = "";
showChart.value = false;
tableLabel.length = 0;
nowData.value = [];
};
//图表导出pdf
const handleExport = async (name) => {
var fileName = "聚类分析图表";
const fileList = document.getElementsByClassName("pdfRef"); // 很重要
const pdfBlob = await htmlPdf(fileName, document.querySelector("#pdfRef"), fileList, true);
return pdfBlob;
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -680,7 +697,7 @@ const handleExport = async (name) => {
// min-height: 965px; // min-height: 965px;
display: flex; display: flex;
width: 205px; width: 205px;
height: 100%; height: 100%;
background: #041c49; background: #041c49;
// padding: 0px 10px; // padding: 0px 10px;
.left-top { .left-top {

153
src/views/digitalMarketingAlgorithms/components/regressionAnalysis.vue
Unescape Escape View File

@ -1,22 +1,22 @@
<template> <template>
<!-- <el-scrollbar ref="scrollbar" height="800px"> --> <!-- <el-scrollbar ref="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 @click="runResultShow = true"> <el-button @click="runResultShow = true">
<img src="../../../assets/images/导入.png" alt="" /> <img src="../../../assets/images/导入.png" alt="" />
算法知识导入 算法知识导入
</el-button> </el-button>
<el-button @click="taskSubmit"> <el-button @click="taskSubmit">
<img src="../../../assets/images/提交.png" alt="" /> <img src="../../../assets/images/提交.png" alt="" />
实训任务提交 实训任务提交
</el-button> </el-button>
</div> </div>
<div class="app-main"> <div class="app-main">
<div class="main-left"> <div class="main-left">
<el-scrollbar height="550px" style="padding: 0 10px" min-size="5"> <el-scrollbar height="550px" style="padding: 0 10px" min-size="5">
<div> <div>
<div class="left-top"> <div class="left-top">
<span>一、选择指标</span> <span>一、选择指标</span>
@ -73,49 +73,42 @@
<el-button @click="computation">计算</el-button> <el-button @click="computation">计算</el-button>
</div> </div>
</div> </div>
</el-scrollbar> </el-scrollbar>
<div style="margin-top: auto"> <div style="margin-top: auto">
<div class="startOver" @click="startOver()"> <div class="startOver" @click="startOver()">
<img src="../../../assets/images/重新开始.png" alt="" /> <img src="../../../assets/images/重新开始.png" alt="" />
<span>重新开始</span> <span>重新开始</span>
</div>
</div>
</div>
<div class="main-right">
<el-scrollbar height="500px" ref="scrollbar" style="padding: 20px;">
<div>
<span style="font-weight: bold;font-size: 18px;color: #3596EB;">分析数据：</span>
<el-table :data="tableData2" 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>
<!-- <el-pagination style="margin-top:10px" background layout="prev, pager, next" :total="1000" /> -->
</div>
<div class="analysisResults" style="margin-top: 20px">
<span style="font-weight: bold;font-size: 18px;color: #3596EB;display: block;">分析结果：</span>
<el-button class="imgBtn" v-if="flagUP" @click="upLoad">下载</el-button>
<el-table :data="tableData3" ref="exportTableRef" row-key="TSuid" style="width: 94%;margin-top:10px" :header-cell-style="headerCellStyle" height="350">
<el-table-column v-for="column in tableLabel2" :key="column.prop" :prop="column.prop" :label="column.label" align="center"/>
<el-table-column v-if="flagColumn" label="预测" align="center">
<template #default="scope">
<el-button type="primary" link @click="handleClick(scope.row)" v-if="predictionResults===''">预测</el-button>
<span v-else>{{predictionResults}}</span>
</template>
</el-table-column>
</el-table>
</div>
</el-scrollbar>
</div> </div>
</div> </div>
<!-- </el-scrollbar> --> </div>
<div class="main-right">
<el-dialog <el-scrollbar height="500px" ref="scrollbar" style="padding: 20px">
v-model="dialogVisible" <div>
title="实训任务提交" <span style="font-weight: bold; font-size: 18px; color: #3596eb">分析数据：</span>
width="600" <el-table :data="tableData2" style="width: 94%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
custom-class="dialogClass" <el-table-column v-for="column in tableLabel" :key="column.prop" :prop="column.prop" :label="column.label" align="center" />
:show-close="false" </el-table>
> <!-- <el-pagination style="margin-top:10px" background layout="prev, pager, next" :total="1000" /> -->
</div>
<div class="analysisResults" style="margin-top: 20px">
<span style="font-weight: bold; font-size: 18px; color: #3596eb; display: block">分析结果：</span>
<el-button class="imgBtn" v-if="flagUP" @click="upLoad">下载</el-button>
<el-table :data="tableData3" ref="exportTableRef" row-key="TSuid" style="width: 94%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
<el-table-column v-for="column in tableLabel2" :key="column.prop" :prop="column.prop" :label="column.label" align="center" />
<el-table-column v-if="flagColumn" label="预测" align="center">
<template #default="scope">
<el-button type="primary" link @click="handleClick(scope.row)" v-if="predictionResults === ''">预测</el-button>
<span v-else>{{ predictionResults }}</span>
</template>
</el-table-column>
</el-table>
</div>
</el-scrollbar>
</div>
</div>
<!-- </el-scrollbar> -->
<el-dialog v-model="dialogVisible" title="实训任务提交" width="600" 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>
@ -314,6 +307,8 @@
</template> </template>
<script setup> <script setup>
import * as portraitModel from "@/api/portraitModel";
import popModel from "@/views/components/popModal.vue"; import popModel from "@/views/components/popModal.vue";
import * as echarts from "echarts"; import * as echarts from "echarts";
import * as API from "@/api/AI.js"; import * as API from "@/api/AI.js";
@ -322,15 +317,29 @@ import * as XLSX from "XLSX";
import { onMounted, reactive } from "vue"; import { onMounted, reactive } from "vue";
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const dialogVisible = ref(false); const dialogVisible = ref(false);
const formInline3=reactive({ const formInline3 = reactive({
value1:'', value1: "",
value2:'', value2: "",
value3:'', value3: "",
}) });
const task=()=>{ const task = () => {
dialogVisible.value = false for (let key in formInline3) {
proxy.$modal.msgSuccess("提交完成!"); if (formInline3[key] == "") {
} proxy.$modal.msgWarning("请填写完整!");
return;
}
}
portraitModel
.submit({
userId: JSON.parse(getUserInfo()).userId,
taskName: "回归分析",
numberOfErrors: 0,
})
.then((res) => {
dialogVisible.value = false;
proxy.$modal.msgSuccess("提交完成!");
});
};
const dialogVisible2 = ref(false); const dialogVisible2 = ref(false);
const flagColumn = ref(false); const flagColumn = ref(false);
const runResultShow = ref(false); const runResultShow = ref(false);
@ -414,14 +423,14 @@ const formInline = reactive({
}); });
const input = ref(); const input = ref();
const options = ref([]); const options = ref([]);
const input2 = ref(''); const input2 = ref("");
const options2 = ref([ const options2 = ref([
{ {
value: "数据区重", value: "数据区重",
label: "数据去重", label: "数据去重",
}, },
]); ]);
const input3 = ref(''); const input3 = ref("");
const options3 = ref([ const options3 = ref([
{ {
value: "缺失值处理--剔除数据", value: "缺失值处理--剔除数据",
@ -478,8 +487,8 @@ const optionData2 = () => {
}; };
//生产表格 //生产表格
const computation = () => { const computation = () => {
if (tableData.value.length === 0 || input2.value=='' || input3.value=='') { if (tableData.value.length === 0 || input2.value == "" || input3.value == "") {
proxy.$modal.msgWarning("请先计算/对数据进行预处理！"); proxy.$modal.msgWarning("请先计算/对数据进行预处理！");
return; return;
} }
@ -658,7 +667,7 @@ const startOver = () => {
// min-height: 965px; // min-height: 965px;
display: flex; display: flex;
width: 205px; width: 205px;
height: 100%; height: 100%;
background: #041c49; background: #041c49;
// padding: 0px 10px; // padding: 0px 10px;
.left-top { .left-top {

4
vite.config.js
Unescape Escape View File

@ -2,7 +2,7 @@
* @Author: qinzhenpen qzp1807@126.com * @Author: qinzhenpen qzp1807@126.com
* @Date: 2024-07-15 15:44:46 * @Date: 2024-07-15 15:44:46
* @LastEditors: qinzhenpen qzp1807@126.com * @LastEditors: qinzhenpen qzp1807@126.com
* @LastEditTime: 2024-08-21 17:56:44 * @LastEditTime: 2024-08-21 18:47:09
* @FilePath: \digital-marketing\vite.config.js * @FilePath: \digital-marketing\vite.config.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/ */
@ -46,7 +46,7 @@ export default defineConfig(({ mode, command }) => {
} }
}, },
esbuild: { esbuild: {
drop: ['console', 'debugger'], // drop: ['console', 'debugger'],
}, },
//fix:error:stdin>:7356:1: warning: "@charset" must be the first rule in the file //fix:error:stdin>:7356:1: warning: "@charset" must be the first rule in the file
css: { css: {

Write Preview
Loading…
Cancel
Save