提交 998ae927 编写于 作者: chengxiang.li's avatar chengxiang.li

update data-view page

上级 79e31cda
<template> <template>
<div class="data-view-message-wrap" > <div class="data-view-message-wrap" >
<el-row class="button-wrap"> <template v-if="testDataList && testDataList.outModels && testDataList.outModels.length > 0">
<el-button class="each-button" type="primary" @click="showAddConditionModal(true)">添加筛选条件</el-button> <el-row class="button-wrap">
<el-button class="each-button" type="primary" @click="hadnleSearch">查询</el-button> <el-button class="each-button" type="primary" @click="hadnleSearch">查询</el-button>
</el-row> <el-button class="each-button" type="primary" @click="showAddConditionModal(true)">添加筛选条件</el-button>
<el-table </el-row>
:data="tableData" <el-table
height="100%" :data="testDataList.outModels"
border height="100%"
style="width: 100%"> border
<el-table-column style="width: 100%">
prop="date" <template
align="center" v-if="testDataList && testDataList.columnList"
label="日期" v-for="item in testDataList.columnList"
> >
</el-table-column> <el-table-column :prop="item.key" align="center" :label="item.value" show-overflow-tooltip></el-table-column>
<el-table-column
prop="name"
align="center"
label="姓名"
>
</el-table-column>
<el-table-column
prop="province"
align="center"
label="省份"
>
</el-table-column>
<el-table-column
prop="city"
align="center"
label="市区"
>
</el-table-column>
<el-table-column
prop="address"
align="center"
label="地址"
>
</el-table-column>
<el-table-column
prop="zip"
align="center"
label="邮编"
>
</el-table-column>
<el-table-column
align="center"
label="操作"
width="100">
<template slot-scope="scope">
<el-button @click="handleClick(scope.row)" type="text">查看</el-button>
<el-button type="text">编辑</el-button>
</template> </template>
</el-table-column>
</el-table> <el-table-column
align="center"
label="操作"
width="100">
<template slot-scope="scope">
<el-button @click="showRemarkModal(scope.row)" type="text">备注</el-button>
<el-button type="text">标记处理</el-button>
</template>
</el-table-column>
</el-table>
</template>
<!-- 验证弹窗 --> <!-- 验证弹窗 -->
<el-dialog <el-dialog
...@@ -156,128 +129,10 @@ ...@@ -156,128 +129,10 @@
captchaToken: '', // 图片验证码 token captchaToken: '', // 图片验证码 token
addConditioDialogVisible: false, // 添加筛选条件 addConditioDialogVisible: false, // 添加筛选条件
conditionForm : {}, conditionForm : {},
testDataList: { testDataList: {},
outModels: [
{
column1: "上海市",
column5: "123423",
column4: "张三",
column3: "浦东新区",
column2: "上海市",
contentId: 1,
userName: "张三,李四",
dataUserContentId: 1,
status: 2
},
{
column1: "河南省",
column5: "123424",
column4: "李四",
column3: "舞阳县",
column2: "漯河市",
contentId: 2,
userName: "张三",
dataUserContentId: 4,
status: 2
}
],
total: 2,
columnList: [
{
key: "column1",
value: "省"
},
{
key: "column2",
value: "市"
},
{
key: "column3",
value: "区县"
},
{
key: "column4",
value: "姓名"
},
{
key: "column5",
value: "手机"
}
]
},
centerDialogVisible: true, // 验证弹窗 centerDialogVisible: true, // 验证弹窗
tableData: [{ tableData: [],
date: '2016-05-02',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}, {
date: '2016-05-04',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1517 弄',
zip: 200333
}, {
date: '2016-05-01',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1519 弄',
zip: 200333
}, {
date: '2016-05-03',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1516 弄',
zip: 200333
}, {
date: '2016-05-03',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1516 弄',
zip: 200333
}, {
date: '2016-05-03',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1516 弄',
zip: 200333
}, {
date: '2016-05-03',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1516 弄',
zip: 200333
}, {
date: '2016-05-03',
name: '王小22',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1516 弄',
zip: 200333
}, {
date: '2016-05-03',
name: '王小虎333',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1516 弄',
zip: 200333
}, {
date: '2016-05-03',
name: '王小虎666',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1516 弄',
zip: 200333
}],
captchaCode: '', // 图形验证码 captchaCode: '', // 图形验证码
smsCode: '', // 短信验证码 smsCode: '', // 短信验证码
...@@ -348,10 +203,8 @@ ...@@ -348,10 +203,8 @@
// 倒计时过程中不可点 // 倒计时过程中不可点
if( this.countDownNum != 6){ if( this.countDownNum != 6){
console.log('现在倒计时过程中...不可点击') console.log('现在倒计时过程中...不可点击')
return; return;
} }
if( this.captchaCode == '' ){ if( this.captchaCode == '' ){
vm.$message.error('请输入图形验证码'); vm.$message.error('请输入图形验证码');
return; return;
...@@ -372,7 +225,7 @@ ...@@ -372,7 +225,7 @@
vm.timeCount(); vm.timeCount();
}else{ }else{
vm.$message.error(res.message); vm.$message.error(res.message);
this.getCaptcha(); vm.getCaptcha();
} }
}).catch((error) => { }).catch((error) => {
...@@ -417,24 +270,61 @@ ...@@ -417,24 +270,61 @@
debugger debugger
res = res.data; res = res.data;
if(res.code == '000000'){ if(res.code == '000000'){
// vm.timeCount();
vm.getTableList(); vm.getTableList();
}else{ }else{
vm.$message.error(res.message); vm.$message.error(res.message);
vm.getCaptcha();
vm.captchaCode = '';
} }
}).catch((error) => { }).catch((error) => {
this.$message.error('网络出现点问题') this.$message.error('网络出现点问题')
}) })
}, },
getTableList() { getTableList(isManualClick) {
debugger;
let data = {
parame: vm.afterParam,
pageNo: 1,
pageSize: 15,
};
if( isManualClick ){
// 如果添加了筛选条件,则将其合并到 查询接口的传参中
let stringData = JSON.stringify(vm.conditionForm);
if (stringData != "{}") {
let condition = JSON.parse(stringData);
for (let key in condition) {
data[key] = condition[key];
};
}
}
openLoading(this);
this.$axios.post(localStorage.getItem("lectureUrl") + '/sensitive/dataSearch/searchWeb', data )
.then((res) => {
closeLoading(this);
res = res.data;
if(res.code == '000000'){
vm.centerDialogVisible = false;
vm.captchaCode = '';
vm.smsCode = '';
vm.testDataList = res.data;
}else{
vm.$message.error(res.message);
}
}).catch((error) => {
this.$message.error('网络出现点问题')
})
}, },
showAddConditionModal(status){ showAddConditionModal(status){
this.addConditioDialogVisible = status ? true : false; this.addConditioDialogVisible = status ? true : false;
}, },
hadnleSearch() { hadnleSearch() {
console.log('查询。。。') console.log('查询。。。')
vm.getTableList(true);
},
showRemarkModal(row) {
}, },
}, },
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册