hn_ldlz/ldlz-H5/pages/aqlz/engineering.vue

309 lines
7.0 KiB
Vue

<template>
<page-meta :page-font-size="$store.state.vuex_fontsize+'px'"
:root-font-size="$store.state.vuex_fontsize+'px'"></page-meta>
<view>
<view class="qj-box">
<view class="uni-padding-wrap uni-common-mt">
<uni-segmented-control :current="current" :values="items" style-type="text" @clickItem="onClickItem"
activeColor="#00b27b" />
</view>
</view>
<view class="xtgc" v-if="current === 0">
<view style="width: 100%;display: flex;align-items: center;">
<view class="picker-box" style="width: 50%;">
<picker mode="selector" :range="companyData" :range-key="'label'" @change="onMonthChange">
<view class="picker" style="width: 100%;">
<view>
{{selectedCompany}}
</view>
<u-icon name="arrow-down"></u-icon>
</view>
</picker>
</view>
<view classs="search-box" style="width: 50%;">
<uni-search-bar @confirm="search" :focus="true" v-model="searchValue" cancelButton="none" @clear="clear"
bgColor="#ffffff" style="width: 100%;">
</uni-search-bar>
</view>
</view>
<view>
<uni-section title="选择履职工程" type="line">
<uni-list>
<uni-list-item v-for="(item,index) in projData" :key="index" :title="item.name"
:note="(item.companyName||'')+'\n\r'+(item.lzNameAndCount||'')" :rightText="item.lzType==1?'上次履职':''"
clickable @click="onClick(item)">
</uni-list-item>
</uni-list>
</uni-section>
</view>
</view>
<view class="myxtgc" v-if="current === 1">
<view style="width: 100%;display: flex;align-items: center;">
<view class="picker-box" style="width: 50%;">
<picker mode="selector" :range="companyData" :range-key="'label'" @change="onMonthChange">
<view class="picker" style="width: 100%;">
<view>
{{selectedCompany}}
</view>
<u-icon name="arrow-down"></u-icon>
</view>
</picker>
</view>
<view classs="search-box" style="width: 50%;">
<uni-search-bar @confirm="search" :focus="true" v-model="searchValue" cancelButton="none" @clear="clear"
bgColor="#ffffff" style="width: 100%;">
</uni-search-bar>
</view>
</view>
<view style="width: 100%;">
<view classs="search-box">
<u-button type="success" text="添加工程" @click="addProj" size="mini"
style="background-color:#00b27b;border-color:#00b27b;"></u-button>
</view>
</view>
<view>
<uni-section title="选择履职工程" type="line">
<uni-list>
<uni-list-item v-for="(item,index) in projData" :key="index" :title="item.name" :note="item.companyName"
:rightText="item.lzType==1?'上次履职':''" clickable @click="onClick(item)">
</uni-list-item>
</uni-list>
</uni-section>
</view>
</view>
</view>
</template>
<script>
import {
projectAppList,
companyTreeSelect
} from '@/api/handbook.js'
export default {
data() {
return {
id: "", // 页面id
address: "", // 地图页面的地址
otherUser: "", // 同行人
projectName: "", // 工程名称
items: ['系统工程', '添加的工程'],
current: 0,
searchValue: '',
selectedCompany: '选择分公司', // 默认选择分公司
selectedCompanyId: '',
projData: [], // 分公司数组
companyData: [],
fromType: 2,
}
},
onLoad(option) {
// this.id = option.id;
// this.address = option.address ? option.address : '';
// this.otherUser = option.otherUser ? option.otherUser : '';
// this.projectName = option.projectName ? option.projectName : '';
this.companyTreeSelect();
},
onShow() {
this.projectList();
},
methods: {
projectList() {
projectAppList({
pageSize: 999999,
pageNum: 1,
fromType: this.fromType,
searchValue: this.searchValue,
companyId: this.selectedCompanyId
}).then(res => {
this.projData = res.rows;
})
},
search(res) {
this.projectList()
},
clear(res) {
this.projectList()
},
// 查询分公司
companyTreeSelect() {
this.companyData = [{
label: '选择分公司',
value: "",
}]
companyTreeSelect({}).then(res => {
res.rows.forEach(e => {
this.companyData.push({
label: e.deptName,
value: e.deptId,
})
})
})
},
onMonthChange(e) {
// 选中年份变更时触发
this.selectedCompany = this.companyData[e.detail.value].label;
this.selectedCompanyId = this.companyData[e.detail.value].value;
console.log(this.selectedCompanyId, this.companyData[e.detail.value]);
this.projectList();
},
onClick(e) {
this.$store.commit('SET_PROJ', {
name: e.name,
id: e.id,
companyId: e.companyId,
companyName: e.companyName,
})
uni.navigateBack({
delta: 1
})
// uni.navigateTo({
// url: '/pages/aqlz/detail?id=' + this.id + "&address=" + this.address + "&otherUser=" + this
// .otherUser +
// "&projectName=" + e
// })
},
onClickItem(e) {
if (this.current !== e.currentIndex) {
this.current = e.currentIndex
}
this.selectedCompany = this.companyData[0].label;
this.selectedCompanyId = this.companyData[0].value;
if (this.current == 1) {
this.fromType = 1;
} else {
this.fromType = 2;
}
this.projectList();
},
addProj() {
uni.navigateTo({
url: '/pages/aqlz/addProject'
})
}
}
}
</script>
<style lang="scss" scoped>
uni-page-body {
height: 100%;
padding: 5px;
}
.picker {
background-color: #ffffff;
box-sizing: border-box;
border: #e4e4e4 solid 1px;
border-radius: 10rpx;
width: 115px;
height: 35px;
font-size: 11px;
line-height: 35px;
padding-left: 10px;
padding-right: 10px;
display: flex;
justify-content: space-between;
}
.qj-box {
background-color: white;
border-radius: 10rpx;
margin-top: 2px;
}
.leave-one {
background-color: #ffffff;
box-sizing: border-box;
border: #f2f2f2 solid 1px;
border-radius: 16rpx;
margin-top: 10px;
padding: 10rpx 20rpx;
.leave-one-top {
display: flex;
justify-content: space-between;
border-bottom: #f2f2f2 solid 1px;
padding: 16rpx 30rpx;
.top-left {
color: #66B1FF;
font-weight: bold;
font-size: 11px;
}
.top-right {
color: #999999;
font-size: 11px;
}
}
.leave-one-content {
padding: 0 30rpx;
font-size: 11px;
color: #333333;
line-height: 25px;
.btns {
color: #66B1FF;
width: 40px;
}
}
}
::v-deep .uni-searchbar__box {
border: 1px solid #ededed;
}
::v-deep .uni-section .uni-section-header__content {
font-weight: bold;
}
::v-deep .uni-section .uni-section-header__decoration {
background-color: #00b37d;
}
::v-deep .uni-list-item__container {
padding: 9px 15px;
}
::v-deep .segmented-control__text {
font-size: 15px;
}
::v-deep .picker {
overflow: hidden;
}
::v-deep .uni-section__content-title {
font-size: 14px !important;
}
::v-deep .uni-input-input {
font-size: 11px !important;
}
::v-deep .input-placeholder {
font-size: 11px !important;
}
::v-deep .u-button__text{
font-size:14px !important;
}
</style>