提交 4c0b76d4 authored 作者: lidongxu's avatar lidongxu

refactor(plan): 重构完了_促销计划查询部分

同上
上级 c98acdc8
......@@ -26,8 +26,7 @@ export const useDatePickerOptions = () => {
text: '最近 7 日',
value() {
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
start.setHours(0, 0, 0, 0);
start.setDate((new Date().getDate() - (7 - 1)))
const end = new Date();
end.setHours(23, 59, 59, 59);
return [start, end]
......@@ -36,7 +35,7 @@ export const useDatePickerOptions = () => {
text: '最近 30 日',
value() {
const start = new Date();
start.setDate((new Date().getDate() - 30))
start.setDate((new Date().getDate() - (30 - 1)))
start.setHours(0, 0, 0, 0);
const end = new Date();
end.setHours(23, 59, 59, 59);
......
......@@ -103,6 +103,16 @@ export default defineStore(
promotionIdentity(state) {
return state.userInfo.privilegeId === 1
},
// 员工关键信息
empInfo(state) {
return {
empId: state.userInfo.userId, // 员工 id
empNo: state.userInfo.userName, // 员工工号
}
},
// 操作人员工工号,姓名,id
employeeInfo(state) {
return {
......
......@@ -320,103 +320,24 @@
</template>
<script setup>
import { getPlanListAPI, uploadFileToOSSAPI, addPlanAPI, savePlanAPI, deletePlanAPI, addPlanByRoleAPI, getProCityAPI, getDealerListAPI, getWarZoneListAPI, getChargeListAPI, addPlanByWebAPI, updatePlanByWebAPI, getPlanStoreListAPI, updatePlanAPI, batchUpdatePlanAPI } from '@/api'
import { useDatePickerOptions, checkPlanExpire } from '@/hooks'
import { getPlanListAPI, uploadFileToOSSAPI, addPlanAPI, savePlanAPI, deletePlanAPI, addPlanByRoleAPI,getWarZoneListAPI, getChargeListAPI, addPlanByWebAPI, updatePlanByWebAPI, getPlanStoreListAPI, updatePlanAPI, batchUpdatePlanAPI } from '@/api'
import { checkPlanExpire } from '@/hooks'
import { v4 as uuidv4 } from 'uuid';
import store from '@/store'
import userStore from '@/store/modules/user'
import { getPromotionActiveStatus } from '@/dicts'
import { PROMOTION_STATUS } from '@/dicts'
import { parseTime } from '@/utils'
import { ElMessage, ElMessageBox } from 'element-plus';
import EffectivePlan from './effectivePlan.vue';
const { proxy } = getCurrentInstance();
const isCityManager = userStore().promotionIdentity
const { recentPickerOptions: pickerOptions } = useDatePickerOptions()
const queryParams = reactive({
activityDate: [],
planStatus: '',
region: '全国',
provinceId: '',
cityId: '',
zoneId: '', // 经销商
warzoneId: '', // 战区
employeeId: '', // 归属人
storeName: '', // 门店名称
pageNum: 1,
pageSize: 10,
})
const taskStatusList = ref(Object.values(PROMOTION_STATUS))
// 区域查询切换
const provinceList = ref([])
const cityList = ref([])
// 获取省份和城市列表
const getProCity = async () => {
const { data } = await getProCityAPI(queryParams)
// 本次省份里有值,证明 data 是城市数据
if (queryParams.provinceId) {
queryParams.cityId = ''
cityList.value = data.map(item => ({
label: item.name,
value: item.num
}))
} else {
// 省份列表数据
queryParams.cityId = ''
cityList.value = []
provinceList.value = data.map(item => ({
label: item.name,
value: item.num
}))
}
getPlanList()
}
// 切换
const regionChange = (val) => {
if (val === '全国') {
queryParams.provinceId = ''
queryParams.cityId = ''
} else if (val === '省') {
queryParams.cityId = ''
} else if (val === '省-市') {
cityList.value = []
getProCity()
const props = defineProps({
queryParams: {
type: Object,
}
getPlanList()
}
})
// 查询经销商列表
const zoneList = ref([])
const getZoneList = async () => {
const { data } = await getDealerListAPI(queryParams)
zoneList.value = data.map(item => {
return {
label: item.dealerName,
value: item.dealerId
}
})
}
// 经销商远程搜索(点击输入框自动触发)
const zoneRemoteSearch = (query) => {
queryParams.dealerName = query
getZoneList()
}
const { proxy } = getCurrentInstance();
const isCityManager = userStore().promotionIdentity
// 查询战区列表
const warZoneList = ref([])
const getWarZoneList = async () => {
const { data } = await getWarZoneListAPI()
warZoneList.value = data.map(item => {
return {
label: item.orgName,
value: item.qcId
}
})
}
// 查询归属人列表
const belongPerList = ref([])
......@@ -572,34 +493,25 @@ const columns = ref([
}
])
const getPlanList = async () => {
// 后台:省市不要 id,查个名字给后台(但是省市区接口还得用 id,所以 queryParams 上还必须绑定 id)
queryParams.province = provinceList.value.find(item => item.value === queryParams.provinceId)?.label
queryParams.city = cityList.value.find(item => item.value === queryParams.cityId)?.label
// 城市经理查自己,职能角色查所有
if (isCityManager) {
// 城市经理 (用员工 ID(1,2,3),而不是工号,employeeNo 是工号(000535))
queryParams.employeeId = belongPerList.value.find(item => item.employeeNo === userStore().employeeNo)?.value
// 先从归属人查询当前登录用户的战区 ID
queryParams.warzoneId = belongPerList.value.find(item => item.employeeNo === userStore().employeeNo)?.deptQcId
}
// 日期格式化一下
if (queryParams.activityDate?.length > 0) {
queryParams.activityDate = queryParams.activityDate.map(item => parseTime(item, '{y}-{m}-{d}'))
console.log('开始搜', props.queryParams)
if (props.queryParams.activityDate?.length > 0) {
props.queryParams.activityDate = props.queryParams.activityDate.map(item => parseTime(item, '{y}-{m}-{d}'))
}
const res = await getPlanListAPI({
pageNum: queryParams.pageNum,
pageSize: queryParams.pageSize,
pageNum: props.queryParams.pageNum,
pageSize: props.queryParams.pageSize,
queryParams: {
activityStartDate: queryParams.activityDate && queryParams.activityDate[0],
activityEndDate: queryParams.activityDate && queryParams.activityDate[1],
planStatus: queryParams.planStatus,
region: queryParams.region,
province: queryParams.province,
city: queryParams.city,
dealerId: queryParams.zoneId,
orgQcId: queryParams.warzoneId,
employeeId: queryParams.employeeId,
storeNameLike: queryParams.storeName
activityStartDate: props.queryParams.activityDate && props.queryParams.activityDate[0],
activityEndDate: props.queryParams.activityDate && props.queryParams.activityDate[1],
planStatus: props.queryParams.planStatus,
region: props.queryParams.region,
province: props.queryParams.provinceName,
city: props.queryParams.cityName,
dealerId: props.queryParams.dealerId,
orgQcId: props.queryParams.warzoneId,
employeeId: props.queryParams.employeeId,
storeNameLike: props.queryParams.storeName
}
})
tableList.value = res.data.records
......@@ -1122,15 +1034,19 @@ const uploadChangeFile = async (file) => {
const init = async () => {
await getBelongPerList()
getPlanList() // 任务列表需要当前归属人 id,所以保证上一步网络请求完成
getProCity()
getWarZoneList()
// getWarZoneList()
};
init()
defineExpose({
getPlanList
})
</script>
<style scoped>
.el-table {
<style scoped
lang="scss">
.el-table {
::v-deep(.error-row) {
--el-table-tr-bg-color: var(--el-color-error-light-9);
......
......@@ -36,7 +36,7 @@
<el-form-item label="区域查询"
prop="region">
<el-radio-group v-model="queryParams.region"
@change="regionChange">
@change="changeRegion">
<el-radio-button label="全国"
value="全国" />
<el-radio-button label="省"
......@@ -46,11 +46,11 @@
</el-radio-group>
</el-form-item>
<el-form-item label="省份"
prop="province"
prop="provinceId"
v-show="queryParams.region !== '全国'">
<el-select v-model="queryParams.provinceId"
placeholder="请选择省"
@change="getProCity"
@change="selProvince"
filterable
clearable>
<el-option v-for="item in provinceList"
......@@ -60,11 +60,11 @@
</el-select>
</el-form-item>
<el-form-item label="城市"
prop="city"
prop="cityId"
v-show="queryParams.region === '省-市'">
<el-select v-model="queryParams.cityId"
placeholder="请选择市"
@change="getPlanList"
@change="selCity"
filterable
clearable>
<el-option v-for="item in cityList"
......@@ -76,23 +76,23 @@
</el-row>
<el-row>
<el-form-item label="经销商"
prop="zone">
<el-select v-model="queryParams.zoneId"
placeholder="搜索经销商"
prop="dealerId">
<el-select v-model="queryParams.dealerId"
placeholder="搜索更多经销商"
@change="getPlanList"
filterable
remote
:remote-method="zoneRemoteSearch"
:remote-method="dealerRemoteSearch"
clearable>
<el-option v-for="item in zoneList"
<el-option v-for="item in dealerList"
:key="item.value"
:label="item.label"
:value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="战区"
prop="warzone">
<el-select v-model="queryParams.warzoneId"
prop="warZoneId">
<el-select v-model="queryParams.warZoneId"
placeholder="搜索战区"
filterable
clearable
......@@ -105,7 +105,7 @@
</el-select>
</el-form-item>
<el-form-item label="归属人"
prop="belongPer">
prop="employeeId">
<el-select v-model="queryParams.employeeId"
placeholder="搜索归属人"
filterable
......@@ -119,7 +119,7 @@
</el-select>
</el-form-item>
<el-form-item label="店铺名"
prop="store">
prop="storeName">
<el-input v-model="queryParams.storeName"
clearable
placeholder="搜索店铺名"
......@@ -129,7 +129,8 @@
</el-form>
<el-tabs type="card">
<el-tab-pane label="有效计划">
<EffectivePlan />
<EffectivePlan ref="effectivePlan"
:queryParams="queryParams" />
</el-tab-pane>
<el-tab-pane label="已删除计划">Config</el-tab-pane>
</el-tabs>
......@@ -141,86 +142,94 @@
import { getProCityAPI, getDealerListAPI, getWarZoneListAPI, getChargeListAPI } from '@/api'
import userStore from '@/store/modules/user'
import { useDatePickerOptions } from '@/hooks'
import { PROMOTION_STATUS} from '@/dicts'
import { PROMOTION_STATUS } from '@/dicts'
import EffectivePlan from './effectivePlan.vue';
const isCityManager = userStore().promotionIdentity
const empInfo = userStore().empInfo // 当前登录员工信息
const { recentPickerOptions: pickerOptions } = useDatePickerOptions()
const taskStatusList = ref(Object.values(PROMOTION_STATUS))
const queryParams = reactive({
activityDate: [],
planStatus: '',
region: '全国',
provinceId: '',
cityId: '',
zoneId: '', // 经销商
warzoneId: '', // 战区
dealerId: '', // 经销商
warZoneId: '', // 战区
employeeId: '', // 归属人
storeName: '', // 门店名称
pageNum: 1,
pageSize: 10,
})
/************* 选择日期 *************/
const { recentPickerOptions: pickerOptions } = useDatePickerOptions()
/************* 选择状态 *************/
const taskStatusList = ref(Object.values(PROMOTION_STATUS))
// 区域查询切换
/************* 区域查询 *************/
const provinceList = ref([])
const cityList = ref([])
// 获取省份和城市列表
const getProCity = async () => {
const getProCityList = async () => {
const { data } = await getProCityAPI(queryParams)
// 本次省份里有值,证明 data 是城市数据
if (queryParams.provinceId) {
queryParams.cityId = ''
cityList.value = data.map(item => ({
const list = data.map(item => ({
label: item.name,
value: item.num
}))
} else {
// 省份列表数据
queryParams.provinceId ? (cityList.value = list) : (provinceList.value = list)
}
getProCityList()
// 切换省市范围
const changeRegion = async () => {
if (queryParams.region === '全国') {
queryParams.provinceId = ''
queryParams.provinceName = ''
queryParams.cityId = ''
cityList.value = []
provinceList.value = data.map(item => ({
label: item.name,
value: item.num
}))
queryParams.cityName = ''
} else if (queryParams.region === '省') {
queryParams.cityId = ''
queryParams.cityName = ''
}
getPlanList()
}
// 切换
const regionChange = (val) => {
if (val === '全国') {
queryParams.provinceId = ''
queryParams.cityId = ''
} else if (val === '省') {
// 选择省
const selProvince = async () => {
// 设置省名
queryParams.provinceName = provinceList.value.find(item => item.value === queryParams.provinceId)?.label
// 重置城市
queryParams.cityId = ''
} else if (val === '省-市') {
queryParams.cityName = ''
cityList.value = []
getProCity()
}
// 重新获取城市列表以及查询列表
getProCityList()
getPlanList()
}
// 选择市
const selCity = async () => {
// 设置市名
queryParams.cityName = cityList.value.find(item => item.value === queryParams.cityId)?.label
// 重新获取查询列表
getPlanList()
}
// 查询经销商列表
const zoneList = ref([])
const getZoneList = async () => {
/*************** 经销商 ***************/
const dealerList = ref([])
const getDealerList = async () => {
const { data } = await getDealerListAPI(queryParams)
zoneList.value = data.map(item => {
dealerList.value = data.map(item => {
return {
label: item.dealerName,
value: item.dealerId
}
})
}
// 经销商远程搜索(点击输入框自动触发)
const zoneRemoteSearch = (query) => {
queryParams.dealerName = query
getZoneList()
// 经销商远程搜索
const dealerRemoteSearch = (searchKey) => {
queryParams.dealerName = searchKey
getDealerList()
}
// 查询战区列表
/*************** 战区 ***************/
const warZoneList = ref([])
const getWarZoneList = async () => {
const { data } = await getWarZoneListAPI()
......@@ -230,9 +239,11 @@ const getWarZoneList = async () => {
value: item.qcId
}
})
// 城市经理,设置默认战区
isCityManager && (queryParams.warZoneId = belongPerList.value.find(item => item.employeeNo === empInfo.empNo)?.deptQcId)
}
// 查询归属人列表
/*************** 归属人 ***************/
const belongPerList = ref([])
const getBelongPerList = async () => {
const { data } = await getChargeListAPI()
......@@ -245,14 +256,20 @@ const getBelongPerList = async () => {
deptQcId: item.deptQcId
}
})
// 城市经理,设置默认归属人
isCityManager && (queryParams.employeeId = belongPerList.value.find(item => item.employeeNo === empInfo.empNo)?.value)
}
const init = async () => {
onMounted(async () => {
// 给城市经理设置默认选中战区,需要确保归属人列表数据有值
await getBelongPerList()
getPlanList() // 任务列表需要当前归属人 id,所以保证上一步网络请求完成
getProCity()
getWarZoneList()
})
};
init()
/************ 数据列表管理 ************/
const effectivePlan = ref({})
const getPlanList = () => {
effectivePlan.value.getPlanList()
}
</script>
\ No newline at end of file
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论