91 lines
3.4 KiB
Vue
91 lines
3.4 KiB
Vue
|
<template>
|
||
|
<div class="billof-quantities">
|
||
|
<el-card shadow="hover">
|
||
|
<el-form :model="state.queryForm" :inline="true">
|
||
|
<el-form-item label="版本号" prop="versions">
|
||
|
<el-select v-model="state.queryForm.versions" placeholder="选择版本号" @change="handleChange">
|
||
|
<el-option v-for="item in state.options" :key="item.versions" :label="item.versions"
|
||
|
:value="item.versions" />
|
||
|
</el-select>
|
||
|
</el-form-item>
|
||
|
<el-form-item>
|
||
|
<el-button type="primary" @click="openTable(true, index)">一键展开</el-button>
|
||
|
</el-form-item>
|
||
|
<el-form-item>
|
||
|
<el-button type="primary" @click="openTable(false, index)">一键收起</el-button>
|
||
|
</el-form-item>
|
||
|
<el-form-item>
|
||
|
<el-upload ref="uploadRef" class="upload-demo" :http-request="importExcel" :show-file-list="false">
|
||
|
<template #trigger>
|
||
|
<el-button type="primary">上传excel</el-button>
|
||
|
</template>
|
||
|
</el-upload>
|
||
|
</el-form-item>
|
||
|
</el-form>
|
||
|
</el-card>
|
||
|
<el-table :ref="(el) => tableRef[index] = el" :data="state.tableData"
|
||
|
style="width: 100%; margin-bottom: 20px;height: calc(100vh - 305px);" row-key="id" border
|
||
|
:default-expand-all="state.isOpen">
|
||
|
<el-table-column prop="num" label="编号" />
|
||
|
<el-table-column prop="name" label="工程或费用名称" />
|
||
|
<el-table-column prop="unit" label="单位" />
|
||
|
<el-table-column prop="quantity" label="数量" />
|
||
|
<el-table-column prop="remark" label="备注" />
|
||
|
</el-table>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script setup name="billofQuantities">
|
||
|
import { ref, reactive, onMounted, computed, toRefs, getCurrentInstance, nextTick } from 'vue'
|
||
|
import { obtainAllVersionNumbers, importExcelFile, obtainTheList, sheetList } from "@/api/design/billofQuantities/index"
|
||
|
import { useUserStoreHook } from '@/store/modules/user';
|
||
|
const userStore = useUserStoreHook();
|
||
|
const currentProject = computed(() => userStore.selectedProject);
|
||
|
const { proxy } = getCurrentInstance();
|
||
|
const { work_order_type } = toRefs(proxy?.useDict('work_order_type'));
|
||
|
const tableRef = ref({});
|
||
|
// tableData
|
||
|
// 版本号
|
||
|
const state = reactive({
|
||
|
work_order_type: 0,
|
||
|
// 版本号
|
||
|
version_num: '',
|
||
|
options: [],// 版本号选项
|
||
|
queryForm: {
|
||
|
projectId: currentProject.value?.id,
|
||
|
versions: '',
|
||
|
sheet: '',
|
||
|
pageSize: 20,
|
||
|
pageNum: 1
|
||
|
},
|
||
|
tableData: [],
|
||
|
})
|
||
|
onMounted(() => {
|
||
|
getVersionNums();
|
||
|
})
|
||
|
// 上传excel
|
||
|
function importExcel(options) {
|
||
|
console.log(options);
|
||
|
let formData = new FormData();
|
||
|
formData.append("file", options.file);
|
||
|
importExcelFile({ workOrderType: state.work_order_type, projectId: currentProject.value?.id }, formData).then(res => {
|
||
|
const { code } = res;
|
||
|
if (code == 200) {
|
||
|
proxy.$modal.msgSuccess(res.msg || '导入成功');
|
||
|
// 更新列表
|
||
|
getVersionNums()
|
||
|
} else {
|
||
|
proxy.$modal.msgError(res.msg || '导入失败');
|
||
|
}
|
||
|
})
|
||
|
}
|
||
|
// 切换表名
|
||
|
function handleChange(version) {
|
||
|
console.log('version', version);
|
||
|
}
|
||
|
</script>
|
||
|
<style>
|
||
|
.billof-quantities {
|
||
|
padding: 20px;
|
||
|
}
|
||
|
</style>
|