|
|
<template>
|
|
|
<div>
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="4">
|
|
|
<el-input size="medium" v-model="query.opter" placeholder="请输入账号"></el-input>
|
|
|
</el-col>
|
|
|
<el-col :span="2">
|
|
|
<el-button size="medium" type="primary" plain @click="getList">查询</el-button>
|
|
|
</el-col>
|
|
|
<el-col :span="2">
|
|
|
<el-button size="medium" type="primary" @click="addForm">新增</el-button>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row :gutter="20">
|
|
|
<el-col>
|
|
|
<el-table
|
|
|
:data="tableData"
|
|
|
border
|
|
|
style="width: 80%">
|
|
|
<el-table-column
|
|
|
fixed
|
|
|
prop="id"
|
|
|
label="id"
|
|
|
width="150">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
prop="opter"
|
|
|
label="账号"
|
|
|
width="200">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
prop="receaddr"
|
|
|
label="收报地址"
|
|
|
width="300">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
prop="createtime"
|
|
|
label="创建时间"
|
|
|
width="150">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
fixed="right"
|
|
|
label="操作"
|
|
|
width="100">
|
|
|
<template slot-scope="scope">
|
|
|
<el-button
|
|
|
@click.native.prevent="ediForm(scope.row)"
|
|
|
type="text"
|
|
|
style="color: #5BB75B"
|
|
|
size="small">
|
|
|
更新
|
|
|
</el-button>
|
|
|
<el-button
|
|
|
@click.native.prevent="deleteRow(scope.row.id)"
|
|
|
type="text"
|
|
|
style="color: #5BB75B"
|
|
|
size="small">
|
|
|
移除
|
|
|
</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="10">
|
|
|
<div class="block">
|
|
|
<el-pagination
|
|
|
@size-change="handleSizeChange"
|
|
|
@current-change="handleCurrentChange"
|
|
|
:current-page="query.pageNum"
|
|
|
:page-sizes="[10, 20, 30, 40]"
|
|
|
:page-size="query.pageSize"
|
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
|
:total="total">
|
|
|
</el-pagination>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row>
|
|
|
<el-dialog :title="'客户信息'+textMap[dialogStatus]" :visible.sync="dialogFormVisible">
|
|
|
<el-form :model="form" ref="form" :rules="rules">
|
|
|
<el-form-item label="账号" prop="opter">
|
|
|
<el-input size="medium" v-model="form.opter" autocomplete="off"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="电报地址" prop="receaddr">
|
|
|
<el-input size="medium" v-model="form.receaddr" autocomplete="off"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="" :label-width="formLabelWidth">
|
|
|
<el-button size="medium" @click="dialogFormVisible = false">取 消</el-button>
|
|
|
<el-button size="medium" type="primary" @click="dialogStatus==='create'?addsubmitForm('form'):edisubmitForm('form')">保存</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</el-dialog>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import {
|
|
|
addTeleAddr,
|
|
|
delTeleAddr,
|
|
|
ediTeleAddr,
|
|
|
selectLists
|
|
|
} from '../../api/remote_interface/byont_import';
|
|
|
export default {
|
|
|
data(){
|
|
|
return{
|
|
|
rules: {
|
|
|
opter: [
|
|
|
{ required: true, message: '请输入客户编码', trigger: 'blur' },
|
|
|
],
|
|
|
receaddr: [
|
|
|
{ required: true, message: '请输入电报地址', trigger: 'blur' },
|
|
|
]},
|
|
|
dialogStatus: '',
|
|
|
textMap: {
|
|
|
update: '更新',
|
|
|
create: '新增'
|
|
|
},
|
|
|
query:{
|
|
|
opter:'',
|
|
|
pageNum:0,
|
|
|
pageSize:10
|
|
|
},
|
|
|
tableData: [],
|
|
|
total:0,
|
|
|
dialogFormVisible:false,
|
|
|
form: {
|
|
|
id:'',
|
|
|
opter:'',
|
|
|
receaddr:'',
|
|
|
createtime:''
|
|
|
},
|
|
|
formLabelWidth: '120px'
|
|
|
}
|
|
|
},
|
|
|
methods:{
|
|
|
addForm(){
|
|
|
this.dialogFormVisible = true;
|
|
|
this.dialogStatus = 'create';
|
|
|
},
|
|
|
ediForm(row){
|
|
|
this.dialogFormVisible = true;
|
|
|
this.dialogStatus = 'update';
|
|
|
this.form=row;
|
|
|
},
|
|
|
addsubmitForm(formName) {
|
|
|
this.$refs[formName].validate((valid) => {
|
|
|
if (valid) {
|
|
|
this.form.id='';
|
|
|
addTeleAddr(this.form).then((response) => {
|
|
|
const res = response.data
|
|
|
if (res.code !== '200') {
|
|
|
return this.$message.error('电报地址添加,失败!')
|
|
|
}
|
|
|
this.$message.success('电报地址添加,成功!')
|
|
|
this.dialogFormVisible = false;
|
|
|
this.getList();
|
|
|
}).catch(error => {
|
|
|
// 关闭加载
|
|
|
this.$message.warning('电报地址添加,失败!')
|
|
|
})
|
|
|
} else {
|
|
|
console.log('error submit!!');
|
|
|
return false;
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
edisubmitForm(formName){
|
|
|
this.$refs[formName].validate((valid) => {
|
|
|
if (valid) {
|
|
|
ediTeleAddr(this.form).then((response) => {
|
|
|
const res = response.data
|
|
|
if (res.code !== '200') {
|
|
|
return this.$message.error('电报地址更新,失败!')
|
|
|
}
|
|
|
this.$message.success('电报地址更新,成功!')
|
|
|
this.dialogFormVisible = false;
|
|
|
this.getList();
|
|
|
}).catch(error => {
|
|
|
// 关闭加载
|
|
|
this.$message.warning('电报地址更新,失败!')
|
|
|
})
|
|
|
} else {
|
|
|
console.log('error submit!!');
|
|
|
return false;
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
deleteRow(id){
|
|
|
this.$confirm('此操作永久删除该消息收发记录, 是否继续?', '警告', {
|
|
|
confirmButtonText: '确定删除',
|
|
|
cancelButtonText: '取消',
|
|
|
type: 'warning'
|
|
|
}
|
|
|
).then(() => {
|
|
|
delTeleAddr({id: id}).then((response) => {
|
|
|
const res = response.data
|
|
|
this.$message.success(res.msg)
|
|
|
this.getList()
|
|
|
}).catch(error => {
|
|
|
this.$message.error('删除电报地址,失败!')
|
|
|
})
|
|
|
}).catch(() => {
|
|
|
})
|
|
|
},
|
|
|
handleSizeChange(val) {
|
|
|
this.query.pageSize=val;
|
|
|
this.getList();
|
|
|
},
|
|
|
handleCurrentChange(val) {
|
|
|
this.query.pageNum = val;
|
|
|
this.getList();
|
|
|
},
|
|
|
getList(){
|
|
|
selectLists(this.query).then((response) => {
|
|
|
const res = response.data
|
|
|
if (res.code !== '200') {
|
|
|
return this.$message.error('获取消息收发记录,失败!')
|
|
|
}
|
|
|
// 获取列表数据
|
|
|
this.tableData = res.data.list
|
|
|
// 获取列表的总记录数
|
|
|
this.total = res.data.total
|
|
|
this.$message.success('获取消息收发记录,成功!')
|
|
|
}).catch(error => {
|
|
|
// 关闭加载
|
|
|
this.$message.error(error.toString())
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
this.getList();
|
|
|
}
|
|
|
}
|
|
|
</script> |
...
|
...
|
|