parent
8901914034
commit
bd25ab896d
@ -0,0 +1,200 @@
|
||||
<template>
|
||||
<el-drawer :model-value="props.isShow" :with-header="true" :show-close="false" class="xy-drawer" @closed="doClose"
|
||||
size="40%">
|
||||
<template #header style="background-color: red;">
|
||||
<div class="xy-header-l">
|
||||
<el-icon>
|
||||
<Filter />
|
||||
</el-icon>高级筛选
|
||||
</div>
|
||||
<div class="xy-header-r">
|
||||
<el-button type="" link :icon="ArrowRightBold" @click="doClose">收起</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<template #default>
|
||||
<el-form :model="queryParams" ref="queryFormRef">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="部门名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入部门名称" clearable @keyup.enter="handleQuery"
|
||||
style="width: 100%;" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="部门状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择" style="width: 100%;">
|
||||
<el-option v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" :key="dict.value"
|
||||
:label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
<template #footer>
|
||||
<div class="xy-footer">
|
||||
<el-button type="primary" :icon="Search" @click="handleQuery">查询</el-button>
|
||||
<el-button :icon="RefreshLeft" @click="resetQuery">重置</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="DrawerFilter">
|
||||
import { Filter, ArrowRightBold, Search, RefreshLeft } from '@element-plus/icons-vue'
|
||||
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
|
||||
import * as DeptApi from '@/api/system/dept'
|
||||
import { handleTree } from '@/utils/tree'
|
||||
|
||||
const list = ref() // 列表的数据
|
||||
const queryFormRef = ref() // 搜索的表单
|
||||
const loading = ref(true) // 列表的加载中
|
||||
const props = defineProps({
|
||||
isShow: Boolean
|
||||
})
|
||||
|
||||
const emit = defineEmits(['doClose'])
|
||||
|
||||
// 关闭
|
||||
const doClose = () => {
|
||||
emit('doClose', false)
|
||||
}
|
||||
|
||||
|
||||
const queryParams = reactive({
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
businessType: null,
|
||||
calssify: null,
|
||||
name: null,
|
||||
logo: null,
|
||||
enterpriseNature: null,
|
||||
industryClassify: null,
|
||||
customerSource: null,
|
||||
customerStarrating: null,
|
||||
industrySchedule: null,
|
||||
belongingPeople: null,
|
||||
city: null,
|
||||
country: null,
|
||||
address: null,
|
||||
phone: null,
|
||||
companyFax: null,
|
||||
companyHttp: null,
|
||||
companyProfile: null,
|
||||
customerStatus: null,
|
||||
socialInformationCodeCertificate: null,
|
||||
registerAddress: null,
|
||||
informationCode: null,
|
||||
operateStart: null,
|
||||
operateEnd: null,
|
||||
registerCapital: null,
|
||||
businessScope: null,
|
||||
proofPaidCapital: null,
|
||||
assetCertificate: null,
|
||||
assetCertificateMortgage: null,
|
||||
otherQualifications: null,
|
||||
collaborationStart: null,
|
||||
collaborationEnd: null,
|
||||
demandVolumeDown: null,
|
||||
demandVolumeUpper: null,
|
||||
fundLimit: null,
|
||||
businessHours: null,
|
||||
businessStart: null,
|
||||
businessEnd: null,
|
||||
allowableUnloadingStart: null,
|
||||
allowableUnloadingEnd: null,
|
||||
unloading: null,
|
||||
unloadingEfficiency: null,
|
||||
allowableShipmentStart: null,
|
||||
allowableShipmentEnd: null,
|
||||
shipment: null,
|
||||
shipmentEffciency: null,
|
||||
paymentMethod: null,
|
||||
accountName: null,
|
||||
bankAccount: null,
|
||||
bankDeposit: null,
|
||||
depositArea: null,
|
||||
bankBranch: null,
|
||||
companyTaxNumber: null,
|
||||
enterpriseName: null,
|
||||
workAddress: null,
|
||||
collaborationMethod: null,
|
||||
settlementMethod: null,
|
||||
accountPeriod: null,
|
||||
underpaymentMethod: null,
|
||||
applyForUnderpaymentRatio: null,
|
||||
marginMethod: null,
|
||||
applyForMarginRatio: null,
|
||||
overdueInterestRate: null,
|
||||
applyForOverdueRatio: null,
|
||||
reservedFields1: null,
|
||||
reservedFields2: null,
|
||||
reservedFields3: null,
|
||||
reservedFields4: null,
|
||||
reservedFields5: null,
|
||||
reservedFields6: null,
|
||||
creditRating: null,
|
||||
autoCreditRating: null,
|
||||
accountsReceivableUpper: null,
|
||||
orderQuantityDown: null,
|
||||
orderQuantityUpper: null,
|
||||
accountsReceivableOverdue: null,
|
||||
taxPaymentCertificate: null,
|
||||
createTime: []
|
||||
})
|
||||
|
||||
/** 查询部门列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
debugger
|
||||
const data = await DeptApi.getDeptPage(queryParams)
|
||||
list.value = handleTree(data)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
debugger
|
||||
getList()
|
||||
}
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryParams.pageNo = 1
|
||||
queryFormRef.value.resetFields()
|
||||
handleQuery()
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.xy-drawer {
|
||||
.el-drawer__header {
|
||||
margin: 0px;
|
||||
border-bottom: solid 1px #D9D9D9;
|
||||
padding: 10px 0px;
|
||||
height: 50px;
|
||||
|
||||
.xy-header-l {
|
||||
padding: 0px 10px;
|
||||
}
|
||||
|
||||
.xy-header-r {
|
||||
padding: 0px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-drawer__footer {
|
||||
border-top: solid 1px #D9D9D9;
|
||||
padding: 0px;
|
||||
|
||||
.xy-footer {
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -0,0 +1,200 @@
|
||||
<template>
|
||||
<el-drawer :model-value="props.isShow" :with-header="true" :show-close="false" class="xy-drawer" @closed="doClose"
|
||||
size="40%">
|
||||
<template #header style="background-color: red;">
|
||||
<div class="xy-header-l">
|
||||
<el-icon>
|
||||
<Filter />
|
||||
</el-icon>高级筛选
|
||||
</div>
|
||||
<div class="xy-header-r">
|
||||
<el-button type="" link :icon="ArrowRightBold" @click="doClose">收起</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<template #default>
|
||||
<el-form :model="queryParams" ref="queryFormRef">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="部门名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入部门名称" clearable @keyup.enter="handleQuery"
|
||||
style="width: 100%;" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="部门状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择" style="width: 100%;">
|
||||
<el-option v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" :key="dict.value"
|
||||
:label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
<template #footer>
|
||||
<div class="xy-footer">
|
||||
<el-button type="primary" :icon="Search" @click="handleQuery">查询</el-button>
|
||||
<el-button :icon="RefreshLeft" @click="resetQuery">重置</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="DrawerFilter">
|
||||
import { Filter, ArrowRightBold, Search, RefreshLeft } from '@element-plus/icons-vue'
|
||||
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
|
||||
import * as DeptApi from '@/api/system/dept'
|
||||
import { handleTree } from '@/utils/tree'
|
||||
|
||||
const list = ref() // 列表的数据
|
||||
const queryFormRef = ref() // 搜索的表单
|
||||
const loading = ref(true) // 列表的加载中
|
||||
const props = defineProps({
|
||||
isShow: Boolean
|
||||
})
|
||||
|
||||
const emit = defineEmits(['doClose'])
|
||||
|
||||
// 关闭
|
||||
const doClose = () => {
|
||||
emit('doClose', false)
|
||||
}
|
||||
|
||||
|
||||
const queryParams = reactive({
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
businessType: null,
|
||||
calssify: null,
|
||||
name: null,
|
||||
logo: null,
|
||||
enterpriseNature: null,
|
||||
industryClassify: null,
|
||||
customerSource: null,
|
||||
customerStarrating: null,
|
||||
industrySchedule: null,
|
||||
belongingPeople: null,
|
||||
city: null,
|
||||
country: null,
|
||||
address: null,
|
||||
phone: null,
|
||||
companyFax: null,
|
||||
companyHttp: null,
|
||||
companyProfile: null,
|
||||
customerStatus: null,
|
||||
socialInformationCodeCertificate: null,
|
||||
registerAddress: null,
|
||||
informationCode: null,
|
||||
operateStart: null,
|
||||
operateEnd: null,
|
||||
registerCapital: null,
|
||||
businessScope: null,
|
||||
proofPaidCapital: null,
|
||||
assetCertificate: null,
|
||||
assetCertificateMortgage: null,
|
||||
otherQualifications: null,
|
||||
collaborationStart: null,
|
||||
collaborationEnd: null,
|
||||
demandVolumeDown: null,
|
||||
demandVolumeUpper: null,
|
||||
fundLimit: null,
|
||||
businessHours: null,
|
||||
businessStart: null,
|
||||
businessEnd: null,
|
||||
allowableUnloadingStart: null,
|
||||
allowableUnloadingEnd: null,
|
||||
unloading: null,
|
||||
unloadingEfficiency: null,
|
||||
allowableShipmentStart: null,
|
||||
allowableShipmentEnd: null,
|
||||
shipment: null,
|
||||
shipmentEffciency: null,
|
||||
paymentMethod: null,
|
||||
accountName: null,
|
||||
bankAccount: null,
|
||||
bankDeposit: null,
|
||||
depositArea: null,
|
||||
bankBranch: null,
|
||||
companyTaxNumber: null,
|
||||
enterpriseName: null,
|
||||
workAddress: null,
|
||||
collaborationMethod: null,
|
||||
settlementMethod: null,
|
||||
accountPeriod: null,
|
||||
underpaymentMethod: null,
|
||||
applyForUnderpaymentRatio: null,
|
||||
marginMethod: null,
|
||||
applyForMarginRatio: null,
|
||||
overdueInterestRate: null,
|
||||
applyForOverdueRatio: null,
|
||||
reservedFields1: null,
|
||||
reservedFields2: null,
|
||||
reservedFields3: null,
|
||||
reservedFields4: null,
|
||||
reservedFields5: null,
|
||||
reservedFields6: null,
|
||||
creditRating: null,
|
||||
autoCreditRating: null,
|
||||
accountsReceivableUpper: null,
|
||||
orderQuantityDown: null,
|
||||
orderQuantityUpper: null,
|
||||
accountsReceivableOverdue: null,
|
||||
taxPaymentCertificate: null,
|
||||
createTime: []
|
||||
})
|
||||
|
||||
/** 查询部门列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
debugger
|
||||
const data = await DeptApi.getDeptPage(queryParams)
|
||||
list.value = handleTree(data)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
debugger
|
||||
getList()
|
||||
}
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryParams.pageNo = 1
|
||||
queryFormRef.value.resetFields()
|
||||
handleQuery()
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.xy-drawer {
|
||||
.el-drawer__header {
|
||||
margin: 0px;
|
||||
border-bottom: solid 1px #D9D9D9;
|
||||
padding: 10px 0px;
|
||||
height: 50px;
|
||||
|
||||
.xy-header-l {
|
||||
padding: 0px 10px;
|
||||
}
|
||||
|
||||
.xy-header-r {
|
||||
padding: 0px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-drawer__footer {
|
||||
border-top: solid 1px #D9D9D9;
|
||||
padding: 0px;
|
||||
|
||||
.xy-footer {
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in new issue