feat(businessHanding): add filterable
This commit is contained in:
parent
433827060b
commit
b15fea10b5
|
@ -7,8 +7,8 @@
|
||||||
<el-col :span="4">
|
<el-col :span="4">
|
||||||
<el-form-item :label="'业务名称'" prop="type">
|
<el-form-item :label="'业务名称'" prop="type">
|
||||||
<el-autocomplete
|
<el-autocomplete
|
||||||
class="inline-input"
|
|
||||||
v-model="queryParams.typeName"
|
v-model="queryParams.typeName"
|
||||||
|
class="inline-input"
|
||||||
:fetch-suggestions="querySearch"
|
:fetch-suggestions="querySearch"
|
||||||
placeholder="请输入内容或选择"
|
placeholder="请输入内容或选择"
|
||||||
@select="handleSelect"
|
@select="handleSelect"
|
||||||
|
@ -21,11 +21,9 @@
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="4">
|
<el-col :span="4">
|
||||||
<el-button class="my_search" @click="getHandelWorkList()">
|
<el-button class="my_search" @click="getHandelWorkList()">
|
||||||
{{ '搜索' }}</el-button
|
{{ '搜索' }}</el-button>
|
||||||
>
|
|
||||||
<el-button class="my_reset" @click="reChongzhi">
|
<el-button class="my_reset" @click="reChongzhi">
|
||||||
{{ '重置' }}</el-button
|
{{ '重置' }}</el-button>
|
||||||
>
|
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
@ -36,14 +34,14 @@
|
||||||
<el-button class="thebtn1" @click="adddate()">{{
|
<el-button class="thebtn1" @click="adddate()">{{
|
||||||
'添加'
|
'添加'
|
||||||
}}</el-button>
|
}}</el-button>
|
||||||
<el-button @click="handleExport" class="thebtn2"> {{ '导出' }}</el-button>
|
<el-button class="thebtn2" @click="handleExport"> {{ '导出' }}</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="maintable">
|
<div class="maintable">
|
||||||
<el-table
|
<el-table
|
||||||
ref="table1"
|
ref="table1"
|
||||||
height="700px"
|
|
||||||
v-loading="loading"
|
v-loading="loading"
|
||||||
|
height="700px"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
:header-cell-style="{ background: '#EEEEEE' }"
|
:header-cell-style="{ background: '#EEEEEE' }"
|
||||||
:row-class-name="tableRowClassName"
|
:row-class-name="tableRowClassName"
|
||||||
|
@ -163,6 +161,7 @@
|
||||||
v-model="form.type"
|
v-model="form.type"
|
||||||
clearable
|
clearable
|
||||||
:placeholder="'请选择'"
|
:placeholder="'请选择'"
|
||||||
|
filterable
|
||||||
>
|
>
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in approbalBusinessList"
|
v-for="item in approbalBusinessList"
|
||||||
|
@ -238,7 +237,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import topBar from "@/components/topBar";
|
import topBar from '@/components/topBar'
|
||||||
import {
|
import {
|
||||||
getApprobalBusiness,
|
getApprobalBusiness,
|
||||||
getPubEnumsAccount,
|
getPubEnumsAccount,
|
||||||
|
@ -246,203 +245,203 @@ import {
|
||||||
deletHandelWork,
|
deletHandelWork,
|
||||||
getOneHandelWorkList,
|
getOneHandelWorkList,
|
||||||
saveHandleWork,
|
saveHandleWork,
|
||||||
updateHandleWork,
|
updateHandleWork
|
||||||
} from "@/api/businesshandling";
|
} from '@/api/businesshandling'
|
||||||
export default {
|
export default {
|
||||||
name: "Ywblsxf",
|
name: 'Ywblsxf',
|
||||||
components: {
|
components: {
|
||||||
topBar,
|
topBar
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
moren: "ywblsxf",
|
moren: 'ywblsxf',
|
||||||
topList: [
|
topList: [
|
||||||
{
|
{
|
||||||
name: '业务办理手续费',
|
name: '业务办理手续费',
|
||||||
path: "ywblsxf",
|
path: 'ywblsxf'
|
||||||
},
|
}
|
||||||
],
|
],
|
||||||
tableData: [],
|
tableData: [],
|
||||||
loading:false,
|
loading: false,
|
||||||
multipleSelection: [],
|
multipleSelection: [],
|
||||||
total: 0,
|
total: 0,
|
||||||
queryParams: {
|
queryParams: {
|
||||||
pageNum: 1,
|
pageNum: 1,
|
||||||
pageSize: 50,
|
pageSize: 50,
|
||||||
type: "", // 业务名称
|
type: '' // 业务名称
|
||||||
},
|
},
|
||||||
updateShow: false,
|
updateShow: false,
|
||||||
addOrEdit: "", // 添加还是修改 true添加 false修改
|
addOrEdit: '', // 添加还是修改 true添加 false修改
|
||||||
updateTitle: "",
|
updateTitle: '',
|
||||||
form: {
|
form: {
|
||||||
type: "", // 业务名称
|
type: '', // 业务名称
|
||||||
// handleCount: "", //办理次数
|
// handleCount: "", //办理次数
|
||||||
pkAccount: "", // 币种
|
pkAccount: '', // 币种
|
||||||
serviceChargeDetailsList: [
|
serviceChargeDetailsList: [
|
||||||
{
|
{
|
||||||
quantity: "",
|
quantity: '',
|
||||||
cost: "",
|
cost: ''
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
},
|
||||||
rules: {
|
rules: {
|
||||||
type: [
|
type: [
|
||||||
{
|
{
|
||||||
required: true,
|
required: true,
|
||||||
message: '请选择业务',
|
message: '请选择业务',
|
||||||
trigger: "change",
|
trigger: 'change'
|
||||||
},
|
}
|
||||||
],
|
],
|
||||||
pkAccount: [
|
pkAccount: [
|
||||||
{
|
{
|
||||||
required: true,
|
required: true,
|
||||||
message: '请选择币种',
|
message: '请选择币种',
|
||||||
trigger: "change",
|
trigger: 'change'
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
},
|
||||||
approbalBusinessList: [],
|
approbalBusinessList: [],
|
||||||
pubEnumsAccountList: [],
|
pubEnumsAccountList: []
|
||||||
};
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.getHandelWorkList();
|
this.getHandelWorkList()
|
||||||
this.getApprobalBusiness();
|
this.getApprobalBusiness()
|
||||||
this.getPubEnumsAccount();
|
this.getPubEnumsAccount()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
//带输入建议的产品名称
|
// 带输入建议的产品名称
|
||||||
querySearch(queryString, cb) {
|
querySearch(queryString, cb) {
|
||||||
var restaurants = this.approbalBusinessList;
|
var restaurants = this.approbalBusinessList
|
||||||
var results = queryString
|
var results = queryString
|
||||||
? restaurants.filter(this.createFilter(queryString))
|
? restaurants.filter(this.createFilter(queryString))
|
||||||
: restaurants;
|
: restaurants
|
||||||
// 调用 callback 返回建议列表的数据
|
// 调用 callback 返回建议列表的数据
|
||||||
|
|
||||||
cb(results);
|
cb(results)
|
||||||
},
|
},
|
||||||
createFilter(queryString) {
|
createFilter(queryString) {
|
||||||
return (restaurant) => {
|
return (restaurant) => {
|
||||||
return (
|
return (
|
||||||
restaurant.label.toLowerCase().indexOf(queryString.toLowerCase()) ===
|
restaurant.label.toLowerCase().indexOf(queryString.toLowerCase()) ===
|
||||||
0
|
0
|
||||||
);
|
)
|
||||||
};
|
}
|
||||||
},
|
},
|
||||||
handleSelect(item) {
|
handleSelect(item) {
|
||||||
this.queryParams.type = item.value;
|
this.queryParams.type = item.value
|
||||||
this.queryParams.typeName = item.label
|
this.queryParams.typeName = item.label
|
||||||
},
|
},
|
||||||
changeQuantity(item, i) {
|
changeQuantity(item, i) {
|
||||||
item.quantity = i + 1;
|
item.quantity = i + 1
|
||||||
},
|
},
|
||||||
addList(i) {
|
addList(i) {
|
||||||
this.form.serviceChargeDetailsList.push({
|
this.form.serviceChargeDetailsList.push({
|
||||||
quantity: "",
|
quantity: '',
|
||||||
cost: "",
|
cost: ''
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
getApprobalBusiness() {
|
getApprobalBusiness() {
|
||||||
// 业务名称下拉选
|
// 业务名称下拉选
|
||||||
getApprobalBusiness().then((res) => {
|
getApprobalBusiness().then((res) => {
|
||||||
this.approbalBusinessList = res.data;
|
this.approbalBusinessList = res.data
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
getPubEnumsAccount() {
|
getPubEnumsAccount() {
|
||||||
// 币种下拉选
|
// 币种下拉选
|
||||||
getPubEnumsAccount().then((res) => {
|
getPubEnumsAccount().then((res) => {
|
||||||
this.pubEnumsAccountList = res.rows;
|
this.pubEnumsAccountList = res.rows
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
// 点击保存
|
// 点击保存
|
||||||
onSubmit(formName) {
|
onSubmit(formName) {
|
||||||
this.$refs[formName].validate((valid) => {
|
this.$refs[formName].validate((valid) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
let url = "";
|
let url = ''
|
||||||
if (this.addOrEdit == true) {
|
if (this.addOrEdit == true) {
|
||||||
url = saveHandleWork;
|
url = saveHandleWork
|
||||||
} else {
|
} else {
|
||||||
url = updateHandleWork;
|
url = updateHandleWork
|
||||||
}
|
}
|
||||||
url(this.form).then((res) => {
|
url(this.form).then((res) => {
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
this.updateShow = false;
|
this.updateShow = false
|
||||||
this.$message({
|
this.$message({
|
||||||
message: res.msg,
|
message: res.msg,
|
||||||
type: "success",
|
type: 'success'
|
||||||
});
|
})
|
||||||
this.getHandelWorkList();
|
this.getHandelWorkList()
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
// 重置
|
// 重置
|
||||||
reChongzhi() {
|
reChongzhi() {
|
||||||
this.queryParams.type = "";
|
this.queryParams.type = ''
|
||||||
this.queryParams.typeName = ""
|
this.queryParams.typeName = ''
|
||||||
this.getHandelWorkList();
|
this.getHandelWorkList()
|
||||||
},
|
},
|
||||||
// 添加
|
// 添加
|
||||||
adddate() {
|
adddate() {
|
||||||
this.updateShow = true;
|
this.updateShow = true
|
||||||
this.updateTitle = '添加';
|
this.updateTitle = '添加'
|
||||||
this.addOrEdit = true;
|
this.addOrEdit = true
|
||||||
this.form.pkId = null;
|
this.form.pkId = null
|
||||||
this.form = {
|
this.form = {
|
||||||
type: "", // 业务名称
|
type: '', // 业务名称
|
||||||
// handleCount: "", //办理次数
|
// handleCount: "", //办理次数
|
||||||
pkAccount: "", // 币种
|
pkAccount: '', // 币种
|
||||||
serviceChargeDetailsList: [
|
serviceChargeDetailsList: [
|
||||||
{
|
{
|
||||||
quantity: "",
|
quantity: '',
|
||||||
cost: "",
|
cost: ''
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
};
|
}
|
||||||
},
|
},
|
||||||
// 修改
|
// 修改
|
||||||
update(row) {
|
update(row) {
|
||||||
this.updateTitle = '修改';
|
this.updateTitle = '修改'
|
||||||
this.updateShow = true;
|
this.updateShow = true
|
||||||
this.addOrEdit = false;
|
this.addOrEdit = false
|
||||||
getOneHandelWorkList(row.pkId).then((res) => {
|
getOneHandelWorkList(row.pkId).then((res) => {
|
||||||
this.form = res.data;
|
this.form = res.data
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
// 删除
|
// 删除
|
||||||
deleteRow(row) {
|
deleteRow(row) {
|
||||||
this.$confirm('确认删除?', '提示', {
|
this.$confirm('确认删除?', '提示', {
|
||||||
confirmButtonText: '确定',
|
confirmButtonText: '确定',
|
||||||
cancelButtonText: '取消',
|
cancelButtonText: '取消',
|
||||||
type: "warning",
|
type: 'warning'
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
deletHandelWork(row.pkId).then((res) => {
|
deletHandelWork(row.pkId).then((res) => {
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: res.msg,
|
message: res.msg,
|
||||||
type: "success",
|
type: 'success'
|
||||||
});
|
})
|
||||||
this.getHandelWorkList();
|
this.getHandelWorkList()
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
// 获取业务办理手续费列表
|
// 获取业务办理手续费列表
|
||||||
getHandelWorkList() {
|
getHandelWorkList() {
|
||||||
this.loading = true
|
this.loading = true
|
||||||
getHandelWorkList(this.queryParams).then((res) => {
|
getHandelWorkList(this.queryParams).then((res) => {
|
||||||
this.tableData = res.rows;
|
this.tableData = res.rows
|
||||||
this.total = res.total;
|
this.total = res.total
|
||||||
this.loading = false
|
this.loading = false
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
/** 导出按钮操作 */
|
/** 导出按钮操作 */
|
||||||
handleExport() {
|
handleExport() {
|
||||||
this.$confirm( '是否确认导出所有数据项?', '警告', {
|
this.$confirm('是否确认导出所有数据项?', '警告', {
|
||||||
confirmButtonText: '确定',
|
confirmButtonText: '确定',
|
||||||
cancelButtonText: '取消',
|
cancelButtonText: '取消',
|
||||||
type: 'warning',
|
type: 'warning'
|
||||||
}).then((_) => {
|
}).then((_) => {
|
||||||
this.download(
|
this.download(
|
||||||
'system/manage/service-charge/export',
|
'system/manage/service-charge/export',
|
||||||
|
@ -452,23 +451,23 @@ export default {
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
handleClose() {
|
handleClose() {
|
||||||
this.updateShow = false;
|
this.updateShow = false
|
||||||
this.$refs["form"].clearValidate();
|
this.$refs['form'].clearValidate()
|
||||||
this.$refs["form"].resetFields();
|
this.$refs['form'].resetFields()
|
||||||
},
|
},
|
||||||
handleSelectionChange(val) {
|
handleSelectionChange(val) {
|
||||||
this.multipleSelection = val;
|
this.multipleSelection = val
|
||||||
},
|
},
|
||||||
tableRowClassName({ row, rowIndex }) {
|
tableRowClassName({ row, rowIndex }) {
|
||||||
if (rowIndex % 2 == 1) {
|
if (rowIndex % 2 == 1) {
|
||||||
return "warning-row";
|
return 'warning-row'
|
||||||
} else if (rowIndex % 2 == 0) {
|
} else if (rowIndex % 2 == 0) {
|
||||||
return "success-row";
|
return 'success-row'
|
||||||
}
|
}
|
||||||
return "";
|
return ''
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|
Loading…
Reference in New Issue