提交 59e8a5b0 authored 作者: lidongxu's avatar lidongxu

feat(promotion/task): 促销管理-任务管理

完成基础数据展示,细节还需要测试
上级 097074bc
...@@ -4,6 +4,8 @@ import request from '@/utils/request' ...@@ -4,6 +4,8 @@ import request from '@/utils/request'
export const getProCityAPI = (params) => { export const getProCityAPI = (params) => {
return request({ return request({
url: '/system/site/query/region', url: '/system/site/query/region',
params params: {
provinceNum: params.provinceId,
}
}) })
} }
\ No newline at end of file
...@@ -4,76 +4,64 @@ ...@@ -4,76 +4,64 @@
<!-- 查询表单 --> <!-- 查询表单 -->
<el-form :model="queryParams" <el-form :model="queryParams"
inline inline
label-width="auto"> label-width="68px">
<el-row> <el-form-item label="选择日期"
<el-col :span="6"> prop="date">
<el-form-item label="选择日期" <el-date-picker v-model="queryParams.date"
prop="date"> type="daterange"
<el-date-picker v-model="queryParams.date" :clearable="false"
type="daterange" range-separator="至"
:clearable="false" start-placeholder="开始日期"
range-separator="至" end-placeholder="结束日期"
start-placeholder="开始日期" :shortcuts="pickerOptions" />
end-placeholder="结束日期" </el-form-item>
:shortcuts="pickerOptions" <el-form-item label="任务状态"
@change="queryChangeFn('date')" /> prop="taskStatus">
</el-form-item> <el-radio-group v-model="queryParams.taskStatus">
</el-col> <el-radio-button v-for="item in taskStatusList"
<el-col :span="6"> :key="item.value"
<el-form-item label="任务状态" :label="item.label"
prop="taskStatus"> :value="item.value" />
<el-radio-group v-model="queryParams.taskStatus"> </el-radio-group>
<el-radio-button v-for="item in taskStatusList" </el-form-item>
:key="item.value"
:label="item.label"
:value="item.value" />
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<!-- 省市 --> <!-- 省市 -->
<el-row> <el-row>
<el-col :span="6"> <el-form-item label="区域查询"
<el-form-item label="区域查询" prop="region">
prop="region"> <el-radio-group v-model="queryParams.region">
<el-radio-group v-model="queryParams.region"> <el-radio-button label="全国"
<el-radio-button label="全国" value="全国" />
value="全国" /> <el-radio-button label="省"
<el-radio-button label="省" value="省" />
value="省" /> <el-radio-button label="省-市"
<el-radio-button label="省-市" value="省-市" />
value="省-市" /> </el-radio-group>
</el-radio-group> </el-form-item>
</el-form-item> <el-form-item label="省份"
</el-col> prop="province"
<el-col :span="6"> v-show="queryParams.region !== '全国'">
<el-form-item label="省份" <el-select v-model="queryParams.provinceId"
prop="province"> placeholder="请选择省"
<el-select v-model="queryParams.province" @change="getProCity">
placeholder="请选择省" <el-option v-for="item in provinceList"
@change="getCityList"> :key="item.value"
<el-option v-for="item in provinceList" :label="item.label"
:key="item.value" :value="item.value" />
:label="item.label" </el-select>
:value="item.value" /> </el-form-item>
</el-select> <el-form-item label="城市"
</el-form-item> prop="city"
</el-col> v-show="queryParams.region === '省-市'">
<el-col :span="6"> <el-select v-model="queryParams.cityId"
<el-form-item label="城市" placeholder="请选择市">
prop="city"> <el-option v-for="item in cityList"
<el-select v-model="queryParams.city" :key="item.value"
placeholder="请选择市"> :label="item.label"
<el-option v-for="item in cityList" :value="item.value" />
:key="item.value" </el-select>
:label="item.label" </el-form-item>
:value="item.value" />
</el-select>
</el-form-item>
</el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-form-item label="战区查询" <el-form-item label="战区查询"
prop="zone"> prop="zone">
<el-select v-model="queryParams.zoneId" <el-select v-model="queryParams.zoneId"
...@@ -102,6 +90,19 @@ ...@@ -102,6 +90,19 @@
</el-row> </el-row>
</el-form> </el-form>
<!-- 数据表格 --> <!-- 数据表格 -->
<el-table :data="tableList"
:cell-style="{ 'word-wrap': 'break-word', 'white-space': 'normal' }"
border
style="width: 100%"
show-overflow-tooltip>
<el-table-column v-for="item in columns"
:key="item.label"
:prop="item.prop"
:label="item.label"
:width="item.width"
:formatter="formatter"
:fixed="item.fixed" />
</el-table>
</div> </div>
</div> </div>
</template> </template>
...@@ -110,6 +111,7 @@ ...@@ -110,6 +111,7 @@
import { reactive } from 'vue' import { reactive } from 'vue'
import { useDatePickerOptions } from '@/hooks' import { useDatePickerOptions } from '@/hooks'
import { getWarZoneListAPI, getChargeListAPI, getTaskListAPI, getProCityAPI } from '@/api' import { getWarZoneListAPI, getChargeListAPI, getTaskListAPI, getProCityAPI } from '@/api'
import { parseTime } from '@/utils'
const { pickerOptions, last7Date } = useDatePickerOptions(0) const { pickerOptions, last7Date } = useDatePickerOptions(0)
...@@ -117,13 +119,13 @@ const queryParams = reactive({ ...@@ -117,13 +119,13 @@ const queryParams = reactive({
date: last7Date, date: last7Date,
taskStatus: 'SUBMITTED', taskStatus: 'SUBMITTED',
region: '全国', region: '全国',
province: '', provinceId: undefined,
city: '', cityId: undefined,
zoneId: undefined, zoneId: undefined,
managerId: undefined, managerId: undefined,
storeName: undefined, storeName: undefined,
page: 1, page: 1,
pageSize: 10 pageSize: 20
}) })
// 任务状态 // 任务状态
...@@ -146,14 +148,19 @@ const taskStatusList = ref([ ...@@ -146,14 +148,19 @@ const taskStatusList = ref([
const provinceList = ref([]) const provinceList = ref([])
const cityList = ref([]) const cityList = ref([])
const getProCity = async () => { const getProCity = async () => {
const { data } = await getProCityAPI() const { data } = await getProCityAPI(queryParams)
console.log(data) if (queryParams.provinceId) {
provinceList.value = data.map(item => { queryParams.cityId = undefined
return { cityList.value = data.map(item => ({
label: item.name, label: item.name,
value: item.num value: item.num
} }))
}) } else {
provinceList.value = data.map(item => ({
label: item.name,
value: item.num
}))
}
} }
getProCity() getProCity()
...@@ -185,19 +192,130 @@ getManagerList() ...@@ -185,19 +192,130 @@ getManagerList()
// 任务列表 // 任务列表
const tableList = ref([]) const tableList = ref([])
const columns = ref([
{
label: 'ID',
prop: 'id',
width: 90,
fixed: true
},
{
label: '姓名',
prop: 'temporaryName',
width: 90,
fixed: true
},
{
label: '上报日期',
prop: 'createDate',
width: 120,
fixed: true
},
{
label: '省份',
prop: 'province',
width: 100
},
{
label: '城市',
prop: 'city',
width: 100
},
{
label: '经销商',
prop: 'dealerName',
width: 250
},
{
label: '门店',
prop: 'storeName',
width: 250
},
{
label: '活动模式',
prop: 'activityPattern',
width: 100
},
{
label: '上班卡',
prop: 'clockDto.clockInTime', // 拼接地址 clockInAddress, 经纬度 clockInCoordinates
width: 300
},
{
label: '午休下班卡',
prop: 'clockDto.noonClockOutTime', // 拼接地址 noonClockOutAddress, 经纬度 noonClockOutCoordinates
width: 300
},
{
label: '午休上班卡',
prop: 'clockDto.noonClockInTime', // 拼接地址 noonClockInAddress, 经纬度 noonClockInCoordinates
width: 300
},
{
label: '下班卡',
prop: 'clockDto.clockOutTime', // 拼接地址 clockOutAddress, 经纬度 clockOutCoordinates
width: 300
},
{
label: '推广图片',
prop: ''
},
{
label: '打卡照片',
prop: ''
},
{
label: '战区',
prop: 'deptQcOrgName',
width: 150
},
{
label: '城市经理',
prop: 'approveName',
width: 120
},
{
label: '操作',
prop: ''
},
])
const getTaskList = async () => { const getTaskList = async () => {
const { data } = await getTaskListAPI(queryParams) const { data: { records } } = await getTaskListAPI(queryParams)
tableList.value = data.map(item => { tableList.value = records
return {
label: item.taskName,
value: item.taskId
}
})
} }
getTaskList() getTaskList()
const formatter = (row, columns, value) => {
// 判断有值再转换
if (columns.property === 'clockDto.clockInTime' && value) {
return parseTime(value, '{h}:{i}') + '\n' + row['clockDto']['clockInAddress']
} else if (columns.property === 'clockDto.noonClockOutTime' && value) {
return parseTime(value, '{h}:{i}') + '\n' + row['clockDto']['noonClockOutAddress']
} else if (columns.property === 'clockDto.noonClockInTime' && value) {
return parseTime(value, '{h}:{i}') + '\n' + row['clockDto']['noonClockInAddress']
} else if (columns.property === 'clockDto.clockOutTime' && value) {
return parseTime(value, '{h}:{i}') + '\n' + row['clockDto']['clockOutAddress']
}
return value
}
</script> </script>
<style scoped <style scoped
lang="scss"></style> lang="scss">
\ No newline at end of file ::v-deep(.el-form-item) {
width: 350px !important;
}
/* 单元格支持 \n 换行 */
.container .el-table ::v-deep(.cell) {
/* white-space: pre-line; */
/* 强制显示 2 行,超出的省略号 */
/* overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical; */
}
</style>
\ No newline at end of file
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论