提交 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) {
}, },
}, },
......
...@@ -44,13 +44,14 @@ ...@@ -44,13 +44,14 @@
</el-form-item> </el-form-item>
<el-form-item style="margin-left: 100px;"> <el-form-item style="margin-left: 100px;">
<el-button type="primary" @click="showAddConditionModal">添加筛选条件</el-button> <el-button type="primary" @click="showAddConditionModal" v-if="testDataList && testDataList.columnList && testDataList.columnList.length > 0">添加筛选条件</el-button>
<el-button type="primary" @click="handleSend">分发</el-button> <el-button type="primary" @click="handleSend" v-if="showSendBtn">分发</el-button>
<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>
<el-table <el-table
v-if="testDataList && testDataList.outModels && testDataList.outModels.length > 0"
ref="multipleTable" ref="multipleTable"
:data="testDataList.outModels" :data="testDataList.outModels"
border border
...@@ -70,7 +71,7 @@ ...@@ -70,7 +71,7 @@
<el-table-column fixed="right" align="center" label="操作" width="200"> <el-table-column fixed="right" align="center" label="操作" width="200">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button @click="handleRemarkClick(scope.row)" type="text" size="small">备注</el-button> <el-button @click="handleRemarkClick(scope.row)" type="text" size="small">备注</el-button>
<el-button type="text" size="small">标记处理</el-button> <el-button @click="handleTagClick(scope.row)" type="text" size="small">标记处理</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -111,12 +112,12 @@ ...@@ -111,12 +112,12 @@
<span>被选中的需要分发的数据,此处只显示Column1</span> <span>被选中的需要分发的数据,此处只显示Column1</span>
<div class="people-choose"> <div class="people-choose">
<p class="title">人员选择</p> <p class="title">人员选择</p>
<el-select v-model="selectedPeople" placeholder="请选择" class="people-select-comp"> <el-select v-model="dataUserDiss" multiple collapse-tags placeholder="请选择" class="people-select-comp">
<el-option <el-option
v-for="item in peopleList" v-for="item in peopleList"
:key="item.value" :key="item.id"
:label="item.label" :label="item.name"
:value="item.value" :value="item.id"
></el-option> ></el-option>
</el-select> </el-select>
</div> </div>
...@@ -129,30 +130,19 @@ ...@@ -129,30 +130,19 @@
<!-- 备注 弹窗 --> <!-- 备注 弹窗 -->
<el-dialog <el-dialog
title="备注" title="备注"
@close="handleRemarkClose"
:close-on-click-modal="false" :close-on-click-modal="false"
class="remark-modal" class="remark-modal"
:visible.sync="remarkDialogVisible" :visible.sync="remarkDialogVisible"
width="500px" width="500px"
center center
> >
<el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="textarea"></el-input> <el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="newRemark"></el-input>
<el-button type="primary" class="remark-confirm-btn">确 定</el-button> <el-button type="primary" class="remark-confirm-btn" @click="confirmSendRemark">确 定</el-button>
<ul class="history-list"> <ul class="history-list">
<li> <li v-for="item in remarkHistory">
<p class="date">2019-11-09</p> <p class="date">{{ item.createdTime }}</p>
<p class="text">撇价格拉低价格SD卡解放路开始打发就群殴刚叫我去额炯炯拉开距离开发及 来看电视剧弗兰克离开家大师傅了看见爱上大概是打发埃里克国家考虑过</p> <p class="text">{{ item.remark }}</p>
</li>
<li>
<p class="date">2019-11-09</p>
<p class="text">撇价格拉低价格SD卡解放路开始打发就群殴刚叫我去额炯炯拉开距离开发及 来看电视剧弗兰克离开家大师傅了看见爱上大概是打发埃里克国家考虑过</p>
</li>
<li>
<p class="date">2019-11-09</p>
<p class="text">撇价格拉低价格SD卡解放路开始打发就群殴刚叫我去额炯炯拉开距离开发及 来看电视剧弗兰克离开家大师傅了看见爱上大概是打发埃里克国家考虑过</p>
</li>
<li>
<p class="date">2019-11-09</p>
<p class="text">撇价格拉低价格SD卡解放路开始打发就群殴刚叫我去额炯炯拉开距离开发及 来看电视剧弗兰克离开家大师傅了看见爱上大概是打发埃里克国家考虑过</p>
</li> </li>
</ul> </ul>
</el-dialog> </el-dialog>
...@@ -175,6 +165,8 @@ export default { ...@@ -175,6 +165,8 @@ export default {
} }
}; };
return { return {
showSendBtn: true, // 是否显示 分发按钮
remarkHistory: [], // 历史备注列表
ruleForm: { ruleForm: {
dingdingNumber: "", dingdingNumber: "",
dingdingDate: "", dingdingDate: "",
...@@ -190,53 +182,9 @@ export default { ...@@ -190,53 +182,9 @@ export default {
}, },
testDataList: { testDataList: {
outModels: [ 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, total: 2,
columnList: [ columnList: []
{
key: "column1",
value: "省"
},
{
key: "column2",
value: "市"
},
{
key: "column3",
value: "区县"
},
{
key: "column4",
value: "姓名"
},
{
key: "column5",
value: "手机"
}
]
}, },
addConditioDialogVisible: false, // 添加筛选条件 addConditioDialogVisible: false, // 添加筛选条件
...@@ -245,7 +193,7 @@ export default { ...@@ -245,7 +193,7 @@ export default {
applyDateList: [], applyDateList: [],
sheetsList: [], sheetsList: [],
sendDialogVisible: false, //分发弹窗 sendDialogVisible: false, //分发弹窗
selectedPeople: [], dataUserDiss: [],
peopleList: [ peopleList: [
{ {
value: "选项1", value: "选项1",
...@@ -258,7 +206,7 @@ export default { ...@@ -258,7 +206,7 @@ export default {
], ],
remarkDialogVisible: false, //备注弹窗 remarkDialogVisible: false, //备注弹窗
textarea: "", newRemark: "",
tableData: [ tableData: [
{ {
...@@ -387,10 +335,28 @@ export default { ...@@ -387,10 +335,28 @@ export default {
}).catch((error) => { }).catch((error) => {
vm.$message.error('网络出现点问题') vm.$message.error('网络出现点问题')
}) })
},
confirmSendRemark() { // 添加备注信息
// vm.currentRow
let data = {
dataUserContentId: vm.currentRow.dataUserContentId,
remark: vm.newRemark,
};
openLoading(this);
this.$axios.post(localStorage.getItem("lectureUrl") + '/sensitive/dataRemark', data )
.then((res) => {
closeLoading(this);
// debugger;
res = res.data;
if(res.code == '000000'){
vm.remarkDialogVisible = false;
}else{
vm.$message.error(res.message);
}
}).catch((error) => {
this.$message.error('网络出现点问题')
})
}, },
showAddConditionModal() { showAddConditionModal() {
...@@ -408,16 +374,18 @@ export default { ...@@ -408,16 +374,18 @@ export default {
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,
// pageSize: 15,
}; };
openLoading(this); openLoading(this);
this.$axios.post(localStorage.getItem("lectureUrl") + '/sensitive/dataSearch/searchUserDis', data ) this.$axios.post(localStorage.getItem("lectureUrl") + '/sensitive/dataSearch/searchUserDis', data )
.then((res) => { .then((res) => {
closeLoading(this); closeLoading(this);
debugger; debugger;
// if(res.data.code == '000000'){ res = res.data;
// } if(res.code == '000000'){
vm.peopleList = res.data;
}else{
vm.$message.error(res.message);
}
}).catch((error) => { }).catch((error) => {
this.$message.error('网络出现点问题') this.$message.error('网络出现点问题')
...@@ -427,15 +395,8 @@ export default { ...@@ -427,15 +395,8 @@ export default {
console.log(">>> 查询"); console.log(">>> 查询");
this.$refs[formName].validate(valid => { this.$refs[formName].validate(valid => {
if (valid) { if (valid) {
alert("submit!"); // alert("submit!");
// 如果添加了筛选条件,则将其合并到 查询接口的传参中
let stringData = JSON.stringify(vm.conditionForm);
if (stringData != "{}") {
let condition = JSON.parse(stringData);
for (let key in condition) {
vm.ruleForm[key] = condition[key];
};
}
// 请求查询接口 // 请求查询接口
let data = { let data = {
...@@ -445,16 +406,32 @@ export default { ...@@ -445,16 +406,32 @@ export default {
pageNo: 1, pageNo: 1,
pageSize: 15, pageSize: 15,
}; };
openLoading(this); // 如果添加了筛选条件,则将其合并到 查询接口的传参中
this.$axios.post(localStorage.getItem("lectureUrl") + '/sensitive/dataSearch/search', data ) let stringData = JSON.stringify(vm.conditionForm);
if (stringData != "{}") {
let condition = JSON.parse(stringData);
for (let key in condition) {
data[key] = condition[key];
};
}
openLoading(vm);
vm.$axios.post(localStorage.getItem("lectureUrl") + '/sensitive/dataSearch/search', data )
.then((res) => { .then((res) => {
closeLoading(this); closeLoading(vm);
debugger; debugger;
// if(res.data.code == '000000'){ res = res.data;
// } if(res.code == '000000'){
vm.testDataList = res.data;
if(res.dataRole && res.dataRole == 1){
vm.showSendBtn = true;
};
}else{
vm.$message.error(res.message);
}
}).catch((error) => { }).catch((error) => {
this.$message.error('网络出现点问题') vm.$message.error('网络出现点问题')
}) })
...@@ -470,9 +447,80 @@ export default { ...@@ -470,9 +447,80 @@ export default {
handleRemarkClick(row) { handleRemarkClick(row) {
console.log("handleRemarkClick: ", row); console.log("handleRemarkClick: ", row);
this.remarkDialogVisible = true; this.remarkDialogVisible = true;
vm.currentRow = row;
let params = {
dataUserContentId : row.dataUserContentId
};
openLoading(this);
this.$axios.get(localStorage.getItem("lectureUrl") + '/sensitive/dataRemark', { params } )
.then((res) => {
closeLoading(this);
debugger;
res = res.data;
if(res.code == "000000") {
vm.remarkHistory = res.data.remarks;
}else {
vm.$message.error(res.message);
}
}).catch((error) => {
vm.$message.error('网络出现点问题')
})
},
getRemarkHistory(row) {
},
handleTagClick(row) {
vm.currentRow = row;
let params = {
dataUserContentId : row.dataUserContentId
};
openLoading(this);
this.$axios.get(localStorage.getItem("lectureUrl") + '/sensitive/dataSearch/changeStatus', { params } )
.then((res) => {
closeLoading(this);
debugger;
res = res.data;
if(res.code == "000000") {
// vm.remarkHistory = res.data.remarks;
vm.submitForm('ruleForm');
}else {
vm.$message.error(res.message);
}
}).catch((error) => {
vm.$message.error('网络出现点问题')
})
},
handleRemarkClose() {
vm.newRemark = '';
vm.remarkHistory = [];
}, },
handleConfirmSend() { handleConfirmSend() {
console.log("确定分发>>>>"); console.log("确定分发>>>>");
let selectListIds = [];
vm.multipleSelection.map(function(value, index, arr){
selectListIds.push(value.contentId)
})
let data = {
dataUserDiss: vm.dataUserDiss,
dataCountIds: selectListIds,
dataInfoId: 0,
};
openLoading(this);
this.$axios.post(localStorage.getItem("lectureUrl") + '/sensitive/dataSearch/postUser', data )
.then((res) => {
closeLoading(this);
debugger;
res = res.data;
if(res.code == '000000'){
vm.sendDialogVisible = false;
}else{
vm.$message.error(res.message);
}
}).catch((error) => {
this.$message.error('网络出现点问题')
})
} }
} }
}; };
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册