YNUtdPlatform/pages/workPlan/monthPlan/index.vue

1451 lines
40 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="month-container">
<u-navbar
class="u-navbar"
:title="monthPlanTitle"
placeholder
@leftClick="leftClick"
leftIconColor="#fff"
bgColor="#00337A"
:titleStyle="{ color: '#FFF', fontSize: '32rpx' }"
/>
<view class="month-content">
<view class="btn-header" id="btnHeaderRef">
<button
:key="index"
@tap="onTapCheck(item.btn_title)"
v-for="(item, index) in btnList"
:class="{ active: item.btn_title === activeIndex }"
v-show="item.isShow.includes(roles)"
>
{{ item.btn_title }}
</button>
</view>
<!-- 发起提交 -->
<view class="content-2" v-show="activeIndex === '发起提交'">
<view class="pages-add" id="pagesAddRef">
<view style="text-align: right; width: 30%">
<image
style="width: 50rpx; height: 50rpx; margin: 13rpx 20rpx 13rpx 0"
src="../../../static/images/workPlan/delete.png"
@tap="onReducePages"
></image>
</view>
<view class="num-content">
<!-- <uni-pagination :show-icon="true" :total="pagesTotal" :pageSize="1" /> -->
<scroll-view
scroll-x="true"
class="scroll-x head__scroll"
scroll-with-animation="true"
:scroll-left="scrollLeft"
>
<view
:class="{ 'active-page': index == currentSwiper }"
v-for="(item, index) in monthParams"
:key="index"
class="item head__scroll_item"
:ref="'item' + index"
@tap="onChangePages(item, index)"
>
{{ index + 1 }}
</view>
</scroll-view>
</view>
<view style="text-align: left; width: 30%">
<image
style="width: 50rpx; height: 50rpx; margin: 13rpx 0 13rpx 20rpx"
src="../../../static/images/workPlan/add.png"
@tap="onAddPages"
></image>
</view>
</view>
<view>
<uni-forms
class="form-container"
ref="form"
:modelValue="formData"
:rules="rules"
label-position="top"
label-width="200"
>
<uni-forms-item label="工程名称" style="margin-bottom: 2rpx" required>
<view class="time-container" @tap="onSelectProject">
<view>{{ projectName ? projectName : '请选择' }}</view>
<text v-if="!projectName">&gt;</text>
</view>
</uni-forms-item>
<uni-forms-item label="选择时间" required style="margin-bottom: 2rpx">
<view>
<!-- <TimeSelect /> -->
<picker mode="date" fields="month" @change="onDateChange" :value="DateValue">
<view class="time-container">
<view class="date-picker">{{ DateValue }}</view>
<text>&gt;</text>
</view>
</picker>
</view>
</uni-forms-item>
</uni-forms>
</view>
<!-- <scroll-view :scroll-y="true" style="height: 340px">
</scroll-view> -->
<view style="background-color: #fff" class="scroll-content-1">
<swiper circular :autoplay="false" :current="currentSwiper" style="height: 700rpx" @change="onSwiperChange">
<swiper-item v-for="(item, index) in monthParams" :key="index">
<scroll-view scroll-y="true" class="scroll-Y" style="height: 100%">
<uni-forms
class="form-container"
:ref="`monthPlanFormRef_${index}`"
:rules="monthPlanFormRules"
:model="item"
label-position="top"
label-width="200"
>
<uni-forms-item
v-for="(f, i) in monthPlanTitle === '基建月计划' ? infrastructureFormLabel : productionFormLabel"
:key="i"
:label="f.form_label"
:name="f.name"
required
>
<uni-easyinput
v-if="f.items_type === 'ipt'"
type="text"
v-model="item[f.name]"
placeholder="请填写"
/>
<uni-data-select
v-model="item[f.name]"
:localdata="f.options"
v-if="f.items_type === 'sel'"
></uni-data-select>
</uni-forms-item>
</uni-forms>
</scroll-view>
</swiper-item>
</swiper>
<!-- <view class="submit-btn">
<button>导入计划</button>
<button @tap="onSaveSubmit">保存提交</button>
</view> -->
</view>
<view class="bottom-btn">
<view>
<uni-icons type="cloud-upload" size="20"></uni-icons>
导入计划
</view>
<view @tap="onSaveSubmit">保存提交</view>
</view>
</view>
<!-- 查看报表 -->
<view v-show="activeIndex === '查看报表'" class="common-style">
<view class="report-form-header" v-if="monthDataList.length > 0">
<view>
<scroll-view scroll-x class="header-left">
<text
:class="{ 'active-form-page': activeFormPages === index }"
v-for="(item, index) in monthDataList"
:key="index"
@tap="onChangeFormPages(index)"
>
{{ index + 1 }}
</text>
</scroll-view>
</view>
<view class="header-right">
<scroll-view scroll-x style="width: 100%; white-space: nowrap">
<text v-if="kjsAmount > 0">可接受风险:{{ kjsAmount }}</text>
<text v-if="gfxAmount > 0">高风险:{{ gfxAmount }}</text>
<text v-if="zfxAmount > 0">中风险:{{ zfxAmount }}</text>
<text v-if="dfxAmount > 0">低风险:{{ dfxAmount }}</text>
<text v-if="tfxAmount > 0">特高风险:{{ tfxAmount }}</text>
</scroll-view>
</view>
</view>
<uni-forms ref="form-b" label-position="top" label-width="200">
<uni-forms-item label="工程名称" required>
<!-- <view class="time-container" @tap="onSelectProject">
<view>请选择</view>
<text>&gt;</text>
</view> -->
<uni-data-select
:clear="false"
:localdata="projectListSel"
@change="onChangeProjectSel"
:v-model="queryDataParams.proId"
></uni-data-select>
</uni-forms-item>
</uni-forms>
<view class="icon-search-time">
<text style="fon-size: 30rpx; margin-right: 25rpx" @tap="onReduceMonth">《</text>
<uni-icons type="left" size="20" @tap="onReduceDay"></uni-icons>
<view class="view-time">
<picker mode="date" @change="onChangeCurrentData" v-model="currentTime">
<view class="date-picker">{{ currentTime }}</view>
</picker>
</view>
<uni-icons type="right" size="20" @tap="onAddDay"></uni-icons>
<text style="fon-size: 30rpx; margin-left: 25rpx" @tap="onAddMonth">》</text>
<button @tap="onBackToday">返回本月</button>
</view>
<view class="pages">
<!-- <uni-pagination :show-icon="true" :total="1" /> -->
<swiper
circular
:autoplay="false"
:current="activeFormPages"
style="height: 700rpx"
@change="onSwiperChangeForms"
v-if="monthDataList.length > 0"
>
<swiper-item v-for="(item, index) in monthDataList" :key="index">
<scroll-view scroll-y="true" class="scroll-Y" style="height: 100%">
<uni-forms class="form-container" label-position="top" label-width="200">
<uni-forms-item
v-for="(f, i) in monthPlanTitle === '基建月计划' ? infrastructureFormLabel : productionFormLabel"
:key="i"
:label="f.form_label"
:name="f.name"
required
>
<uni-easyinput
v-if="f.items_type === 'ipt'"
:clear="false"
type="text"
v-model="item[f.name]"
disabled
/>
<uni-data-select
v-model="item[f.name]"
:localdata="f.options"
disabled
:clear="false"
v-if="f.items_type === 'sel'"
></uni-data-select>
</uni-forms-item>
</uni-forms>
</scroll-view>
</swiper-item>
</swiper>
</view>
</view>
<!-- 查看数据 -->
<view v-show="activeIndex === '查看数据'" class="common-style">
<uni-easyinput
prefixIcon="search"
v-model="queryDataParamsNew.keyword"
placeholder="搜索"
@iconClick="iconClick"
></uni-easyinput>
<uni-forms ref="form-b" label-position="top" label-width="200">
<uni-forms-item label="工程名称" required>
<view class="time-container" @tap="onViewSelectProject">
<view>{{ projectInPopupName ? projectInPopupName : '请选择' }}</view>
<text v-if="projectInPopupName">&gt;</text>
</view>
</uni-forms-item>
<uni-forms-item label="全部状态" required>
<view class="time-container" @tap="onSelectAllType">
<view>{{ projectQueryType ? projectQueryType : '请选择' }}</view>
<text v-if="projectQueryType">&gt;</text>
</view>
</uni-forms-item>
</uni-forms>
<scroll-view scroll-y style="height: 600rpx">
<view class="month-list" v-for="item in viewMonthPlanList" :key="item.id" @tap="onViewDetails(item)">
<view class="item-header">
<text v-if="item.kjsfx > 0">可接受风险:{{ item.kjsfx }}</text>
<text v-if="item.dfx > 0">低风险:{{ item.dfx }}</text>
<text v-if="item.zfx > 0">中风险:{{ item.zfx }}</text>
<text v-if="item.gfx > 0">高风险:{{ item.gfx }}</text>
<text v-if="item.tgfx > 0">特高风险:{{ item.tgfx }}</text>
<text>{{ item.planTime }}</text>
</view>
<view class="item-num">
<text>计划数量</text>
<text>{{ item.planCount }}</text>
</view>
<view class="item-time">
<text>提交人/提交时间</text>
<text>{{ item.upUser }}/{{ item.planTime }}</text>
<text>{{ onTypeChange(item.state) }}</text>
</view>
</view>
</scroll-view>
</view>
</view>
<!-- 弹框 -->
<uni-popup ref="popup" background-color="#fff">
<view class="popup-content" v-if="popupType === 'center'">
<view class="flex-style">
<text style="font-size: 16px">选择工程</text>
<uni-icons type="closeempty" size="30" @tap="onClosePopup"></uni-icons>
</view>
<view>{{ projectQueryParams.planTime }}</view>
<view class="search">
<view class="select">
<uni-data-select
v-model="projectQueryParams.state"
@change="onProjectChange"
:localdata="projectRange"
></uni-data-select>
</view>
<button @tap="onSearchProject">搜索</button>
</view>
<scroll-view scroll-y class="project-content">
<view v-for="item in projectList" :key="item.id" @tap="onChangeProject(item.id, item.name)">
{{ item.name }}
</view>
</scroll-view>
</view>
<view v-else class="popup-bottom-content">
<view class="bottom-title">
<text>请选择</text>
<text>请选择</text>
<uni-icons type="closeempty" size="20" @tap="onClosePopup"></uni-icons>
</view>
<view v-if="isType">
<view class="select-item" v-for="item in isAUditingList" :key="item.title" @tap="onCheckAuditing(item)">
{{ item.title }}
</view>
</view>
<view v-else class="scroll-select">
<scroll-view scroll-y="true" style="height: 100%">
<view
class="select-item"
v-for="item in projectListSel"
:key="item.value"
@tap="onChangeProjectInPopup(item)"
>
{{ item.text }}
</view>
</scroll-view>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
import TimeSelect from './components/time-select'
import {
setMonthPlanApi,
getProjectListApi,
getViewDataListApi,
getRiskLevelListApi,
getMonthPlanDataApi,
getControlLevelListApi
} from '../../../api/workPlan/monthPlan'
export default {
components: {
TimeSelect
},
data() {
return {
monthPlanTitle: '基建月计划',
activeIndex: '发起提交',
DateValue: this.$moment().format('YYYY-MM'),
pagesTotal: 1,
currentPage: 0,
popupType: '',
scrollHeight: 500,
formData: {},
isType: false,
currentTime: this.$moment().format('YYYY-MM'),
btnList: [
{ btn_title: '工作待办', isShow: ['24', '25'] },
{ btn_title: '发起提交', isShow: ['22', '23'] },
{ btn_title: '查看报表', isShow: ['22', '23'] },
{ btn_title: '查看数据', isShow: ['22', '23'] }
],
rules: {
name: {
rules: [{ required: true, errorMessage: '请填写' }]
},
gk: {
rules: [{ required: true, errorMessage: '请填写' }]
},
jd: {
rules: [{ required: true, errorMessage: '请填写' }]
},
nr: {
rules: [{ required: true, errorMessage: '请填写' }]
},
dj: {
rules: [{ required: true, errorMessage: '请填写' }]
}
},
monthPlanFormRules: {
zynr: {
rules: [{ required: true, errorMessage: '请填写作业内容' }]
},
zytj: {
rules: [{ required: true, errorMessage: '请填写作业条件' }]
},
fxlb: {
rules: [{ required: true, errorMessage: '请填写风险类型' }]
},
gkcs: {
rules: [{ required: true, errorMessage: '请填写管控措施' }]
},
fxdj: {
rules: [{ required: true, errorMessage: '请选择风险等级' }]
},
gkcj: {
rules: [{ required: true, errorMessage: '请选择管控级别' }]
},
wdgc: {
rules: [{ required: true, errorMessage: '请选择是否有危大/易造成较大伤亡作业' }]
},
fasp: {
rules: [{ required: true, errorMessage: '请选择方案是否报审' }]
},
swzy: {
rules: [{ required: true, errorMessage: '请选择是否有涉网作业' }]
},
sbtd: {
rules: [{ required: true, errorMessage: '请选择线路/设备停电计划是否上报 ' }]
},
xmfzr: {
rules: [{ required: true, errorMessage: '请填写项目负责人/联系电话' }]
},
dwfzr: {
rules: [{ required: true, errorMessage: '请填写单位负责人/联系电话' }]
},
planCount: {
rules: [{ required: true, errorMessage: '请填写计划数量' }]
}
},
infrastructureFormLabel: [
{ form_label: '作业内容', items_type: 'ipt', name: 'zynr' },
{ form_label: '作业条件(人员、机具、图纸、物资等、气候条件对作业的影响)', items_type: 'ipt', name: 'zytj' },
{ form_label: '风险类别', items_type: 'ipt', name: 'fxlb' },
{ form_label: '管控措施', items_type: 'ipt', name: 'gkcs' },
{
form_label: '风险等级',
items_type: 'sel',
name: 'fxdj',
options: []
},
{
form_label: '管控级别',
items_type: 'sel',
name: 'gkcj',
options: []
},
{
form_label: '是否有危大/易造成人员较大伤亡作业',
items_type: 'sel',
name: 'wdgc',
options: [
{ value: '1', text: '是' },
{ value: '0', text: '否' }
]
},
{
form_label: '方案是否报审',
items_type: 'sel',
name: 'fasp',
options: [
{ value: '1', text: '是' },
{ value: '0', text: '否' }
]
},
{
form_label: '是否有涉网作业',
items_type: 'sel',
name: 'swzy',
options: [
{ value: '1', text: '是' },
{ value: '0', text: '否' }
]
},
{
form_label: '线路/设备停电计划是否上报',
items_type: 'sel',
name: 'sbtd',
options: [
{ value: '1', text: '是' },
{ value: '0', text: '否' }
]
},
{ form_label: '项目负责人/联系电话', items_type: 'ipt', name: 'xmfzr' },
{ form_label: '单位负责人/联系电话', items_type: 'ipt', name: 'dwfzr' },
{ form_label: '计划数量', items_type: 'ipt', name: 'planCount' }
],
productionFormLabel: [
{ form_label: '作业内容', items_type: 'ipt' },
{ form_label: '实施单位', items_type: 'ipt' },
{ form_label: '实施部门', items_type: 'ipt' },
{ form_label: '任务来源', items_type: 'ipt' },
{
form_label: '作业类型',
items_type: 'sel',
options: [
{ value: 0, text: '检修' },
{ value: 1, text: '维护' }
]
},
{ form_label: '计划开始时间', items_type: 'sel' },
{ form_label: '计划结束时间', items_type: 'sel' },
{
form_label: '是否停电',
items_type: 'sel',
options: [
{ value: 1, text: '是' },
{ value: 0, text: '否' }
]
},
{ form_label: '停电设备(作业场所)', items_type: 'ipt' },
{ form_label: '作业监督人/联系电话', items_type: 'ipt' },
{ form_label: '作业负责人/联系电话', items_type: 'ipt' },
{
form_label: '管控级别',
items_type: 'sel',
options: []
},
{
form_label: '风险等级',
items_type: 'sel',
options: [
{ value: 0, text: '可接受风险' },
{ value: 1, text: '低风险' },
{ value: 2, text: '中风险' },
{ value: 2, text: '高风险' },
{ value: 2, text: '特高风险' }
]
},
{
form_label: '管控方式(根据作业内容在作业文件栏中选择"是"、"否"',
items_type: 'sel',
options: [
{ value: 0, text: '过程管控' },
{ value: 1, text: '巡视管控' },
{ value: 2, text: '驻点管控' },
{ value: 2, text: '节点管控' }
]
},
{
form_label: '施工方案',
items_type: 'sel',
options: [
{ value: 1, text: '是' },
{ value: 0, text: '否' }
]
},
{
form_label: '作业指导书',
items_type: 'sel',
options: [
{ value: 0, text: '是' },
{ value: 1, text: '否' }
]
},
{
form_label: '作业表单',
items_type: 'sel',
options: [
{ value: 0, text: '是' },
{ value: 1, text: '否' }
]
},
{
form_label: '工作票',
items_type: 'sel',
options: [
{ value: 0, text: '是' },
{ value: 1, text: '否' }
]
},
{ form_label: '备注', items_type: 'ipt' },
{ form_label: '计划数量', items_type: 'ipt' }
],
currentSwiper: 0,
projectQueryParams: {
planTime: this.$moment().format('YYYY-MM-DD'),
type: 3,
state: ''
},
projectRange: [
{ value: '', text: '全部' },
{ value: '0', text: '未填报' },
{ value: '1', text: '已填报' }
],
isAUditingList: [
{ title: '未审核', value: '2' },
{ title: '已审核', value: '1' }
],
searchValue: '',
projectList: [],
projectListSel: [],
queryDataParams: {
proId: '',
month: ''
},
projectName: '',
projectId: '',
roles: uni.getStorageSync('wkRole'),
paramsItem: {
proName: '',
month: '',
zynr: '',
zytj: '',
fxlb: '',
gkcs: '',
fxdj: '',
gkcj: '',
wdgc: '',
fasp: '',
swzy: '',
sbtd: '',
xmfzr: '',
dwfzr: '',
planCount: ''
},
monthParams: [
{
proName: '',
month: '',
zynr: '',
zytj: '',
fxlb: '',
gkcs: '',
fxdj: '',
gkcj: '',
wdgc: '',
fasp: '',
swzy: '',
sbtd: '',
xmfzr: '',
dwfzr: '',
planCount: ''
}
],
monthDataList: [],
projectInPopupName: '',
projectQueryType: '',
queryDataParamsNew: {
proId: '',
month: '',
state: '',
keyword: ''
},
viewMonthPlanList: [],
scrollLeft: 0,
activeFormPages: 0,
kjsAmount: 0,
dfxAmount: 0,
zfxAmount: 0,
gfxAmount: 0,
tfxAmount: 0
}
},
mounted() {
// console.log('this.$refs.btnHeaderRef', this.$refs.btnHeaderRef, this.$refs.pagesAddRef)
const query = uni.createSelectorQuery()
query
.select('#btnHeaderRef')
.boundingClientRect(data => {
this.scrollHeight += data.height
})
.exec()
query
.select('#pagesAddRef')
.boundingClientRect(data => {
this.scrollHeight += data.height
})
.exec()
// console.log('this.scrollHeight', this.scrollHeight)
// this.getProjectListData()
this.projectList = this.$store.state.workPlan.projectList
// 获取工程
this.getProjectListData()
// 获取风险等级
this.getRiskLevelListData()
// 获取管控层级
this.getControlLevelListData()
const this_ = this
uni.$on('update', function () {
this_.getViewDataList()
})
},
onUnload() {
uni.$off('update')
},
methods: {
leftClick() {
uni.navigateBack()
},
onTapCheck(i) {
this.activeIndex = i
},
/* 减少页数 */
onReducePages() {
if (this.pagesTotal > 1) {
if (this.currentSwiper + 1 === this.pagesTotal) {
this.currentSwiper -= 1
}
this.pagesTotal -= 1
this.monthParams.splice(this.monthParams.length - 1, 1)
}
},
/* 增加页数 */
onAddPages() {
this.pagesTotal += 1
// this.monthParams.push(this.paramsItem)
// this.monthParams.splice(this.pagesTotal - 1, 0, this.paramsItem)
this.monthParams.push({ ...this.paramsItem })
},
/* 页码数字点击 */
// onChangePages(num) {
// this.currentSwiper = num - 1
// // if (num > 1) {
// // console.log('居中')
// // }
// },
onSelectProject() {
this.$refs.popup.open('center')
this.popupType = 'center'
},
onClosePopup() {
this.$refs.popup.close()
if (this.isType) {
this.isType = !this.isType
}
},
onSwiperChange(e) {
// this.currentPage = e.detail.current + 1
this.currentSwiper = e.detail.current
},
onCheckAuditing(val) {
// console.log(val, '----')
this.projectQueryType = val.title
this.queryDataParamsNew.state = val.value
this.getViewDataList()
this.onClosePopup()
},
/* 保存提交 */
async onSaveSubmit() {
// 表单校验
if (!this.projectId) {
uni.showToast({ icon: 'none', title: '请选择工程!' })
return
}
try {
const validateForms = async () => {
for (let index = 0; index < this.monthParams.length; index++) {
const valid = await new Promise(resolve => {
this.$refs[`monthPlanFormRef_${index}`][0].validate(resolve)
})
if (valid) {
uni.showToast({ title: `${index + 1}页有数据未完!`, icon: 'none' })
this.currentSwiper = index
throw new Error()
}
}
}
validateForms()
.then(async res => {
this.monthParams.forEach(e => {
e.proName = this.projectId
e.month = this.DateValue
})
const saveParams = {
id: JSON.stringify(this.monthParams),
user: '',
state: '1'
}
console.log('saveParams保存参数', saveParams)
const result = await setMonthPlanApi(saveParams)
if (result.res == 1) {
uni.showToast({ icon: 'none', title: '保存成功!' })
setTimeout(() => {
uni.navigateBack()
}, 500)
} else {
uni.showToast({ icon: 'none', title: `保存失败,${result.resMsg}` })
}
})
.catch(error => {
console.log('校验未通过!')
})
} catch (error) {}
},
onReduceMonth() {
this.currentTime = this.$moment(this.currentTime).subtract(1, 'year').format('YYYY-MM')
this.getMonthPlanData()
},
onReduceDay() {
this.currentTime = this.$moment(this.currentTime).subtract(1, 'months').format('YYYY-MM')
this.getMonthPlanData()
},
onAddMonth() {
this.currentTime = this.$moment(this.currentTime).add(1, 'year').format('YYYY-MM')
this.getMonthPlanData()
},
onAddDay() {
this.currentTime = this.$moment(this.currentTime).add(1, 'months').format('YYYY-MM')
this.getMonthPlanData()
},
onBackToday() {
this.currentTime = this.$moment().format('YYYY-MM')
this.getMonthPlanData()
},
iconClick() {
this.getViewDataList()
},
onChangeCurrentData(e) {
this.currentTime = e.detail.value
},
onViewSelectProject() {
this.$refs.popup.open('bottom')
this.popupType = 'bottom'
},
onSelectAllType() {
this.$refs.popup.open('bottom')
this.popupType = 'bottom'
this.isType = true
},
onProjectChange() {
console.log('jjj')
},
onChangeProject(id, name) {
this.projectName = name
this.projectId = id
this.onClosePopup()
},
async getRiskLevelListData() {
const res = await getRiskLevelListApi()
try {
this.infrastructureFormLabel.forEach(e => {
if (e.form_label === '风险等级') {
e.options = res.map(e => {
return {
value: e.id,
text: e.name
}
})
throw new Error()
}
})
} catch (error) {}
},
async getControlLevelListData() {
const res = await getControlLevelListApi()
// console.log('管控层级', res)
try {
this.infrastructureFormLabel.forEach(e => {
if (e.form_label === '管控级别') {
e.options = res.map(e => {
return {
value: e.id,
text: e.name
}
})
throw new Error()
}
})
} catch (error) {}
},
/* 搜索工程 */
async onSearchProject() {
const res = await getProjectListApi(this.projectQueryParams)
this.projectList = res.obj
},
onDateChange(e) {
this.DateValue = e.detail.value
},
/* 查看报表数据 */
async getMonthPlanData() {
this.queryDataParams.month = this.currentTime
if (this.queryDataParams.proId == '') {
uni.showToast({ icon: 'none', title: '请选择工程!' })
return
}
console.log('this.queryDataParams查询报表的参数', this.queryDataParams)
const res = await getMonthPlanDataApi(this.queryDataParams)
console.log('res---查看的报表数据', res)
if (res.obj.length < 1) {
uni.showToast({ icon: 'none', title: '暂无月计划数据!' })
}
this.monthDataList = res.obj
this.activeFormPages = 0
if (this.monthDataList.length > 0) {
this.kjsAmount = 0
this.dfxAmount = 0
this.zfxAmount = 0
this.gfxAmount = 0
this.tfxAmount = 0
this.monthDataList.forEach(e => {
this.kjsAmount = this.kjsAmount + e.kjsfx * 1
this.dfxAmount = this.dfxAmount + e.dfx * 1
this.zfxAmount = this.zfxAmount + e.zfx * 1
this.gfxAmount = this.gfxAmount + e.gfx * 1
this.tfxAmount = this.tfxAmount + e.tgfx * 1
})
}
},
/* 查看报表页面工程选择事件 */
onChangeProjectSel(value) {
this.queryDataParams.proId = value
this.getMonthPlanData()
},
/* 获取工程列表 */
async getProjectListData() {
const res = await getProjectListApi({
planTime: this.$moment().format('YYYY-MM-DD'),
type: 3,
state: ''
})
this.projectListSel = res.obj.map(e => {
return {
text: e.name,
value: e.id
}
})
},
onChangeProjectInPopup(item) {
this.projectInPopupName = item.text
this.queryDataParamsNew.proId = item.value
this.getViewDataList()
this.onClosePopup()
},
/* 获取查看数据中的数据 */
async getViewDataList() {
// console.log('搜索参数', this.queryDataParamsNew)
const res = await getViewDataListApi(this.queryDataParamsNew)
console.log('res查看数据中的数据', res)
this.viewMonthPlanList = res.obj
},
/* 处理枚举状态 */
onTypeChange(type) {
let typeString = ''
switch (type) {
case '0':
typeString = '填报待提交'
break
case '1':
typeString = '填报已撤回'
break
case '2':
typeString = '填报已提交'
break
case '3':
typeString = '项目部已撤回'
break
case '4':
typeString = '分公司审核中'
break
case '5':
typeString = '分公司未通过'
break
case '6':
typeString = '分公司通过'
break
case '7':
typeString = '总公司审核中'
break
case '8':
typeString = '总公司未通过'
break
case '9':
typeString = '总公司通过'
break
case '10':
typeString = '总公司全部通过'
break
}
return typeString
},
/* 查看数据点击进入详情 */
onViewDetails(item) {
console.log('点击跳转', item)
uni.navigateTo({
url: `/pages/workPlan/monthPlanDetails/index?id=${item.id}&state=${item.state}&month=${item.planTime}`
})
},
/* 元素居中 */
onChangePages(value, ind) {
this.currentSwiper = ind
// this.currentSwiper = num - 1
// 获取当前选中元素的位置
const query = uni.createSelectorQuery().in(this)
query
.select(`.item:nth-child(${ind + 1})`)
.boundingClientRect(rect => {
const viewWidth = uni.getSystemInfoSync().windowWidth // 获取视图宽度
const itemWidth = rect.width // 选中元素的宽度
const itemLeft = rect.left // 选中元素的左边距
// 计算滚动位置,使选中元素居中
const targetScrollLeft = itemLeft - viewWidth / 2 + itemWidth / 2
this.scrollLeft = targetScrollLeft < 0 ? 0 : targetScrollLeft // 防止超出边界
})
.exec()
},
onChangeFormPages(index) {
this.activeFormPages = index
},
onSwiperChangeForms(e) {
this.activeFormPages = e.detail.current
},
/* 计算高度 */
async calcScrollHeight(dom, bottom) {
let that = this
let scrollHeight = 0
new Promise((resolve, reject) => {
uni.getSystemInfo({
//调用uni-app接口获取屏幕高度
success(res) {
//成功回调函数
that._data.pH = res.windowHeight
let titleH = uni.createSelectorQuery().select(dom)
if (bottom) {
let bottomDom = uni.createSelectorQuery().select(bottom)
bottomDom
.boundingClientRect(res => {
const bottomHeight = res.height
titleH
.boundingClientRect(data => {
let pH = that._data.pH
scrollHeight = pH - data.top - bottomHeight
resolve(scrollHeight)
})
.exec()
})
.exec()
} else {
titleH
.boundingClientRect(data => {
let pH = that._data.pH
scrollHeight = pH - data.top
resolve(scrollHeight)
})
.exec()
}
}
})
})
// return scrollHeight
}
},
onLoad(options) {
if (options.type == 1) {
this.monthPlanTitle = '基建月计划'
} else {
this.monthPlanTitle = '生产月计划'
}
},
onReady() {
this.calcScrollHeight('.scroll-content-1', '.bottom-btn').then(res => {
console.log('res---', res)
})
// console.log('content_1content_1', content_1)
}
}
</script>
<style lang="scss" scoped>
.month-container {
height: 100vh;
.month-content {
position: relative;
.bottom-btn {
width: 100%;
height: 80rpx;
position: fixed;
bottom: 6px;
left: 0;
display: flex;
align-items: center;
justify-content: space-between;
background-color: #fff;
}
.bottom-btn view:first-child {
display: flex;
flex-direction: column;
margin-left: 30rpx;
// justify-content: center;
align-items: center;
font-size: 14px;
}
.bottom-btn view:last-child {
width: 75%;
height: 60rpx;
margin-right: 40rpx;
line-height: 60rpx;
text-align: center;
color: #fff;
background-color: #003778;
border-radius: 14rpx;
}
.btn-header {
display: flex;
width: 100%;
button {
flex: 1;
height: 120rpx;
color: #2c2b2b;
font-size: 26rpx;
line-height: 120rpx;
text-align: center;
border-radius: 0;
background-color: #fff;
}
button::after {
border: none;
}
.active {
border-bottom: 2px solid #00337a;
}
}
.content-2 {
width: 100%;
.pages-add {
width: 100%;
height: 76rpx;
display: flex;
align-items: center;
background-color: #ccc;
view {
height: 76rpx;
}
.num-content {
flex: 1;
background-color: #fff;
.scroll-x {
width: 100%;
white-space: nowrap;
view {
width: 50%;
display: inline-block;
height: 76rpx;
text-align: center;
line-height: 76rpx;
color: #003778;
}
.active-page {
border-bottom: 1px solid #003778;
}
}
}
}
.time-container {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 38rpx;
}
.form-container {
padding: 10rpx 20rpx;
}
.submit-btn {
margin: 15rpx 0;
}
}
}
.common-style {
padding: 15rpx;
}
.time-container {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10rpx 38rpx;
}
// 弹框样式
.popup-content {
width: 90vw;
padding: 20rpx;
background-color: #eeeeee;
.search {
width: 100%;
height: 90rpx;
margin-bottom: 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
background-color: #fff;
.select {
height: 68rpx;
width: 65%;
margin-left: 10rpx;
}
button {
height: 60rpx;
width: 25%;
line-height: 60rpx;
font-size: 28rpx;
background-color: #003777;
color: #fff;
border-radius: 12rpx;
}
}
.project-content {
height: 460rpx;
width: 97%;
margin: 0 auto;
background-color: #fff;
text-align: center;
view {
padding: 16rpx 0;
border: 1px solid #eee;
}
}
}
}
.flex-style {
display: flex;
align-content: center;
justify-content: space-between;
}
.icon-search-time {
width: 100%;
height: 68rpx;
display: flex;
align-items: center;
justify-content: space-between;
font-weight: bold;
button {
margin-right: 60rpx;
height: 65rpx;
background-color: #003777;
color: #fff;
line-height: 65rpx;
font-weight: normal;
font-size: 30rpx;
}
.view-time {
margin: 0 35rpx;
}
}
.popup-content {
width: 90vw;
padding: 20rpx;
background-color: #eeeeee;
.search {
width: 100%;
height: 70rpx;
display: flex;
align-items: center;
justify-content: space-between;
background-color: #eeeeee;
.select {
height: 68rpx;
width: 65%;
margin: 0;
}
button {
height: 68rpx;
width: 30%;
line-height: 68rpx;
font-size: 32rpx;
background-color: #003777;
color: #fff;
border-radius: 12rpx;
}
}
.project-content {
height: 460rpx;
width: 97%;
margin: 0 auto;
background-color: #fff;
}
}
.select-item {
height: 90rpx;
line-height: 90rpx;
text-align: center;
border-bottom: 1px solid #ccc;
}
.select-item:hover {
background-color: rgb(224, 239, 249);
}
.popup-bottom-content {
height: 50vh;
.bottom-title {
height: 90rpx;
padding-right: 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #ccc;
}
.bottom-title text:first-child {
color: transparent;
}
.scroll-select {
height: calc(50vh - 90rpx);
}
.select-item {
height: 90rpx;
line-height: 90rpx;
text-align: center;
border-bottom: 1px solid #ccc;
}
.select-item:hover {
background-color: rgb(224, 239, 249);
}
}
::v-deep .uni-input-input:disabled {
-webkit-text-fill-color: #333;
}
.month-list {
width: 100%;
margin-top: 16rpx;
background-color: #fff;
.item-header {
width: 96%;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
padding: 10rpx 0;
font-size: 22rpx;
border-bottom: 1px solid #ccc;
}
.item-num,
.item-time {
width: 96%;
margin: 0 auto;
padding: 12rpx 0;
display: flex;
// align-items: center;
justify-content: space-between;
font-size: 26rpx;
}
.item-num {
margin-top: 18rpx;
}
.item-num text:last-child {
width: 60%;
text-align: left;
}
.item-num text:first-child .item-time text:first-child {
width: 30%;
}
.item-time text {
width: 30%;
}
.item-time text:last-child {
text-align: right;
}
}
.report-form-header {
display: flex;
align-items: center;
view {
width: 70%;
}
.header-right {
text-align: right;
display: flex;
justify-content: flex-end;
align-items: center;
text {
margin-left: 16rpx;
padding: 12rpx 0;
}
}
}
.report-form-header view:first-child {
width: 30%;
background-color: #fff;
.header-left {
width: 100%;
display: flex;
white-space: nowrap;
text {
width: 50%;
padding: 12rpx 0;
text-align: center;
display: inline-block;
color: #ccc;
}
}
.active-form-page {
border-bottom: 1px solid #003778;
color: #003778 !important;
}
}
</style>