Skip to content

P
pica-sensitive-admin
提交 6efb9ba1 编写于 作者: chengxiang.li's avatar chengxiang.li
浏览文件
操作

update data-view and data-view-message page

上级 fdd5e7da
隐藏空白字符变更
内嵌 并排
正在显示 包含 199 行增加 和 92 行删除
src/views/sensitive-control/data-view-message.vue
浏览文件 @ 6efb9ba1
<template> <template>
<div class="data-view-message-wrap" > <div class="data-view-message-wrap" >
<template v-if="testDataList && testDataList.outModels && testDataList.outModels.length > 0"> <template v-if="searchTableVisible">
<el-row class="button-wrap"> <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-button class="each-button" type="primary" @click="showAddConditionModal(true)">添加筛选条件</el-button> <el-button class="each-button" type="primary" @click="showAddConditionModal(true)">添加筛选条件</el-button>
</el-row> </el-row>
<el-table <template v-if="tableDataList && tableDataList.outModels && tableDataList.outModels.length > 0">
:data="testDataList.outModels" <el-table
height="100%" :data="tableDataList.outModels"
border height="100%"
style="width: 100%"> border
<template style="width: 100%">
v-if="testDataList && testDataList.columnList" <template
v-for="item in testDataList.columnList" v-if="tableDataList && tableDataList.columnList"
> v-for="item in tableDataList.columnList"
<el-table-column :prop="item.key" align="center" :label="item.value" show-overflow-tooltip></el-table-column> >
</template> <el-table-column :prop="item.key" align="center" :label="item.value" show-overflow-tooltip></el-table-column>
<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> </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" size="small">备注</el-button>
<!-- <el-button type="text">标记处理</el-button> -->
<el-button @click="handleTagClick(scope.row)" type="text" size="small" :disabled="scope.row.status == 1">{{ scope.row.status == 1 ? '已处理' : '标记处理' }}</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<el-pagination
class="pagination-style"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="tableDataList.total"
:current-page="pageNo"
:page-sizes="[15, 30, 50, 100]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</template>
<div class="no-table-data" v-else>
暂无数据
</div>
</template> </template>
<!-- 验证弹窗 --> <!-- 验证弹窗 -->
...@@ -63,14 +80,14 @@ ...@@ -63,14 +80,14 @@
width="300px" width="300px"
center> center>
<el-form ref="form" :model="conditionForm" label-width="80px"> <el-form ref="form" :model="conditionForm" label-width="80px">
<template v-if="testDataList && testDataList.columnList" v-for="item in testDataList.columnList"> <template v-if="tableDataList && tableDataList.columnList" v-for="item in tableDataList.columnList">
<el-form-item :label="item.value" style="width:400px;"> <el-form-item :label="item.value" style="width:400px;">
<el-input v-model="conditionForm[item.key]" size="small" style="width: 150px;"></el-input> <el-input v-model="conditionForm[item.key]" size="small" style="width: 150px;"></el-input>
</el-form-item> </el-form-item>
</template> </template>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="addConditioDialogVisible = false">取 消</el-button> <el-button @click="handleClearCondition">清 空</el-button>
<el-button type="primary" @click="addConditioDialogVisible = false">确 定</el-button> <el-button type="primary" @click="addConditioDialogVisible = false">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
...@@ -125,12 +142,12 @@ ...@@ -125,12 +142,12 @@
if(params && params.length > 1){ if(params && params.length > 1){
vm.afterParam = params[1]; vm.afterParam = params[1];
console.log('afterParam: ', vm.afterParam) console.log('afterParam: ', vm.afterParam)
this.getPhoneNum(); vm.getPhoneNum();
}else{ }else{
alert('访问的网页地址无效！') alert('访问的网页地址无效！')
} }
// 获取图片验证码 // 获取图片验证码
this.getCaptcha(); vm.getCaptcha();
}, },
...@@ -139,7 +156,8 @@ ...@@ -139,7 +156,8 @@
}, },
data() { data() {
return { return {
remarkDialogVisible: false, //备注弹窗 searchTableVisible: false, // 弹窗下面的 搜索按钮及表格等 是否显示
remarkDialogVisible: false, // 备注弹窗
newRemark: "", newRemark: "",
remarkHistory: [], // 历史备注列表 remarkHistory: [], // 历史备注列表
...@@ -153,12 +171,14 @@ ...@@ -153,12 +171,14 @@
captchaToken: '', // 图片验证码 token captchaToken: '', // 图片验证码 token
addConditioDialogVisible: false, // 添加筛选条件 addConditioDialogVisible: false, // 添加筛选条件
conditionForm : {}, conditionForm : {},
testDataList: {}, tableDataList: {},
centerDialogVisible: true, // 验证弹窗 centerDialogVisible: true, // 验证弹窗
tableData: [], tableData: [],
captchaCode: '', // 图形验证码 captchaCode: '', // 图形验证码
smsCode: '', // 短信验证码 smsCode: '', // 短信验证码
pageNo: 1,
pageSize: 15,
} }
}, },
...@@ -194,6 +214,18 @@ ...@@ -194,6 +214,18 @@
// } // }
// }, // },
handleSizeChange(val) {
console.log('size change .......')
vm.pageSize = val;
vm.hadnleSearch();
},
handleCurrentChange(val) {
console.log('currentPage change .......')
vm.pageNo = val;
vm.hadnleSearch();
},
// 获取编号和手机号 // 获取编号和手机号
getPhoneNum() { getPhoneNum() {
// 请求查询接口 // 请求查询接口
...@@ -225,17 +257,17 @@ ...@@ -225,17 +257,17 @@
}, },
// 图片验证码点击 // 图片验证码点击
handleImgClick() { handleImgClick() {
this.getCaptcha(); vm.getCaptcha();
}, },
// 获取短信验证码 // 获取短信验证码
getSMSCode() { getSMSCode() {
// 倒计时过程中不可点 // 倒计时过程中不可点
if( this.countDownNum != 6){ if( vm.countDownNum != 6){
console.log('现在倒计时过程中...不可点击') console.log('现在倒计时过程中...不可点击')
return; return;
} }
if( this.captchaCode == '' ){ if( vm.captchaCode == '' ){
vm.$message.error('请输入图形验证码'); vm.$message.error('请输入图形验证码');
return; return;
} }
...@@ -282,7 +314,7 @@ ...@@ -282,7 +314,7 @@
} }
// 调用 /mobileCheck/check/mobilecode 接口 // 调用 /mobileCheck/check/mobilecode 接口
// 获取短信验证码 // 校验 短信验证码
let data = { let data = {
parame: vm.afterParam, parame: vm.afterParam,
mobileCode: vm.smsCode, mobileCode: vm.smsCode,
...@@ -290,6 +322,7 @@ ...@@ -290,6 +322,7 @@
let callback = (res) => { let callback = (res) => {
if(res.code == '000000'){ if(res.code == '000000'){
vm.searchTableVisible = true; // 短信验证码校验成功，显示背后的内容
vm.getTableList(); vm.getTableList();
}else{ }else{
vm.$message.error(res.message); vm.$message.error(res.message);
...@@ -302,6 +335,7 @@ ...@@ -302,6 +335,7 @@
getTableList(isManualClick) { getTableList(isManualClick) {
debugger; debugger;
let data = { let data = {
columnMap: {},
parame: vm.afterParam, parame: vm.afterParam,
pageNo: 1, pageNo: 1,
pageSize: 15, pageSize: 15,
...@@ -312,7 +346,7 @@ ...@@ -312,7 +346,7 @@
if (stringData != "{}") { if (stringData != "{}") {
let condition = JSON.parse(stringData); let condition = JSON.parse(stringData);
for (let key in condition) { for (let key in condition) {
data[key] = condition[key]; data.columnMap[key] = condition[key];
}; };
} }
} }
...@@ -322,8 +356,7 @@ ...@@ -322,8 +356,7 @@
vm.centerDialogVisible = false; vm.centerDialogVisible = false;
vm.captchaCode = ''; vm.captchaCode = '';
vm.smsCode = ''; vm.smsCode = '';
vm.tableDataList = res.data;
vm.testDataList = res.data;
}else{ }else{
vm.$message.error(res.message); vm.$message.error(res.message);
} }
...@@ -331,7 +364,11 @@ ...@@ -331,7 +364,11 @@
vm.sendRequest( 'post', `/sensitive/dataSearch/searchWeb`, data, callback ); vm.sendRequest( 'post', `/sensitive/dataSearch/searchWeb`, data, callback );
}, },
showAddConditionModal(status){ showAddConditionModal(status){
this.addConditioDialogVisible = status ? true : false; vm.addConditioDialogVisible = status ? true : false;
},
handleClearCondition() {
vm.conditionForm = {};
vm.addConditioDialogVisible = false;
}, },
hadnleSearch() { hadnleSearch() {
console.log('查询。。。') console.log('查询。。。')
...@@ -339,7 +376,7 @@ ...@@ -339,7 +376,7 @@
}, },
showRemarkModal(row) { showRemarkModal(row) {
// alert('未完待续。。。'); // alert('未完待续。。。');
this.remarkDialogVisible = true; vm.remarkDialogVisible = true;
vm.currentRow = row; vm.currentRow = row;
// 获取备注信息 // 获取备注信息
...@@ -352,16 +389,28 @@ ...@@ -352,16 +389,28 @@
}; };
vm.sendRequest( 'get', `/sensitive/dataRemark?dataUserContentId=${row.dataUserContentId}`, {}, callback ); vm.sendRequest( 'get', `/sensitive/dataRemark?dataUserContentId=${row.dataUserContentId}`, {}, callback );
}, },
// 标记处理点击
handleTagClick(row) {
vm.currentRow = row;
let callback = (res) => {
if(res.code == "000000") {
vm.hadnleSearch();
}else {
vm.$message.error(res.message);
}
}
vm.sendRequest( 'get', `/sensitive/dataSearch/changeStatus?dataUserContentId=${row.dataUserContentId}`, {}, callback );
},
sendRequest( type, url, params, callback ){ sendRequest( type, url, params, callback ){
openLoading(this); openLoading(vm);
url = localStorage.getItem("lectureUrl") + url; url = localStorage.getItem("lectureUrl") + url;
this.$axios[type](url, params ) vm.$axios[type](url, params )
.then((res) => { .then((res) => {
closeLoading(this); closeLoading(vm);
res = res.data; res = res.data;
callback(res); callback(res);
}).catch((error) => { }).catch((error) => {
this.$message.error('网络出现点问题') vm.$message.error('网络出现点问题')
}) })
}, },
...@@ -383,6 +432,14 @@ ...@@ -383,6 +432,14 @@
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
.no-table-data{
width: 100%;
height: 400px;
line-height: 400px;
text-align: center;
color: #606266;
font-size: 14px;
}
.button-wrap{ .button-wrap{
margin: 20px 0; margin: 20px 0;
.each-button{ .each-button{
......
src/views/sensitive-control/data-view.vue
浏览文件 @ 6efb9ba1
...@@ -49,30 +49,47 @@ ...@@ -49,30 +49,47 @@
<el-button type="primary" @click="submitForm('ruleForm')">查询</el-button> <el-button type="primary" @click="submitForm('ruleForm')">查询</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<template v-if="isSearchSend">
<el-table <el-table
v-if="testDataList && testDataList.outModels && testDataList.outModels.length > 0" v-if="tableDataList && tableDataList.outModels && tableDataList.outModels.length > 0"
ref="multipleTable" ref="multipleTable"
:data="testDataList.outModels" :data="tableDataList.outModels"
border border
tooltip-effect="dark" tooltip-effect="dark"
style="width: 100%" style="width: 100%"
@selection-change="handleSelectionChange" @selection-change="handleSelectionChange"
>
<el-table-column type="selection" align="center" width="55"></el-table-column>
<template
v-if="testDataList && testDataList.columnList"
v-for="item in testDataList.columnList"
> >
<el-table-column :prop="item.key" align="center" :label="item.value" show-overflow-tooltip></el-table-column> <el-table-column type="selection" align="center" width="55"></el-table-column>
</template> <template
<el-table-column fixed="right" align="center" label="操作" width="200"> v-if="tableDataList && tableDataList.columnList"
<template slot-scope="scope"> v-for="item in tableDataList.columnList"
<el-button @click="handleRemarkClick(scope.row)" type="text" size="small">备注</el-button> >
<el-button @click="handleTagClick(scope.row)" type="text" size="small" :disabled="scope.row.status == 1">{{ scope.row.status == 1 ? '已处理' : '标记处理' }}</el-button> <el-table-column :prop="item.key" align="center" :label="item.value" show-overflow-tooltip></el-table-column>
</template> </template>
</el-table-column> <el-table-column fixed="right" align="center" label="操作" width="200">
</el-table> <template slot-scope="scope">
<el-button @click="handleRemarkClick(scope.row)" type="text" size="small">备注</el-button>
<el-button @click="handleTagClick(scope.row)" type="text" size="small" :disabled="scope.row.status == 1">{{ scope.row.status == 1 ? '已处理' : '标记处理' }}</el-button>
</template>
</el-table-column>
</el-table>
<div class="no-table-data" v-else>
暂无数据
</div>
<!-- 分页 -->
<el-pagination
v-if="tableDataList && tableDataList.outModels && tableDataList.outModels.length > 0"
class="pagination-style"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="tableDataList.total"
:current-page="ruleForm.pageNo"
:page-sizes="[15, 30, 50, 100]"
:page-size="ruleForm.pageSize"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</template>
<!-- 添加筛选条件 弹窗 --> <!-- 添加筛选条件 弹窗 -->
<el-dialog <el-dialog
...@@ -85,8 +102,8 @@ ...@@ -85,8 +102,8 @@
> >
<el-form ref="form" :model="conditionForm" label-width="100px"> <el-form ref="form" :model="conditionForm" label-width="100px">
<template <template
v-if="testDataList && testDataList.columnList" v-if="tableDataList && tableDataList.columnList"
v-for="item in testDataList.columnList" v-for="item in tableDataList.columnList"
> >
<el-form-item :label="item.value" style="width:400px;"> <el-form-item :label="item.value" style="width:400px;">
<el-input v-model="conditionForm[item.key]" size="small"></el-input> <el-input v-model="conditionForm[item.key]" size="small"></el-input>
...@@ -164,12 +181,16 @@ export default { ...@@ -164,12 +181,16 @@ export default {
} }
}; };
return { return {
isSearchSend: false, // 是否有效查询过
showSendBtn: false, // 是否显示 分发按钮 showSendBtn: false, // 是否显示 分发按钮
remarkHistory: [], // 历史备注列表 remarkHistory: [], // 历史备注列表
ruleForm: { ruleForm: {
columnMap: {},
dingdingNumber: "", dingdingNumber: "",
dingdingDate: "", dingdingDate: "",
sheet: "" sheet: "",
pageNo: 1,
pageSize: 15,
}, },
rules: { rules: {
dingdingNumber: [ dingdingNumber: [
...@@ -180,7 +201,7 @@ export default { ...@@ -180,7 +201,7 @@ export default {
sheet: [{ required: true, message: "请选择sheet名", trigger: "change" }] sheet: [{ required: true, message: "请选择sheet名", trigger: "change" }]
}, },
testDataList: {}, tableDataList: {},
addConditioDialogVisible: false, // 添加筛选条件 addConditioDialogVisible: false, // 添加筛选条件
conditionForm: {}, conditionForm: {},
...@@ -200,28 +221,29 @@ export default { ...@@ -200,28 +221,29 @@ export default {
}, },
methods: { methods: {
sendRequest( type, url, params, callback ){ sendRequest( type, url, params, callback ){
openLoading(this); openLoading(vm);
url = localStorage.getItem("lectureUrl") + url; url = localStorage.getItem("lectureUrl") + url;
this.$axios[type](url, params ) vm.$axios[type](url, params )
.then((res) => { .then((res) => {
closeLoading(this); closeLoading(vm);
res = res.data; res = res.data;
callback(res); callback(res);
}).catch((error) => { }).catch((error) => {
this.$message.error('网络出现点问题') vm.$message.error('网络出现点问题')
}) })
}, },
handleClearCondition() { handleClearCondition() {
debugger;
vm.conditionForm = {}; vm.conditionForm = {};
vm.addConditioDialogVisible = false; vm.addConditioDialogVisible = false;
}, },
handleDingNumChange(val) { handleDingNumChange(val) {
if (val && val.length == 21) { if (val && val.length == 21) {
this.getApplyDateList(); vm.getApplyDateList();
} else if (val && val.length > 21) { } else if (val && val.length > 21) {
val = val.slice(0, 21); val = val.slice(0, 21);
this.ruleForm.dingdingNumber = val; vm.ruleForm.dingdingNumber = val;
} }
}, },
numInputLimit(e) { numInputLimit(e) {
...@@ -248,21 +270,21 @@ export default { ...@@ -248,21 +270,21 @@ export default {
vm.$message.error(res.message); vm.$message.error(res.message);
} }
} }
vm.sendRequest( 'get', `/sensitive/visit/date?dingdingNumber=${this.ruleForm.dingdingNumber}`, {}, callback ); vm.sendRequest( 'get', `/sensitive/visit/date?dingdingNumber=${vm.ruleForm.dingdingNumber}`, {}, callback );
}, },
handleApplyDateChange(val) { handleApplyDateChange(val) {
if (val) { if (val) {
this.getSheets(); vm.getSheets();
} }
}, },
handleDingNumClear() { handleDingNumClear() {
this.ruleForm.dingdingDate = ""; vm.ruleForm.dingdingDate = "";
this.applyDateList = []; vm.applyDateList = [];
this.handleApplyDateClear(); vm.handleApplyDateClear();
}, },
handleApplyDateClear() { handleApplyDateClear() {
this.ruleForm.sheet = ""; vm.ruleForm.sheet = "";
this.sheetsList = []; vm.sheetsList = [];
}, },
getSheets() { getSheets() {
// 获取 Sheets名 // 获取 Sheets名
...@@ -279,7 +301,7 @@ export default { ...@@ -279,7 +301,7 @@ export default {
vm.$message.error(res.message); vm.$message.error(res.message);
} }
} }
vm.sendRequest( 'get', `/sensitive/visit/sheet?dingdingNumber=${this.ruleForm.dingdingNumber}&dingdingDate=${this.ruleForm.dingdingDate}`, {}, callback ); vm.sendRequest( 'get', `/sensitive/visit/sheet?dingdingNumber=${vm.ruleForm.dingdingNumber}&dingdingDate=${vm.ruleForm.dingdingDate}`, {}, callback );
}, },
confirmSendRemark() { // 添加备注信息 confirmSendRemark() { // 添加备注信息
// vm.currentRow // vm.currentRow
...@@ -298,12 +320,12 @@ export default { ...@@ -298,12 +320,12 @@ export default {
vm.sendRequest( 'post', `/sensitive/dataRemark`, data, callback ); vm.sendRequest( 'post', `/sensitive/dataRemark`, data, callback );
}, },
showAddConditionModal() { showAddConditionModal() {
this.addConditioDialogVisible = true; vm.addConditioDialogVisible = true;
}, },
handleSend() { handleSend() {
console.log(">>> 分发"); console.log(">>> 分发");
this.sendDialogVisible = true; vm.sendDialogVisible = true;
this.getUserList(); vm.getUserList();
}, },
getUserList() { getUserList() {
// /dataSearch/searchUserDis // /dataSearch/searchUserDis
...@@ -325,17 +347,18 @@ export default { ...@@ -325,17 +347,18 @@ export default {
}, },
submitForm(formName) { submitForm(formName) {
console.log(">>> 查询"); console.log(">>> 查询");
this.$refs[formName].validate(valid => { vm.$refs[formName].validate(valid => {
if (valid) { if (valid) {
// alert("submit!"); // alert("submit!");
// 请求查询接口 // 请求查询接口
debugger;
let data = { let data = {
columnMap: {}, columnMap: vm.ruleForm.columnMap,
dingdingNum: vm.ruleForm.dingdingNumber, dingdingNum: vm.ruleForm.dingdingNumber,
dingdingDate: vm.ruleForm.dingdingDate, dingdingDate: vm.ruleForm.dingdingDate,
dataSheetName: vm.ruleForm.sheet, dataSheetName: vm.ruleForm.sheet,
pageNo: 1, pageNo: vm.ruleForm.pageNo,
pageSize: 15, pageSize: vm.ruleForm.pageSize,
}; };
// 如果添加了筛选条件，则将其合并到 查询接口的传参中 // 如果添加了筛选条件，则将其合并到 查询接口的传参中
let stringData = JSON.stringify(vm.conditionForm); let stringData = JSON.stringify(vm.conditionForm);
...@@ -348,7 +371,8 @@ export default { ...@@ -348,7 +371,8 @@ export default {
let callback = (res) => { let callback = (res) => {
if(res.code == '000000'){ if(res.code == '000000'){
vm.testDataList = res.data; vm.isSearchSend = true;
vm.tableDataList = res.data;
if(typeof res.data.dataRole != 'undefined' && res.data.dataRole == 1){ if(typeof res.data.dataRole != 'undefined' && res.data.dataRole == 1){
vm.showSendBtn = true; vm.showSendBtn = true;
}; };
...@@ -363,12 +387,24 @@ export default { ...@@ -363,12 +387,24 @@ export default {
} }
}); });
}, },
handleSizeChange(val) {
console.log('size change .......')
vm.ruleForm.pageSize = val;
vm.submitForm('ruleForm');
},
handleCurrentChange(val) {
console.log('currentPage change .......')
vm.ruleForm.pageNo = val;
vm.submitForm('ruleForm');
},
handleSelectionChange(val) { handleSelectionChange(val) {
this.multipleSelection = val; vm.multipleSelection = val;
}, },
handleRemarkClick(row) { handleRemarkClick(row) {
console.log("handleRemarkClick: ", row); console.log("handleRemarkClick: ", row);
this.remarkDialogVisible = true; vm.remarkDialogVisible = true;
vm.currentRow = row; vm.currentRow = row;
// 获取备注信息 // 获取备注信息
...@@ -406,7 +442,7 @@ export default { ...@@ -406,7 +442,7 @@ export default {
let data = { let data = {
dataUserDiss: vm.dataUserDiss, dataUserDiss: vm.dataUserDiss,
dataCountIds: selectListIds, dataCountIds: selectListIds,
dataInfoId: vm.testDataList.dataInfoId, dataInfoId: vm.tableDataList.dataInfoId,
}; };
let callback = (res) => { let callback = (res) => {
...@@ -493,5 +529,19 @@ export default { ...@@ -493,5 +529,19 @@ export default {
} }
} }
} }
.no-table-data{
width: 100%;
height: 400px;
line-height: 400px;
text-align: center;
color: #606266;
font-size: 14px;
}
.pagination-style{
margin-top: 30px;
float: right;
}
} }
</style> </style>
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或