工作任务
This commit is contained in:
@@ -32,6 +32,7 @@ export default {
|
||||
return {
|
||||
configList: {
|
||||
resident: {url: "/components/pages/selectResident", label: "name"},
|
||||
residentMultiple: {url: "/components/pages/selectResidentMultiple", label: "name"},
|
||||
sysUser: {url: "/components/pages/selectSysUser", label: "name"},
|
||||
gird: {url: "/components/pages/selectGird", label: "girdName"},
|
||||
party: {url: "/components/pages/selectParty", label: "name"},
|
||||
|
||||
194
src/components/pages/selectResidentMultiple.vue
Normal file
194
src/components/pages/selectResidentMultiple.vue
Normal file
@@ -0,0 +1,194 @@
|
||||
<template>
|
||||
<div class="selectResident">
|
||||
<!-- <AiTopFixed> -->
|
||||
<div class="search-top">
|
||||
<u-search placeholder="搜索" v-model="name" :show-action="false" bg-color="#fff" search-icon-color="#E2E8F1"
|
||||
color="#666" height="72" @search="getSearchList" @clear="handerClear" @change="getList"></u-search>
|
||||
</div>
|
||||
<!-- </AiTopFixed> -->
|
||||
<div class="user-list">
|
||||
<template v-if="list.length>0">
|
||||
<div class="item" v-for="(item, index) in list" :key="index">
|
||||
<div class="select-img" @click="checkClick(index)">
|
||||
<img :src="item.isCheck ? checkIcon : cirIcon" alt="">
|
||||
</div>
|
||||
<div class="user-info">
|
||||
<img :src="item.photo" alt="" v-if="item.photo">
|
||||
<img src="./img/user-img.png" alt="" v-else>{{ item.name }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<AiEmpty v-else/>
|
||||
</div>
|
||||
<div class="pad-b118"></div>
|
||||
<div class="footer">
|
||||
<div class="btn" @click="confirm">确定选择</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapState} from 'vuex'
|
||||
|
||||
export default {
|
||||
name: "selectResident",
|
||||
appName: "人员选择器(居民档案)",
|
||||
data() {
|
||||
return {
|
||||
current: 1,
|
||||
name: '',
|
||||
list: [],
|
||||
cirIcon: require('./img/xz.png'),
|
||||
checkIcon: require('./img/xzh.png'),
|
||||
selected: [],
|
||||
isSingle: false, //是否单选
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
},
|
||||
onLoad(query) {
|
||||
if (query.selected) {
|
||||
this.selected = query.selected?.split(",") || []
|
||||
}
|
||||
this.isSingle = query.single || false
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.$instance.post(`/app/appresident/list`, null, {
|
||||
params: {
|
||||
current: this.current,
|
||||
size: 20,
|
||||
areaId: this.user.areaId,
|
||||
con: this.name
|
||||
}
|
||||
}).then(res => {
|
||||
if (res?.data) {
|
||||
res.data.records.forEach(e => {
|
||||
e.isCheck = this.selected.includes(e.idNumber)
|
||||
})
|
||||
if (this.current > 1 && this.current > res.data.pages) {
|
||||
return
|
||||
}
|
||||
this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records
|
||||
}
|
||||
})
|
||||
},
|
||||
checkClick(index) {
|
||||
this.list[index].isCheck = !this.list[index].isCheck
|
||||
},
|
||||
confirm() {
|
||||
let checkList = []
|
||||
this.list.map((item) => {
|
||||
if (item.isCheck) {
|
||||
checkList.push(item)
|
||||
}
|
||||
})
|
||||
if (!checkList.length) {
|
||||
return this.$u.toast('请先选择人员')
|
||||
} else {
|
||||
uni.navigateBack({
|
||||
success: () => {
|
||||
uni.$emit("pagePicker:residentMultiple", checkList)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
handerClear() {
|
||||
this.current = 1
|
||||
this.name = ''
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.current++
|
||||
this.getList()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.selectResident {
|
||||
::v-deep .AiTopFixed .u-search {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.pad-b118 {
|
||||
padding-bottom: 118px;
|
||||
}
|
||||
|
||||
.search-top {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 16px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #E4E5E6;
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
.user-list {
|
||||
background-color: #fff;
|
||||
padding-top: 100px;
|
||||
.item {
|
||||
.select-img {
|
||||
display: inline-block;
|
||||
|
||||
img {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
margin: 12px 36px 12px 30px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
.user-info {
|
||||
display: inline-block;
|
||||
padding: 20px 0 20px 0;
|
||||
width: calc(100% - 114px);
|
||||
height: 100%;
|
||||
border-bottom: 1px solid #E4E5E6;
|
||||
font-size: 36px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
line-height: 74px;
|
||||
|
||||
img {
|
||||
width: 74px;
|
||||
height: 74px;
|
||||
border-radius: 8px;
|
||||
margin-right: 34px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
width: 100%;
|
||||
height: 118px;
|
||||
background: #F4F8FB;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
text-align: right;
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
width: 192px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
background: #1365DD;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #FFF;
|
||||
margin: 20px 34px 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -57,12 +57,11 @@ export default {
|
||||
...mapState(['user']),
|
||||
},
|
||||
onLoad(query) {
|
||||
console.log(query)
|
||||
this.query = query
|
||||
if (query.selected) {
|
||||
this.selected = query.selected?.split(",") || []
|
||||
}
|
||||
this.isSingle = query.single || false
|
||||
this.isSingle = query.single == 'false' ? false : true
|
||||
this.nodeKey = query.nodeKey || "idNumber"
|
||||
this.isRequire = query.isRequire || 1
|
||||
this.isShowPhone = query.isShowPhone || false
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
<div class="item" v-if="houseInfo.livingStatus == 1">
|
||||
<span class="label">起租日期</span>
|
||||
<div class="value" @click="dateShow=true">
|
||||
<span :class="houseInfo.startDate === '' ? 'color-999' : ''">{{ $dateFormat(houseInfo.startDate,'YYYY-MM-DD') || '请选择' }}</span>
|
||||
<span :class="houseInfo.startDate === '' ? 'color-999' : ''">{{ houseInfo.startDate.substring(0, 12) || '请选择' }}</span>
|
||||
<u-icon name="arrow-right" color="#cccccc" size="14"/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -64,7 +64,7 @@
|
||||
<div class="line-bg"/>
|
||||
<div class="title">
|
||||
<span class="tips"/>房主信息
|
||||
<AiPagePicker class="select" :selected.sync="houseInfo.owner">选择人员</AiPagePicker>
|
||||
<AiPagePicker class="select" type="residentMultiple" @select="handleOwner">选择人员</AiPagePicker>
|
||||
</div>
|
||||
<div class="pad-l32">
|
||||
<div class="item" v-for="(item, index) in houseInfo.owner" :key="index">
|
||||
@@ -81,7 +81,7 @@
|
||||
<div class="line-bg"/>
|
||||
<div class="title">
|
||||
<span class="tips"/>承租人信息
|
||||
<AiPagePicker class="select" :selected.sync="houseInfo.renter">选择人员</AiPagePicker>
|
||||
<AiPagePicker class="select" type="residentMultiple" @select="handleRenter">选择人员</AiPagePicker>
|
||||
</div>
|
||||
<div class="pad-l32">
|
||||
<div class="item" v-for="(item, index) in houseInfo.renter" :key="index">
|
||||
@@ -98,7 +98,7 @@
|
||||
<div class="line-bg"/>
|
||||
<div class="title">
|
||||
<span class="tips"/>实际居住人员
|
||||
<AiPagePicker class="select" :selected.sync="houseInfo.live">选择人员</AiPagePicker>
|
||||
<AiPagePicker class="select" type="residentMultiple" @select="handleLive">选择人员</AiPagePicker>
|
||||
</div>
|
||||
<div class="pad-l32">
|
||||
<div class="item" v-for="(item, index) in houseInfo.live" :key="index">
|
||||
@@ -171,7 +171,7 @@ export default {
|
||||
},
|
||||
getDetail() {
|
||||
// let {id} = this.$route.query
|
||||
id && this.$instance.post(`/app/appcommunityhouseinfo/queryDetailById?id=${this.id}`).then(res => {
|
||||
this.$instance.post(`/app/appcommunityhouseinfo/queryDetailById?id=${this.id}`).then(res => {
|
||||
if (res?.data) {
|
||||
this.houseInfo = res.data
|
||||
}
|
||||
@@ -197,6 +197,15 @@ export default {
|
||||
},
|
||||
dateConfirm(e) {
|
||||
this.houseInfo.startDate = `${e.year}-${e.month}-${e.day} 00:00:00`
|
||||
},
|
||||
handleOwner(e) {
|
||||
this.houseInfo.owner = e
|
||||
},
|
||||
handleRenter(e) {
|
||||
this.houseInfo.renter = e
|
||||
},
|
||||
handleLive(e) {
|
||||
this.houseInfo.live = e
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -71,7 +71,7 @@
|
||||
<div class="row-item center">
|
||||
<span class="right-line"></span>
|
||||
<span class="left-line"></span>
|
||||
<h3>{{ $dateFormat(houseInfo.startDate, 'YYYY-MM-DD') }}</h3>
|
||||
<h3>{{ houseInfo.startDate.substring(0, 10) }}</h3>
|
||||
<p>起租日期</p>
|
||||
</div>
|
||||
<div class="row-item right">
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<!-- <AiTopFixed>
|
||||
<u-tabs :list="tabs" height="88" bar-width="136" :current="index" @change="change"></u-tabs>
|
||||
</AiTopFixed> -->
|
||||
<u-navbar back-icon-color="#000" title="特殊人群" title-color="#000" title-width="300" title-size="32"
|
||||
<u-navbar back-icon-color="#000" title="工作任务" title-color="#000" title-width="300" title-size="32"
|
||||
:title-bold="true" :background="backgroundNavbar" :is-fixed="true" height="44" z-index="999">
|
||||
</u-navbar>
|
||||
<div class="header-content-bg">
|
||||
@@ -38,11 +38,12 @@
|
||||
<div class="progress">
|
||||
<div class="active" :style="{width: item.percent + '%'}"></div>
|
||||
</div>
|
||||
<img :src="$cdn + tag(item.status)" alt="">
|
||||
<img :src="'https://cdn.cunwuyun.cn/dvcp/h5/' + tag(item.status)" alt="">
|
||||
</div>
|
||||
<AiEmpty v-if="!list.length"></AiEmpty>
|
||||
</div>
|
||||
<AiAdd @add="add" />
|
||||
<!-- <AiAdd @click.stop="add" /> -->
|
||||
<div class="ai-add" @click="toAdd"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -119,7 +120,7 @@
|
||||
url: "./detail?id=" + item.id + "&taskCode=" + item.taskCode + "&isMine=" + this.index
|
||||
})
|
||||
},
|
||||
add() {
|
||||
toAdd() {
|
||||
uni.navigateTo({
|
||||
url: "./create"
|
||||
})
|
||||
@@ -295,5 +296,38 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ai-add {
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
background: #1365DD;
|
||||
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
bottom: 240px;
|
||||
right: 32px;
|
||||
|
||||
&:before, &:after {
|
||||
content: "";
|
||||
background: #FFFFFF;
|
||||
display: block;
|
||||
position: absolute;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
&:before {
|
||||
height: 48px;
|
||||
width: 4px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
height: 4px;
|
||||
width: 48px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<img src="https://cdn.sinoecare.com/i/2024/07/12/6690a1303d423.png" alt="">
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="card flex">
|
||||
<div class="card flex border-r">
|
||||
<div class="left">
|
||||
<em>*</em>任务类型
|
||||
</div>
|
||||
@@ -20,7 +20,7 @@
|
||||
</u-row>
|
||||
</picker>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card border-r">
|
||||
<u-row justify="between">
|
||||
<div class="left">
|
||||
<em>*</em>任务标题
|
||||
@@ -30,7 +30,7 @@
|
||||
<input maxlength="30" v-model.trim="form.taskTitle" placeholder="限30字">
|
||||
<u-gap height="32"></u-gap>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card border-r">
|
||||
<u-row justify="between">
|
||||
<div class="left">
|
||||
<em>*</em>任务说明
|
||||
@@ -54,7 +54,8 @@
|
||||
</picker>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card flex" style="padding: 13px 17px;margin-bottom: 0">
|
||||
<div class="border-r">
|
||||
<div class="card flex top" style="padding: 13px 17px;margin-bottom: 0">
|
||||
<div class="left" style="line-height: 22px;">
|
||||
<em>*</em>执行人
|
||||
</div>
|
||||
@@ -84,7 +85,7 @@
|
||||
</AiPagePicker>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card flex" style="padding: 13px 17px">
|
||||
<div class="card flex bottom" style="padding: 13px 17px">
|
||||
<div class="left" style="line-height: 22px;">抄送人</div>
|
||||
<div class="right">
|
||||
<AiPagePicker type="sysUser" :isShowPhone="true" :params="{axiosUrl:'/app/wxcp/wxuser/list?status=1'}"
|
||||
@@ -98,7 +99,8 @@
|
||||
</AiPagePicker>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card flex flex-card" style="padding: 12px 17px;">
|
||||
</div>
|
||||
<div class="card flex flex-card border-r" style="padding: 12px 17px;">
|
||||
<div class="left"> 发送任务通知</div>
|
||||
<div class="right">
|
||||
<switch :checked="!!form.isNofity" @change="(e)=>form.isNofity=Number(e.detail.value)"/>
|
||||
@@ -249,7 +251,6 @@
|
||||
box-sizing: border-box;
|
||||
margin: 0 0 16px 32px;
|
||||
width: calc(100% - 64px);
|
||||
border-radius: 16px;
|
||||
|
||||
.left {
|
||||
font-size: 32px;
|
||||
@@ -331,6 +332,18 @@
|
||||
}
|
||||
}
|
||||
|
||||
.border-r {
|
||||
border-radius: 16px;
|
||||
.top {
|
||||
border-top-left-radius: 16px;
|
||||
border-top-right-radius: 16px;
|
||||
}
|
||||
.bottom {
|
||||
border-bottom-left-radius: 16px;
|
||||
border-bottom-right-radius: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
.left {
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
<template>
|
||||
<div class="detail">
|
||||
<u-navbar back-icon-color="#000" :background="backgroundNavbar" :is-fixed="true" height="44" z-index="999">
|
||||
<u-navbar title="工作任务" title-color="#000" title-width="300" title-size="32"
|
||||
:title-bold="true" back-icon-color="#000" :background="backgroundNavbar" :is-fixed="true" height="44" z-index="999">
|
||||
</u-navbar>
|
||||
<div class="header-content-bg">
|
||||
<img src="https://cdn.sinoecare.com/i/2024/07/12/6690a1303d423.png" alt="">
|
||||
@@ -59,13 +60,13 @@
|
||||
<div class="card" style="padding-top: 0" v-if="detail.fileList && detail.fileList.length">
|
||||
<div class="label">相关附件</div>
|
||||
<div class="file" v-for="(item,index) in detail.fileList" :key="index" @click="preFile(item)">
|
||||
<u-row justify="between">
|
||||
<div class="file-flex">
|
||||
<label class="left">
|
||||
<img :src="$cdn + 'common/appendix.png'" alt="">
|
||||
<img src="https://cdn.cunwuyun.cn/dvcp/h5/common/appendix.png" alt="">
|
||||
<span>{{item.name}}.{{item.postfix}}</span>
|
||||
</label>
|
||||
<span>{{(item.size/1024).toFixed(2)}}KB</span>
|
||||
</u-row>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -168,7 +169,6 @@
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['previewFile', 'injectJWeixin']),
|
||||
preFile(e) {
|
||||
if([".jpg",".png",".gif"].includes(e.postfix.toLowerCase())){
|
||||
uni.previewImage({
|
||||
@@ -179,6 +179,24 @@
|
||||
this.previewFile({ ...e})
|
||||
}
|
||||
},
|
||||
previewFile(e) {
|
||||
if(e.postfix && ['doc', 'xls', 'ppt', 'pdf', 'docx', 'xlsx', 'pptx'].includes(e.postfix.split('.')[1])) {
|
||||
uni.downloadFile({
|
||||
url: e.accessUrl,
|
||||
success: function (res) {
|
||||
var filePath = res.tempFilePath;
|
||||
uni.openDocument({
|
||||
filePath: filePath,
|
||||
fileType: e.postfix.split('.')[1],
|
||||
showMenu: true,
|
||||
});
|
||||
}
|
||||
});
|
||||
}else {
|
||||
this.$u.toast("该文件类型不支持预览!")
|
||||
}
|
||||
|
||||
},
|
||||
getDetail() {
|
||||
this.$instance.post("/app/appworktaskinfo/queryDetailById", null, {
|
||||
params: {
|
||||
@@ -404,7 +422,8 @@
|
||||
padding: 0 16px;
|
||||
margin-bottom: 32px;
|
||||
|
||||
& > .u-row {
|
||||
.file-flex {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
|
||||
.left {
|
||||
@@ -428,12 +447,14 @@
|
||||
display:-webkit-box;
|
||||
-webkit-box-orient:vertical;
|
||||
-webkit-line-clamp:2;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
& > span {
|
||||
font-size: 28px;
|
||||
color: #999999;
|
||||
margin: auto 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -532,5 +553,9 @@
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .u-collapse:after {
|
||||
height: 0!important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
<u-slider v-model="form.percent" min="0" max="100" :use-slot="true">
|
||||
<div class="wrap">
|
||||
<div class="value" :style="{right:form.percent<30?'-50px':''}">{{ form.percent }}%</div>
|
||||
<div class="btn" :style="{background:'url('+$cdn+ 'common/yuan.png)'}"></div>
|
||||
<div class="btn" :style="{background:'url(https://cdn.cunwuyun.cn/dvcp/h5/common/yuan.png)'}"></div>
|
||||
</div>
|
||||
</u-slider>
|
||||
<u-gap height="70"></u-gap>
|
||||
|
||||
@@ -24,7 +24,7 @@
|
||||
<u-gap height="32"></u-gap>
|
||||
<u-row>
|
||||
<div class="label">完成时间:</div>
|
||||
<div class="value">{{detail.finishTime}}</div>
|
||||
<div class="value">{{detail.finishTime || ''}}</div>
|
||||
</u-row>
|
||||
<u-gap height="16"></u-gap>
|
||||
<u-row>
|
||||
@@ -85,6 +85,7 @@
|
||||
}).then(res => {
|
||||
if (res && res.data) {
|
||||
this.detail = res.data;
|
||||
this.detail.name = this.detail.name ? this.detail.name : this.detail.userName
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user