Compare commits
No commits in common. "master" and "Branch_cjh" have entirely different histories.
master
...
Branch_cjh
Binary file not shown.
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 4.2 KiB |
|
@ -4,7 +4,6 @@
|
|||
/* 设置所有对话框的header颜色固定 */
|
||||
.el-dialog__header{
|
||||
background-color: #158484;
|
||||
color:white;
|
||||
font-size: 28px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
@ -23,7 +22,6 @@
|
|||
padding: 0;
|
||||
background-color: #f5f6fa;
|
||||
margin: 0;
|
||||
border-radius: 12px;
|
||||
}
|
||||
.el-dialog__footer{
|
||||
background-color: white;
|
||||
|
|
|
@ -28,10 +28,10 @@
|
|||
@date: 2024年6月29日
|
||||
@author: myz
|
||||
-->
|
||||
<!-- <el-menu-item index="/test">
|
||||
<el-menu-item index="/test">
|
||||
<el-icon><View /></el-icon>
|
||||
<span v-show = '!isFold'>测试专用</span>
|
||||
</el-menu-item> -->
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
</el-container>
|
||||
</template>
|
||||
|
@ -70,7 +70,7 @@ export default{
|
|||
<style scoped>
|
||||
.containerSystemName{
|
||||
color:white; /**字体颜色为白色 */
|
||||
background-color: #1aa4a4; /*容器背景颜色*/
|
||||
background-color: #158484; /* 容器背景颜色 */
|
||||
display: flex;
|
||||
justify-content: center; /**水平居中 */
|
||||
align-items: center; /**竖直居中 */
|
||||
|
@ -86,7 +86,7 @@ export default{
|
|||
color:white
|
||||
}
|
||||
.text-systemName{
|
||||
background-color: transparent;
|
||||
background-color: #158484; /* 容器背景颜色 */
|
||||
display: flex;
|
||||
/**竖直居中 */
|
||||
align-items: center;
|
||||
|
@ -97,8 +97,7 @@ export default{
|
|||
}
|
||||
.containerSelections{
|
||||
color: white;
|
||||
/* background-color: #1DAFAF; */
|
||||
@apply bg-gradient-to-tr from-cyan-400 to-teal-500;
|
||||
background-color: #1DAFAF;
|
||||
height: 94%;
|
||||
width:100%;
|
||||
border:0px;
|
||||
|
|
|
@ -30,7 +30,7 @@
|
|||
<el-select v-model = 'form.logic' style="width: 60%;">
|
||||
<el-option label = 'AND 逻辑与' value = 'AND' />
|
||||
<el-option label = 'OR 逻辑或' value = 'OR' />
|
||||
|
||||
<el-option label = 'NOR 逻辑非' value = 'NOR' />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 约束列 -->
|
||||
|
|
|
@ -2,9 +2,9 @@
|
|||
<!-- 父组件:HomePage -->
|
||||
<div class="card-container">
|
||||
<!-- PS: 网络版本将替换'tableData' 为 'cluesTableData' -->
|
||||
<el-card v-for="(item, index) in cluesTableData" :key="index" class="card-item">
|
||||
<el-card v-for="(item, index) in tableData" :key="index" class="card-item">
|
||||
<div class="card-content">
|
||||
<h2 id = 'cdbID' class = 'font-bold text-xl'>线索库唯一标识:{{ item.id }}</h2>
|
||||
<h2 id = 'cdbID' class = 'font-bold'>线索库唯一标识:{{ item.clue_id }}</h2>
|
||||
<h1 id = 'cdbName'>线索库名:{{ item.name }}</h1>
|
||||
<el-button size="small" round @click="watchClue(item)">
|
||||
查看
|
||||
|
@ -77,9 +77,6 @@
|
|||
this.$handleNetError(error);
|
||||
});
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
|
||||
},
|
||||
//加载页面的时候获取数据
|
||||
beforeMount() {
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
</div>
|
||||
<div class="demo-select">
|
||||
<div class="block">
|
||||
<span class="demonstration">选择线索指定日期列</span>
|
||||
<span class="demonstration">选择线索起始日期列</span>
|
||||
<el-select v-model="selectedrow" placeholder="请选择列名">
|
||||
<el-option
|
||||
v-for="row in rowOptions"
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
</div>
|
||||
<div class="demo-select">
|
||||
<div class="block">
|
||||
<span class="demonstration">选择起始日期列</span>
|
||||
<span class="demonstration">选择起始列</span>
|
||||
<el-select v-model="selectedrow" placeholder="请选择列名">
|
||||
<el-option
|
||||
v-for="row in rowOptions"
|
||||
|
@ -27,7 +27,7 @@
|
|||
</div>
|
||||
<div class="demo-select">
|
||||
<div class="block">
|
||||
<span class="demonstration">选择截止日期列</span>
|
||||
<span class="demonstration">选择截止列</span>
|
||||
<el-select v-model="selectedrow2" placeholder="请选择列名">
|
||||
<el-option
|
||||
v-for="row in rowOptions2"
|
||||
|
|
|
@ -33,7 +33,7 @@ const routes: Array<RouteRecordRaw> = [
|
|||
{
|
||||
path: '/test',
|
||||
name: 'test',
|
||||
component: ()=>import('@/views/ShowGraph.vue')
|
||||
component: ()=>import('@/views/newHomePage.vue')
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<el-main class ='container_Tools_Main'>
|
||||
<el-header class ='containerTools'>
|
||||
<!-- 模式切换按钮 -->
|
||||
<el-button class = 'btnDelete' @click="deleteSelected">
|
||||
<el-button class = 'btnDelete'>
|
||||
<el-tooltip content = '批量删除'>
|
||||
<el-icon><Delete /></el-icon>
|
||||
</el-tooltip>
|
||||
|
@ -180,7 +180,9 @@ export default{
|
|||
searchDialogVisible : false,
|
||||
// 查找所用变量
|
||||
"Constraints":[
|
||||
|
||||
{"merge":"AND","col_id":"3","type":"double","down":"0","up":"INF","inside":"","date":""}, // 满足第1_3列(实数),范围为大于等于0的
|
||||
{"merge":"AND","col_id":"2","type":"date","down":"","up":"","inside":"","date":"03.06.2024,30.06.2024"}, // 同时满足第!_2列(日期),早于2024/1/1的
|
||||
{"merge":"OR","col_id":"4","type":"string","down":"","up":"","inside":"AAA","date":""} // 或者满足第1_4列(字符串),存在“AAA”这个连续字串的
|
||||
],
|
||||
pageTitle, // 当前页面的名称/所展示的线索库的名称
|
||||
clueId, // 线索库ID
|
||||
|
@ -350,49 +352,6 @@ export default{
|
|||
this.$handleNetError(error);
|
||||
});
|
||||
},
|
||||
async deleteSelected(){
|
||||
// 如果没有选择数据,抛出警告
|
||||
if(this.selectedColumnData.length == 0){
|
||||
this.$message({
|
||||
type: 'warning',
|
||||
message: '请选择要删除的线索'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
//遍历选中数据,提取需要的信息
|
||||
const deleteItems = this.selectedColumnData.map(item=>({
|
||||
table_id: this.clueId,
|
||||
clue_id: item.clue_id
|
||||
}));
|
||||
|
||||
let flag = true;
|
||||
|
||||
try{
|
||||
for(let i = 0; i < deleteItems.length; i++){
|
||||
let response = await this.$axios.post('http://localhost:8000/delClue/', deleteItems[i]);
|
||||
if(response.data.message == "删除失败"){
|
||||
flag = false;
|
||||
this.$message({
|
||||
type:'error',
|
||||
message:'删除失败,请重试!'
|
||||
});
|
||||
}
|
||||
}
|
||||
}catch(error){
|
||||
flag = false;
|
||||
this.$handleNetError(error);
|
||||
}
|
||||
|
||||
if(flag){
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功,即将刷新界面'
|
||||
});
|
||||
// 删除成功后,更新表格数据
|
||||
location.reload();
|
||||
}
|
||||
},
|
||||
// 编辑线索记录按钮
|
||||
editClue(row){
|
||||
let editDataID = {
|
||||
|
@ -453,10 +412,6 @@ export default{
|
|||
console.log(newv);
|
||||
},
|
||||
},
|
||||
beforeMount(){
|
||||
this.getClueCols();
|
||||
this.getClueData();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
|
@ -18,10 +18,9 @@
|
|||
</el-button>
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
title="上传文档"
|
||||
width="500"
|
||||
align-center
|
||||
style = 'border-radius: 20px; color:white;'
|
||||
:show-close = 'false'
|
||||
>
|
||||
<div>
|
||||
<el-upload
|
||||
|
|
|
@ -1,32 +1,35 @@
|
|||
// Variable overrides first
|
||||
$primary: #900;
|
||||
$enable-shadows: true;
|
||||
$prefix: "mo-";
|
||||
|
||||
// Then import Bootstrap
|
||||
@import "../node_modules/bootstrap/scss/bootstrap";
|
||||
import * as echarts from 'echarts';
|
||||
|
||||
|
||||
|
||||
<template>
|
||||
<el-container class = 'h-full bg-blue-100'>
|
||||
<el-header class = 'containerHead'>
|
||||
<HeaderPage :pageTitle = 'pageTitle'></HeaderPage>
|
||||
<el-button class = 'btnReturnHomePage' @click="returnHome">
|
||||
<el-tooltip content = '返回上一级'>
|
||||
<el-icon><Back /></el-icon>
|
||||
<el-tooltip content = '返回首页'>
|
||||
<el-icon><ArrowLeft /></el-icon>
|
||||
</el-tooltip>
|
||||
</el-button>
|
||||
</el-header>
|
||||
<el-container id = "containerMain">
|
||||
<el-container>
|
||||
<div class="container">
|
||||
<div class="left-grid">
|
||||
<el-card class = 'h-full w-full'>
|
||||
<!-- 选项栏 -->
|
||||
<div class="navbar bg-white flex justify-center pt-0">
|
||||
<span class="text-2xl font-bold pt-0">绘图选项</span>
|
||||
</div>
|
||||
<!-- 多元素多性质比较项 -->
|
||||
<div class = 'rounded-3xl bg-slate-100 shadow-md flex justify-between items-center font-bold pr-7'>
|
||||
<el-card>
|
||||
<el-switch
|
||||
v-model="OpenSelected"
|
||||
class="ml-2"
|
||||
style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
|
||||
/>
|
||||
<p6 v-show= OpenSelected>启用多属性值比较</p6>
|
||||
<p6 v-show= !OpenSelected>禁用多属性值比较</p6>
|
||||
</div>
|
||||
<!-- 选择栏 -->
|
||||
<el-select v-model="Selectedcol" placeholder="输入指定的属性" style="width: 100%; margin-top: 2%; margin-bottom: 2%" v-show="OpenSelected">
|
||||
<p6 v-show= OpenSelected>启用多元素/多性质比较</p6>
|
||||
<p6 v-show= !OpenSelected>禁用多元素/多性质比较</p6>
|
||||
<el-select v-model="Selectedcol" placeholder="Select" style="width: 240px" v-show="OpenSelected">
|
||||
<el-option
|
||||
v-for="(item,index) in mycolumns"
|
||||
:key="index"
|
||||
|
@ -38,28 +41,27 @@
|
|||
<div>
|
||||
<div style="max-width: 600px; display: flex; flex-direction: row; align-items: center; margin-bottom: 10px;" v-for="(i, index) in SelectedName" :key="index">
|
||||
<el-alert :title="`已选中:${i}`" type="success" :closable="false" style="margin-right: 10px;"></el-alert>
|
||||
<button class = 'bg-red-400 text-white w-20 rounded:' plain @click="deleteSelected(index)">删除</button>
|
||||
<el-button type="success" plain @click="deleteSelected(index)">删除</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<el-input
|
||||
v-model="SelectNowName"
|
||||
style="width: 100%; margin-bottom: 2%"
|
||||
placeholder="输入需要统计的属性值"
|
||||
style="width: 240px"
|
||||
placeholder="输入需要选择的实体名称"
|
||||
clearable
|
||||
/>
|
||||
<button class="btn btn-accent w-full text-white" @click="AddSelectedName">确定</button>
|
||||
<el-button type="primary" @click="AddSelectedName">确定</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-divider />
|
||||
<div class = 'w-full'>
|
||||
<el-form class = 'w-full'>
|
||||
|
||||
<el-row>
|
||||
<el-form>
|
||||
<div class="demo-select">
|
||||
<!-- 选项栏 -->
|
||||
<div class="navbar bg-white flex justify-center pt-0">
|
||||
<span class="text-2xl font-bold pt-0">数据可视化类型</span>
|
||||
</div>
|
||||
<el-select v-model="selectedEntity" placeholder="选择生成的表格类型" style="width: 400px; margin-bottom: 2%;">
|
||||
<div class="block">
|
||||
<span class="demonstration">数据可视化</span>
|
||||
<el-select v-model="selectedEntity" placeholder="选择生成的表格类型" style="width: 400px">
|
||||
<el-option
|
||||
v-for="entity in entityOptions"
|
||||
:key="entity.value"
|
||||
|
@ -68,6 +70,7 @@
|
|||
></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 动态输入组件 -->
|
||||
<component
|
||||
:is="currentComponent"
|
||||
|
@ -89,21 +92,45 @@
|
|||
:Message4="SendOpenSelected"
|
||||
>
|
||||
</component>
|
||||
<!-- <el-card v-if="entity">
|
||||
<el-row>
|
||||
<el-table
|
||||
:data="columnData"
|
||||
:show-header="true"
|
||||
:max-height="200"
|
||||
@selection-change="handleSelectionChange"
|
||||
stripe
|
||||
>
|
||||
<el-table-column type="selection" width="55" style="background-color: black;"/>
|
||||
<el-table-column
|
||||
prop="name"
|
||||
label="对象"
|
||||
header-style="background-color: black; color: white;"
|
||||
style="text-align: center;">
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
</el-row>
|
||||
</el-card> -->
|
||||
<el-form-item>
|
||||
<el-button type="primary" size="medium" @click="handleGenerateChart">
|
||||
点击生成图表
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-footer class = 'p-0'>
|
||||
<button class = 'btn text-white w-full btn-accent' @click="handleGenerateChart">
|
||||
绘图
|
||||
</button>
|
||||
</el-footer>
|
||||
</div>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
<div class="right-grid" v-if="hasUpperContent">
|
||||
<button>取消</button>
|
||||
|
||||
<el-button type="danger" @click="clearchart">取消</el-button>
|
||||
<div ref="chartContainer" class="chart-container"></div>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="right-grid" v-else> <div ref="chartContainer" class="chart-container"></div> </div>
|
||||
</el-container>
|
||||
</div>
|
||||
|
||||
</el-container>
|
||||
</template>
|
||||
|
||||
|
@ -112,6 +139,7 @@
|
|||
import { ref } from 'vue'
|
||||
|
||||
import { markRaw } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import * as echarts from 'echarts';
|
||||
import Entity1Form from '@/components/graph/Entity1Form.vue';
|
||||
import Entity2Form from '@/components/graph/Entity2Form.vue';
|
||||
|
@ -119,7 +147,8 @@ import Entity3Form from '@/components/graph/Entitu3Form.vue';
|
|||
import Entity4Form from '@/components/graph/Entity4Form.vue';
|
||||
// import Entity5Form from '@/components/graph//Entity5Form.vue';
|
||||
import HeaderPage from "@/components/HeaderPage.vue";
|
||||
|
||||
import { avatarEmits } from 'element-plus';
|
||||
import AddDialog from '@/components/components_cluespage/AddDialog.vue';
|
||||
export default {
|
||||
|
||||
components: {
|
||||
|
@ -127,6 +156,7 @@ export default {
|
|||
Entity2Form,
|
||||
Entity3Form,
|
||||
Entity4Form,
|
||||
|
||||
HeaderPage
|
||||
},
|
||||
props: ['columns','tabledata'],
|
||||
|
@ -137,7 +167,7 @@ export default {
|
|||
selectedColumnData:Array,
|
||||
xz:[],
|
||||
yz:[],
|
||||
pageTitle:'线索可视化',
|
||||
pageTitle:'图形可视化',
|
||||
mytable:[],
|
||||
mycolumns:'',
|
||||
item:[],
|
||||
|
@ -156,24 +186,42 @@ export default {
|
|||
chartInstance: null ,// 存储图表实例的引用
|
||||
selectedEntity: '', // 默认选中的实体
|
||||
entityOptions: [
|
||||
{ value: 'entity1', label: '统计某一日期的分布' },
|
||||
{value:'entity2',label:'统计于某一日期开始,某一日期结束的数量分布'},
|
||||
{ value: 'entity3', label: '统计指定间隔的实数分布' },
|
||||
{ value: 'entity4', label: '统计字符串意义上的分布' },
|
||||
{ value: 'entity1', label: '以单一日期存在为横坐标' },
|
||||
{value:'entity2',label:'以两个日期之间存在为横坐标'},
|
||||
{ value: 'entity3', label: '实数区间为横坐标' },
|
||||
{ value: 'entity4', label: '字符串意义上的完全相同为横坐标' },
|
||||
|
||||
],
|
||||
dates: [],
|
||||
|
||||
SelectedName: [],
|
||||
SelectNowName: ref(''),
|
||||
OpenSelected: ref(true),
|
||||
OpenSelected: ref(false),
|
||||
Selectedcol:"",
|
||||
|
||||
//传送点
|
||||
Selectedcul:[],
|
||||
};
|
||||
},
|
||||
// watch: {
|
||||
// mytable: {
|
||||
// handler(newVal, oldVal) {
|
||||
// console.log('mytable changed');
|
||||
// console.log('New Value:', newVal);
|
||||
// console.log('Old Value:', oldVal);
|
||||
// // 在这里可以添加你希望在mytable变化时执行的逻辑
|
||||
// },
|
||||
// deep: true // 如果需要深度监听对象内部的变化,可以设置deep为true
|
||||
// }
|
||||
// },
|
||||
computed: {
|
||||
// entity()
|
||||
// {
|
||||
// if (this.selectedEntity=='entity5')
|
||||
// return 1;
|
||||
// else
|
||||
// return 0;
|
||||
// },
|
||||
columnData() {
|
||||
if (this.srow)
|
||||
{
|
||||
|
@ -213,8 +261,11 @@ export default {
|
|||
},
|
||||
created()
|
||||
{
|
||||
//console.log(this.$route.params.tabledata)
|
||||
this.mytable=JSON.parse(this.$route.params.tabledata);
|
||||
this.mycolumns = JSON.parse(this.$route.params.columns);
|
||||
|
||||
// console.log('Parsed columns:', this.mycolumns,this.table);
|
||||
},
|
||||
methods: {
|
||||
isValidDate(year, month, day) {
|
||||
|
@ -249,10 +300,80 @@ export default {
|
|||
this.SelectNowName = '';
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
|
||||
// handleSelectionChange(selection) {
|
||||
// // 在这里处理选择变化,selection 是选中的行数据数组
|
||||
// let obj=selection.map(item=>item.name)
|
||||
// // console.log(obj)
|
||||
// this.selectedColumnData =selection.map(item=>item.name)
|
||||
|
||||
// // console.log( this.selectedColumnData);
|
||||
// // console.log('选择的行数据:', selection);
|
||||
// },
|
||||
returnHome(){
|
||||
|
||||
window.history.back();
|
||||
},
|
||||
// extractThreeColumns(tableData) {
|
||||
// let extractedData = tableData.map(row => ({
|
||||
// month: row[this.srow3],
|
||||
// product: row[this.srow],
|
||||
// amount: row[this.srow2]
|
||||
// }));
|
||||
|
||||
// return extractedData;
|
||||
// },
|
||||
// count_sum_time()
|
||||
// {
|
||||
|
||||
// this.hasUpperContent = true;
|
||||
// let counts = {};
|
||||
// let salesData=this.extractThreeColumns(this.mytable);
|
||||
// // console.log(salesData)
|
||||
// // 遍历销售记录数组,填充 counts 对象
|
||||
// salesData.forEach(record => {
|
||||
// let { month, product, amount } = record;
|
||||
// let currentMonth=new Date(month)
|
||||
// let monthKey1 = currentMonth.getFullYear() + '-' + (currentMonth.getMonth() + 1);
|
||||
// if (!counts[monthKey1]) {
|
||||
// counts[monthKey1] = {};
|
||||
// }
|
||||
// if ( !counts[monthKey1][product])
|
||||
// counts[monthKey1][product] = amount;
|
||||
// else
|
||||
// counts[monthKey1][product] += amount;
|
||||
// });
|
||||
|
||||
// // 现在 counts 对象包含了每个月份每种产品的销售额信息
|
||||
|
||||
// const products = this.selectedColumnData;
|
||||
// let years = Array.from(new Set(salesData.map(record => new Date(record.month).getFullYear()+ '-' + (new Date(record.month).getMonth() + 1)))).sort();
|
||||
|
||||
// // Create the structure similar to 'source'
|
||||
// let result = [['product', ...years]];
|
||||
|
||||
// products.forEach(product => {
|
||||
// let rowData = [product];
|
||||
// for (let i = 0; i < years.length; i++) {
|
||||
// rowData.push(0);
|
||||
// }
|
||||
// result.push(rowData);
|
||||
// });
|
||||
// products.forEach(product=>
|
||||
// {
|
||||
// years.forEach(year => {
|
||||
// if (counts[year][product])
|
||||
// result[products.indexOf(product)+1][years.indexOf(year)+1]+=counts[year][product];
|
||||
// else
|
||||
// result[products.indexOf(product)+1][years.indexOf(year)+1]+=0;
|
||||
// });
|
||||
// }
|
||||
// )
|
||||
// // console.log(result)
|
||||
// return result;
|
||||
// },
|
||||
countsumbystring() {
|
||||
// 创建一个对象来存储每个名字对应的实数总和
|
||||
this.hasUpperContent = true;
|
||||
|
@ -308,6 +429,8 @@ export default {
|
|||
foundLabel = this.mycolumns[num-1].label;
|
||||
selectname.push(foundLabel)
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -1533,17 +1656,18 @@ currentDate.setDate(currentDate.getDate()+1);
|
|||
border-radius: 2%;
|
||||
padding: 20px;
|
||||
height: 100%;
|
||||
width: 28%;
|
||||
}
|
||||
|
||||
.right-grid {
|
||||
background-color: #dcdcdc;
|
||||
background-color: #e9d7df;
|
||||
border-radius: 2%;
|
||||
padding: 20px;
|
||||
height: 100%;
|
||||
width: 72%;
|
||||
border-color: aquamarine;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.chart-container {
|
||||
width: 90%;
|
||||
height: 90%;
|
||||
|
@ -1582,7 +1706,7 @@ currentDate.setDate(currentDate.getDate()+1);
|
|||
|
||||
.containerHead{
|
||||
padding:0;
|
||||
height:6%;
|
||||
height:8%;
|
||||
padding :0;
|
||||
width: 100%;
|
||||
display:flex;
|
||||
|
@ -1598,19 +1722,5 @@ currentDate.setDate(currentDate.getDate()+1);
|
|||
width: 3%;
|
||||
font-weight: 25px;
|
||||
}
|
||||
.el-button{
|
||||
background-color: transparent;
|
||||
margin:2;
|
||||
padding:2;
|
||||
border: 0;
|
||||
color: #0e5858;
|
||||
font-size: 24px;
|
||||
}
|
||||
.el-button:hover{
|
||||
background-color: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
#containerMain{
|
||||
background-color: #f5f6fa;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<div style="background-color: #fff; height: 100vh;">
|
||||
<el-container style="height: 100%; display: flex; flex-direction: column;">
|
||||
<el-header class="withrawHeader" style = "height: 6%;">
|
||||
<HeaderPage :pageTitle = 'pageTitle'></HeaderPage>
|
||||
<el-header class="withrawHeader">
|
||||
<h1 class="headerText">回收站</h1>
|
||||
</el-header>
|
||||
<el-main class = 'bg-red-400' style="flex: 1; overflow: auto; background-color: #f5f6fa">
|
||||
<el-main style="flex: 1; overflow: auto;">
|
||||
<!-- 工具栏 -->
|
||||
<el-header class="toolbar" style="padding: 10px;">
|
||||
<el-tooltip class="withdrawToolTip" content="撤销对选中线索的删除">
|
||||
|
@ -55,11 +55,11 @@
|
|||
|
||||
<script>
|
||||
import axios from 'axios';
|
||||
import HeaderPage from "@/components/HeaderPage.vue"
|
||||
// import HeaderPage from "@/components/HeaderPage.vue"
|
||||
|
||||
export default {
|
||||
components:{
|
||||
HeaderPage
|
||||
// HeaderPage
|
||||
},
|
||||
data() {
|
||||
const clueId = this.$route.params.id;
|
||||
|
@ -97,7 +97,7 @@ export default {
|
|||
{
|
||||
return
|
||||
}
|
||||
this.tableData = res.data; // 这里要注意,最后一个data需要和后端返回的键名对应
|
||||
this.tableData = res.data.data; // 这里要注意,最后一个data需要和后端返回的键名对应
|
||||
})
|
||||
.catch(error => {
|
||||
this.$handleNetError(error); // 处理网络错误
|
||||
|
@ -147,8 +147,8 @@ export default {
|
|||
},
|
||||
// 删除单条线索
|
||||
deleteClue(row){
|
||||
if (row.type == "删除表"){ // 如果是删除表
|
||||
this.$axios.post('http://localhost:8000/deleteTable/',{table_id:row.table_id}).then(response=>{
|
||||
if (row.type == 0){ // 如果是删除表
|
||||
this.$axios.post('http:localhosat:8000/deleteTable/',{table_id:row.table_id}).then(response=>{
|
||||
if(response.data.message == '删除成功'){
|
||||
// 弹窗提示
|
||||
this.$message({
|
||||
|
@ -162,8 +162,8 @@ export default {
|
|||
.catch(error=>{
|
||||
this.$handleNetError(error);
|
||||
})
|
||||
}else if(row.type == "删除线索"){ // 如果是删除线索
|
||||
this.$axios.post('http://localhost:8000/deleteSelected/',{table_id:row.table_id, clue_id:row.clue_id}).then(response=>{
|
||||
}else if(row.type == 1){ // 如果是删除线索
|
||||
this.$axios.post('http:localhosat:8000/deleteSelected/',{table_id:row.table_id, clue_id:row.clue_id}).then(response=>{
|
||||
if(response.data.message == '删除成功'){
|
||||
// 弹窗提示
|
||||
this.$message({
|
||||
|
@ -185,7 +185,7 @@ export default {
|
|||
}
|
||||
},
|
||||
// 删除选中的线索
|
||||
async deleteSelected(){
|
||||
deleteSelected(){
|
||||
// 如果没有选择数据,抛出警告
|
||||
if(this.deleteClues.length == 0){
|
||||
this.$message({
|
||||
|
@ -202,45 +202,54 @@ export default {
|
|||
clue_id: row?.clue_id ?? null, // 如果没有clue_id,设为null
|
||||
}));
|
||||
|
||||
let flag = true;
|
||||
|
||||
try{
|
||||
// 循环发送删除请求
|
||||
for(let i = 0; i < deleteItems.length; i++){
|
||||
if(deleteItems[i].type == "删除表"){ // 如果是删除表
|
||||
let response = await this.$axios.post('http://localhost:8000/deleteTable/',{table_id: deleteItems[i].table_id})
|
||||
if(response.data.message == '删除失败'){
|
||||
if(deleteItems[i].type == 0){ // 如果是删除表
|
||||
this.axios.post('http://localhost:8000/deleteTable',{table_id: deleteItems[i].table_id}).then(response=>{
|
||||
if(response.data.message == '删除成功'){
|
||||
// 弹窗提示
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功'
|
||||
});
|
||||
}else{
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '删除失败'
|
||||
});
|
||||
return;
|
||||
}
|
||||
}else if(deleteItems[i].type == "删除线索"){ // 如果是删除线索
|
||||
let response = await this.$axios.post('http://localhost:8000/deleteSelected/',{table_id:deleteItems[i].table_id, clue_id:deleteItems[i].clue_id})
|
||||
if(response.data.message == '删除失败'){
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '删除失败'
|
||||
});
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
}catch (error){
|
||||
flag = false;
|
||||
})
|
||||
.catch(error=>{
|
||||
this.$handleNetError(error);
|
||||
})
|
||||
}else if(deleteItems[i].type == 1){ // 如果是删除线索
|
||||
this.$axios.post('http://localhost:8000/deleteSelected/',
|
||||
{table_id:deleteItems[i].table_id, clue_id:deleteItems[i].clue_id}).then(response=>{
|
||||
if(response.data.message == '删除成功'){
|
||||
// 弹窗提示
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功'
|
||||
});
|
||||
}else{
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '删除失败'
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch(error=>{
|
||||
this.$handleNetError(error); // 处理网络错误
|
||||
return;
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
if(flag){
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功,即将刷新界面'
|
||||
});
|
||||
// 撤销成功后,更新表格数据
|
||||
location.reload();
|
||||
}
|
||||
|
||||
},
|
||||
refreshData(){
|
||||
location.reload();
|
||||
|
@ -248,15 +257,7 @@ export default {
|
|||
},
|
||||
mounted() {
|
||||
this.getDelete(); // 在组件挂载后调用获取数据的方法
|
||||
},
|
||||
watch: {
|
||||
tableData(newv,oldv){
|
||||
for(let i of newv){
|
||||
if(i.type == 0) i.type = "删除表";
|
||||
else i.type = "删除线索"
|
||||
}
|
||||
}
|
||||
},
|
||||
//刷新
|
||||
|
||||
};
|
||||
|
@ -294,13 +295,4 @@ export default {
|
|||
background-color: white;
|
||||
align-items: center;
|
||||
}
|
||||
.withdrawHeader{
|
||||
height:6%;
|
||||
padding :0;
|
||||
width: 100%;
|
||||
display:flex;
|
||||
justify-content: space-between;
|
||||
background-color: white;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -6,25 +6,77 @@
|
|||
</HeaderPage>
|
||||
</el-header>
|
||||
<el-main style="padding:0; height:94%; display: flex; width:100%;" >
|
||||
<el-container id = "container_Statistics" class ='flex justify-center p-2 '>
|
||||
<div class="stats stats-vertical shadow bg-white text-gray-900 w-full">
|
||||
<div class="stat w-full">
|
||||
<el-container id = "container_Statistics">
|
||||
<el-header class = 'flex justify-center h-1/5 pt-3'>
|
||||
<div class="stats stats-vertical lg:stats-horizontal shadow bg-white text-gray-900">
|
||||
<div class="stat">
|
||||
<div class="stat-title text-gray-700">已导入的线索库数量</div>
|
||||
<div class="stat-value">{{cluesTableAmount}}</div>
|
||||
<div class="stat-value">31K</div>
|
||||
<div class="stat-desc">文件导入/已经存储的线索库</div>
|
||||
</div>
|
||||
<div class="stat">
|
||||
<div class="stat-title text-gray-700">总线索数</div>
|
||||
<div class="stat-value">{{ cluesAmount }}</div>
|
||||
<div class="stat-value">4,200</div>
|
||||
<div class="stat-desc">文件导入/已经储存的线索数</div>
|
||||
</div>
|
||||
|
||||
<div class="stat">
|
||||
<div class="stat-title text-gray-700">回收站记录数量</div>
|
||||
<div class="stat-value">{{withdrawLogsAmount}}</div>
|
||||
<div class="stat-value">1,200</div>
|
||||
<div class="stat-desc">删除的记录(批量/单条)</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-header>
|
||||
<div class="hero bg-white-200 min-h-screen">
|
||||
<div class="hero-content text-center">
|
||||
<div class="max-w-md">
|
||||
<h1 class="text-5xl font-bold">你好,欢迎来到线索库管理系统</h1>
|
||||
<p class="py-6">
|
||||
提供直观的线索库管理工具
|
||||
</p>
|
||||
<button class="btn btn-primary">Get Started</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <el-main>
|
||||
<div class="carousel rounded-box">
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="https://img.daisyui.com/images/stock/photo-1559703248-dcaaec9fab78.jpg"
|
||||
alt="Burger" />
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="https://img.daisyui.com/images/stock/photo-1565098772267-60af42b81ef2.jpg"
|
||||
alt="Burger" />
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="https://img.daisyui.com/images/stock/photo-1572635148818-ef6fd45eb394.jpg"
|
||||
alt="Burger" />
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="https://img.daisyui.com/images/stock/photo-1494253109108-2e30c049369b.jpg"
|
||||
alt="Burger" />
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="https://img.daisyui.com/images/stock/photo-1550258987-190a2d41a8ba.jpg"
|
||||
alt="Burger" />
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="https://img.daisyui.com/images/stock/photo-1559181567-c3190ca9959b.jpg"
|
||||
alt="Burger" />
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="https://img.daisyui.com/images/stock/photo-1601004890684-d8cbf643f5f2.jpg"
|
||||
alt="Burger" />
|
||||
</div>
|
||||
</div>
|
||||
</el-main> -->
|
||||
</el-container>
|
||||
<el-container id = "container_Tools_Main" class ='shadow-lg'>
|
||||
<!--这是主体的头栏用于防止工具等-->
|
||||
|
@ -102,28 +154,9 @@ export default{
|
|||
fileName:'',
|
||||
isFileUploaded:false,
|
||||
cardsPerRow: 3, // 控制每行显示的卡片数量,默认为3
|
||||
cluesTableAmount: 0,
|
||||
cluesAmount: 0,
|
||||
withdrawLogsAmount: 0,
|
||||
statistics: '',
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
getStatistics(){
|
||||
this.$axios.get('http://localhost:8000/showStatistics/').then(res=>{
|
||||
if(res.data.message=="null")
|
||||
{
|
||||
return
|
||||
}
|
||||
this.statistics = res.data;
|
||||
this.cluesTableAmount = this.statistics.all_table;
|
||||
this.cluesAmount = this.statistics.all_clues;
|
||||
this.withdrawLogsAmount = this.statistics.all_del_records;
|
||||
})
|
||||
.catch(error=>{
|
||||
this.$handleNetError(error);
|
||||
});
|
||||
},
|
||||
openDialog(){
|
||||
this.dialogVisible = true;
|
||||
},
|
||||
|
@ -166,9 +199,6 @@ export default{
|
|||
this.dialogVisible1 = false//关闭对话框
|
||||
})
|
||||
}
|
||||
},
|
||||
beforeMount(){
|
||||
this.getStatistics();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
@ -198,7 +228,7 @@ export default{
|
|||
}
|
||||
/* 工具栏和主体样式 */
|
||||
#container_Tools_Main{
|
||||
width: 90%;
|
||||
width: 50%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
height:100%;
|
||||
|
@ -216,6 +246,6 @@ export default{
|
|||
}
|
||||
#container_Statistics{
|
||||
background-color: #f5f6fa;
|
||||
width:20%;;
|
||||
width:50%;
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue