Skip to content

T
template_vue
Commit dea0531f authored by WBY1026's avatar WBY1026
Browse files
Options

修正

parent 222aded9
Hide whitespace changes
Inline Side-by-side
Showing with 292 additions and 99 deletions
src/api/demoData1.js
View file @ dea0531f
...@@ -92,5 +92,17 @@ export function getListTotal(data) { ...@@ -92,5 +92,17 @@ export function getListTotal(data) {
data: data data: data
}) })
} }
// export function testPost(data) {
// return request({
// method: 'post',
// url: '/mixSelect/postTest',
// headers: {
// 'Content-Type': 'application/json'
// },
// data: {
// name: '123'
// }
// })
// }
src/views/demoData/demoData1.vue
View file @ dea0531f
...@@ -19,8 +19,8 @@ ...@@ -19,8 +19,8 @@
:trigger-on-focus="false" @select="handleSelect"></el-autocomplete> --> :trigger-on-focus="false" @select="handleSelect"></el-autocomplete> -->
<!-- ddd是3k,这里换成搜索 --> <!-- ddd是3k,这里换成搜索 -->
<el-autocomplete class="inline-input" v-model="inputddd" :fetch-suggestions="querySearch" placeholder="搜索ccc" <!-- <el-autocomplete class="inline-input" v-model="inputddd" :fetch-suggestions="querySearch" placeholder="搜索ccc"
@select="handleSelect"></el-autocomplete> :trigger-on-focus="false" @select="handleSelect"></el-autocomplete> -->
<el-select v-model="mycccc" multiple collapse-tags style="margin-left: 20px;" placeholder="请选择cccc"> <el-select v-model="mycccc" multiple collapse-tags style="margin-left: 20px;" placeholder="请选择cccc">
<el-option v-for="item in cccc" :key="item.cccc" :label="item.cccc" :value="item.cccc"> <el-option v-for="item in cccc" :key="item.cccc" :label="item.cccc" :value="item.cccc">
...@@ -225,113 +225,294 @@ export default { ...@@ -225,113 +225,294 @@ export default {
// 搜索 // 搜索
searchToGetInfo() { searchToGetInfo() {
this.loading = true this.loading = true
listDemoData1(this.queryParams).then( // console.log(this.myCheckBox);
response => { let temp = this.myCheckBox
console.log('数据源', response)
this.demoData1List = response.rows if (temp.indexOf('fff') == -1) {
this.formatData(response.rows) this.fff = false
this.total = response.total } else {
this.loading = false this.fff = true
}
if (temp.indexOf('ggg') == -1) {
this.ggg = false
} else {
this.ggg = true
}
if (temp.indexOf('hhh') == -1) {
this.hhh = false
} else {
this.hhh = true
}
if (temp.indexOf('iii') == -1) {
this.iii = false
} else {
this.iii = true
}
if (temp.indexOf('jjj') == -1) {
this.jjj = false
} else {
this.jjj = true
}
if (temp.indexOf('kkk') == -1) {
this.kkk = false
} else {
this.kkk = true
}
const data = {
aaa: this.myaaa,
bbb: this.mybbb,
cccc: this.mycccc,
ddd: this.myddd,
dddd: this.mydddd,
eee: this.myeee,
fff: this.fff,
ggg: this.ggg,
hhh: this.hhh,
iii: this.iii,
jjj: this.jjj,
kkk: this.kkk,
pageSize: this.pageSize,
pageNo: this.currentPage
}
getListTotal(data).then(res => {
this.totalPage = res.data
})
searchTableList(data).then(res => {
console.log(res);
this.mytableList = res.data
// 判断返回的数据,然后调用渲染方法
if (this.myCheckBox.length <= 1) {
this.getDateType1()
} else if (this.myCheckBox.length == 2) {
this.getDateType2()
} else {
this.getDateType3()
} }
) this.loading = false
console.log('数据源', this.demoData1List) });
}, },
formatData(data) {
// 遍历数据，提取不重复的月份作为列标签 111 handleSizeChange(val) {
const months = new Set() console.log(`每页 ${val} 条`);
data.forEach(item => { this.pageSize = val
Object.keys(item).forEach(key => { this.searchToGetInfo()
if (key !== 'ccc' && key !== '__row_number__') {
months.add(key)
}
})
})
console.log('months是:', months)
// 将 Set 对象转换为数组
const sortedMonths = Array.from(months)
// 对数组进行排序
sortedMonths.sort()
console.log('排序后的值:', sortedMonths)
this.dynamicColumns = sortedMonths
console.log('绑定的值', this.dynamicColumns)
}, },
// 取消按钮 handleCurrentChange(val) {
cancel() { console.log(`当前页: ${val}`);
this.open = false this.currentPage = val
this.reset()
this.searchToGetInfo()
}, },
// 表单重置 resetForm() {
reset() { this.myCheckBox = ['fff'],
this.form = { this.myaaa = []
businessId: undefined, this.mybbb = []
ggg: undefined, this.mycccc = []
dddd: undefined, this.myddd = []
mmm: undefined, this.mydddd = []
jjj: undefined, this.myeee = []
iii: undefined, this.fff = true
lll: undefined, this.ggg = false
ccc: undefined, this.hhh = false
bbb: undefined, this.iii = false
cccc: undefined, this.jjj = false
fff: undefined, this.kkk = false
aaa: undefined,
ddd: undefined, this.pageSize = 30
kkk: undefined, this.currentPage = 1
eee: undefined,
hhh: undefined, this.searchToGetInfo()
flag: '1' },
}
this.resetForm('form') test() {
console.log(this.ddd);
}, },
/** 查询按钮操作 */
handleQuery() { // 匹配方法 ======
// this.queryParams.page = 1 querySearch(queryString, cb) {
this.getList() var restaurants = this.ddd;
var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
console.log(results);
// 调用 callback 返回建议列表的数据
cb(results);
}, },
/** 重置按钮操作 */ createFilter(queryString) {
resetQuery() { return (restaurant) => {
this.queryParams = { return (restaurant.ddd.indexOf(queryString) == 0);
page: 1, };
rows: 100, },
ggg: undefined, // ===============
dddd: undefined,
mmm: undefined, handleSelect(e){
jjj: undefined, console.log(e);
iii: undefined, },
lll: undefined,
ccc: undefined, // ==================================================
bbb: undefined,
cccc: undefined,
fff: undefined, // 勾选一个参数的方法
aaa: undefined, getDateType1() {
ddd: undefined, let dateTypeName = [];
kkk: undefined, this.dateColData = [];
eee: undefined, this.mytableList.forEach(item => {
hhh: undefined item.data.forEach(citem => {
} // 找到这一项的month，判断目前有没有保存过
this.handleQuery() const index = dateTypeName.findIndex(
i => i.aaa == citem.aaa
)
// 没保存过就存进去
if (index == -1) {
dateTypeName.push(citem)
}
})
});
console.log(dateTypeName, "一级表头");
// 添加表头数据
// 遍历dateTypeName
dateTypeName.forEach((item, index) => {
// 根据dateType每一个在最后需要的表头数据里面push二级表头
this.dateColData.push({
label: item.aaa,
children: [
{
prop: Object.keys(item)[1] + index,
label: null
}
]
})
})
// 遍历传来的数据
this.mytableList.forEach(data => {
data.data.forEach(item => {
dateTypeName.forEach((citem, cindex) => {
if (item.aaa == citem.aaa) {
let a = Object.keys(item)[1]
data[Object.keys(item)[1] + cindex] = item[a]
}
})
})
})
console.log(this.mytableList, "this.mytableList");
}, },
/** 导出按钮操作 */ getDateType2() {
handleExport() { let dateTypeName = [];
const queryParams = this.queryParams this.dateColData = [];
this.$confirm('是否确认操作?', '警告', { this.mytableList.forEach(item => {
confirmButtonText: '确定', item.data.forEach(citem => {
cancelButtonText: '取消', // 找到这一项的month，判断目前有没有保存过
type: 'warning' const index = dateTypeName.findIndex(
}).then(function() { i => i.aaa == citem.aaa
return exportIncomeWmsBox(queryParams).then(response => { )
const blob = new Blob([response]) // 没保存过就存进去
const downloadElement = document.createElement('a') if (index == -1) {
const href = window.URL.createObjectURL(blob)// 创建下载的链接 dateTypeName.push(citem)
downloadElement.href = href }
downloadElement.download = '库存管理信息' + '.xls' // 下载后文件名 })
document.body.appendChild(downloadElement) });
downloadElement.click()// 点击下载
document.body.removeChild(downloadElement)// 下载完成移除元素 console.log(dateTypeName, "一级表头");
window.URL.revokeObjectURL(href)// 释放掉blob对象
// 添加表头数据
// 遍历dateTypeName
dateTypeName.forEach((item, index) => {
// 根据dateType每一个在最后需要的表头数据里面push二级表头
this.dateColData.push({
label: item.aaa,
children: [
{
prop: Object.keys(item)[1] + index,
label: Object.keys(item)[1] + "的值"
},
{
prop: Object.keys(item)[2] + index,
label: Object.keys(item)[2] + "的值"
}
]
}) })
}) })
// 遍历传来的数据
this.mytableList.forEach(data => {
data.data.forEach(item => {
dateTypeName.forEach((citem, cindex) => {
if (item.aaa == citem.aaa) {
let a = Object.keys(item)[1]
let b = Object.keys(item)[2]
data[Object.keys(item)[1] + cindex] = item[a]
data[Object.keys(item)[2] + cindex] = item[b]
}
})
})
})
console.log(this.mytableList, "this.mytableList");
},
getDateType3() {
let dateTypeName = [];
this.dateColData = [];
this.mytableList.forEach(item => {
item.data.forEach(citem => {
// 找到这一项的month，判断目前有没有保存过
const index = dateTypeName.findIndex(
i => i.aaa == citem.aaa
)
// 没保存过就存进去
if (index == -1) {
dateTypeName.push(citem)
}
})
});
console.log(dateTypeName, "一级表头");
// 添加表头数据
// 遍历dateTypeName
dateTypeName.forEach((item, index) => {
// 根据dateType每一个在最后需要的表头数据里面push二级表头
this.dateColData.push({
label: item.aaa,
children: [
{
prop: Object.keys(item)[1] + index,
label: Object.keys(item)[1] + "的值"
},
{
prop: Object.keys(item)[2] + index,
label: Object.keys(item)[2] + "的值"
},
{
prop: Object.keys(item)[3] + index,
label: Object.keys(item)[3] + "的值"
}
]
})
})
// 遍历传来的数据
this.mytableList.forEach(data => {
data.data.forEach(item => {
dateTypeName.forEach((citem, cindex) => {
if (item.aaa == citem.aaa) {
let a = Object.keys(item)[1]
let b = Object.keys(item)[2]
let c = Object.keys(item)[3]
data[Object.keys(item)[1] + cindex] = item[a]
data[Object.keys(item)[2] + cindex] = item[b]
data[Object.keys(item)[3] + cindex] = item[c]
}
})
})
})
console.log(this.mytableList, "this.mytableList");
} }
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment