居民议事

This commit is contained in:
liuye
2022-01-05 10:48:53 +08:00
parent 097cc72174
commit 4c6f041dca
18 changed files with 166 additions and 2 deletions

View File

@@ -0,0 +1,259 @@
<template>
<div class="AppHandSnapshot">
<u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#3975C6" inactive-color="#fff" active-color="#fff" @change="change"></u-tabs>
<div class="select-top">
<AiSelect @data="(v) => (list = v.map((e) => e.value))" :list="list" placeholder="所属网格"></AiSelect>
<AiSelect @data="(v) => (list = v.map((e) => e.value))" :list="list" placeholder="办件状态"></AiSelect>
</div>
<template v-if="datas.length > 0">
<AiCard v-for="(item, i) in datas" :key="i" @click.native="goDetail(item, 1)">
<template #custom>
<div class="card-top">
<div class="titles">世纪花园南区一号楼前面因没有排水渠道多世纪花园南区一号楼前面因没有排水渠道多世纪花园南区一号楼前面因没有排水渠道</div>
<div class="types">
<span>事件类型</span>
<span class="types-right">矛盾纠纷</span>
</div>
<div class="gards">
<span>所属网格</span>
<span class="gards-right">04号网格</span>
</div>
</div>
<div class="status status0">
<span class="icon"></span>
<span>待处理</span>
</div>
</template>
</AiCard>
</template>
<AiEmpty v-else></AiEmpty>
<div class="pad-b120"></div>
<div class="tabs">
<div class="item">
<img src="./components/img/handle-icon-active.png" alt="">
<p class="color-3267F0">办理</p>
</div>
<div class="item" @click="linkTo('./Statistics')">
<img src="./components/img/statistics-icon.png" alt="">
<p>统计</p>
</div>
<div class="item">
<img src="./components/img/set-icon.png" alt="">
<p>配置</p>
</div>
</div>
</div>
</template>
<script>
export default {
props: {},
name: 'AppHandSnapshot',
appName: '随手拍',
data() {
return {
datas: [],
tabList: [
{
name: '全部待办',
},
{
name: '办件历史',
},
],
list: [
{
value: '1',
label: '江',
},
{
value: '2',
label: '湖',
},
],
currentTabs: 0,
current: 1,
size: 10,
pages: 0,
}
},
computed: {
loadmore() {
return this.pages <= this.current ? 'loading ' : 'nomore'
},
},
watch: {},
onLoad() {
this.getList()
},
onShow() {},
methods: {
getList() {
this.$http
.post('/app/appvisitvondolence/list', null, {
params: {
size: this.size,
current: this.current,
createUserId: this.currentTabs == 1 ? this.user.id : '',
},
})
.then((res) => {
if (res.code == 0) {
this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records
this.pages = res.data.pages
}
})
},
goDetail(item) {
uni.navigateTo({ url: `./Detail?id=${item.id}` })
},
change(index) {
this.currentTabs = index
this.getList()
},
linkTo(url) {
uni.navigateTo({url})
}
},
onReachBottom() {
this.current = this.current + 1
this.getList()
},
}
</script>
<style scoped lang="scss">
uni-page-body {
height: 100%;
}
.AppHandSnapshot {
height: 100%;
.select-top {
background: #fff;
display: flex;
justify-content: space-around;
.AiSelect {
margin: 30px 0;
}
}
::v-deep .AiCard {
background: #f3f6f9;
padding: 24px 40px 0 32px;
.start {
background: #fff;
border-radius: 16px;
.card-top {
padding: 32px;
.titles {
margin-bottom: 34px;
font-size: 32px;
font-weight: 500;
color: #333333;
line-height: 1.4;
word-break: break-all;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.types,
.gards {
margin-top: 8px;
font-size: 26px;
.types-right,
.gards-right {
margin-left: 32px;
color: #333333;
}
}
}
.status {
padding: 32px;
border-top: 1px solid #dddddd;
.icon {
display: inline-block;
width: 8px;
height: 8px;
vertical-align: middle;
margin-right: 8px;
}
}
.status0 {
color: #ff883c;
.icon {
background: #ff883c;
}
}
.status1 {
color: #1aaaff;
.icon {
background: #1aaaff;
}
}
.status2 {
color: #42d784;
.icon {
background: #42d784;
}
}
.status3 {
color: #ff4466;
.icon {
background: #ff4466;
}
}
}
}
// ::v-deep .AiCard:last-child {
// padding-bottom: 24px;
// }
.pad-b120{
background-color: #f3f6f9;
padding-bottom: 120px;
}
.tabs{
width: 100%;
height: 98px;
background: #FFF;
border-top: 1px solid #ddd;
position: fixed;
bottom: 0;
left: 0;
display: flex;
.item{
flex: 1;
text-align: center;
img{
width: 56px;
height: 56px;
margin-top: 8px;
}
p{
font-size: 22px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #C4CAD4;
line-height: 8px;
}
.color-3267F0{
color: #3267F0;
}
}
}
}
</style>

View File

@@ -0,0 +1,527 @@
<template>
<div class="Detail">
<div class="header-top">
<div class="avatars" v-if="data.name">{{ data.name.substring(data.name.length, data.name.length - 2) }}</div>
<div class="right">
<div class="names">{{ data.name }}的上报</div>
<div class="times">2021-05-06 13:45</div>
</div>
</div>
<div class="header-middle">
<div class="titles">世纪花园南区一号楼前面因没有排水渠道多世纪花园南区一号楼前面因没有排水渠道多世纪花园南区一号楼前面因没有排水渠道</div>
<span class="status status0">待处理</span>
<div class="card">
<span class="card-left">事件类型</span>
<span class="card-right">聚众闹事</span>
</div>
<div class="card">
<span class="card-left">所属网格</span>
<span class="card-right">聚众闹事</span>
</div>
<div class="card">
<span class="card-left">联系方式</span>
<span class="card-right">聚众闹事</span>
</div>
<div class="card">
<span class="card-left">上报地址</span>
<span class="card-right">
<span>{{ data.corpId }}</span>
<u-icon name="phone-fill" color="#3D94FB"></u-icon>
</span>
</div>
<div class="card">
<span class="card-left">上报地址</span>
<span class="card-right">广东省中关村世纪花园北一组广东省中关村世纪花园北一组</span>
</div>
<div class="card">
<span class="card-left">上报来源</span>
<span class="card-right">三角湖居民社群 李毅 小程序填报三角湖居民社群 李毅 小程序填报三角湖居民社群 李毅 小程序填报</span>
</div>
<div class="card">
<span class="card-left">照片</span>
</div>
<img src="./components/yan.jpg" alt="" v-for="(item, i) in 4" :key="i" />
</div>
<div class="header-bottom">
<div class="line"></div>
<div class="plan">
<div class="nav">
<span>办理进度</span>
<span>(待受理)</span>
</div>
<div class="cards">
<div class="cardss">
<!-- v-for="(item, index) in data.processNodes" :key="index" -->
<div class="cardss-left">
<span v-if="data.name">
李伟民
<!-- {{ data.name.split(',')[0].substring(data.name.split(',')[0].length - 2, data.name.split(',')[0].length) }} -->
</span>
<img src="./components/1.png" class="avatarIcon" alt="" />
</div>
<div class="cardss-right">
<div class="cardsss-right-left">
<div class="cardssss-right-left-top">
<span>李维民</span>
<span style="margin-left: 26px">
111
<!-- {{ item.status == 0 ? '驳回' : '通过' }} -->
</span>
</div>
<!-- <div class="cardssss-right-left-bottom" v-if="item.auditName.split(',').length > 3">
<span v-for="(items, i) in item.auditName.split(',')" :key="i" v-if="i < 3" style="margin-left: 5px">
<span> {{ items }} </span>
</span>
<span>...</span>
</div>
<div class="cardssss-right-left-bottom" v-else>{{ item.auditName }}</div> -->
</div>
<div class="cardees-right-right" v-if="">2021-12-17</div>
</div>
<div class="lines"></div>
</div>
<div class="cardes-msg-top">1111</div>
<div class="imgs">
<img src="./components/yan.jpg" alt="" v-for="(e, i) in 4" :key="i" />
</div>
</div>
<div class="cards">
<div class="cardss">
<!-- v-for="(item, index) in data.processNodes" :key="index" -->
<div class="cardss-left">
<span v-if="data.name">
李伟民
<!-- {{ data.name.split(',')[0].substring(data.name.split(',')[0].length - 2, data.name.split(',')[0].length) }} -->
</span>
<img src="./components/1.png" class="avatarIcon" alt="" />
</div>
<div class="cardss-right">
<div class="cardsss-right-left">
<div class="cardssss-right-left-top">
<span>李维民</span>
<span style="margin-left: 26px">
111
<!-- {{ item.status == 0 ? '驳回' : '通过' }} -->
</span>
</div>
<!-- <div class="cardssss-right-left-bottom" v-if="item.auditName.split(',').length > 3">
<span v-for="(items, i) in item.auditName.split(',')" :key="i" v-if="i < 3" style="margin-left: 5px">
<span> {{ items }} </span>
</span>
<span>...</span>
</div>
<div class="cardssss-right-left-bottom" v-else>{{ item.auditName }}</div> -->
</div>
<div class="cardees-right-right" v-if="">2021-12-17</div>
</div>
<div class="lines"></div>
</div>
<div class="cardes-msg-top">1111</div>
<div class="imgs">
<img src="./components/yan.jpg" alt="" v-for="(e, i) in 4" :key="i" />
</div>
</div>
<div class="cards">
<div class="cardss">
<!-- v-for="(item, index) in data.processNodes" :key="index" -->
<div class="cardss-left">
<span v-if="data.name">
李伟民
<!-- {{ data.name.split(',')[0].substring(data.name.split(',')[0].length - 2, data.name.split(',')[0].length) }} -->
</span>
<img src="./components/1.png" class="avatarIcon" alt="" />
</div>
<div class="cardss-right">
<div class="cardsss-right-left">
<div class="cardssss-right-left-top">
<span>李维民</span>
<span style="margin-left: 26px">
111
<!-- {{ item.status == 0 ? '驳回' : '通过' }} -->
</span>
</div>
<!-- <div class="cardssss-right-left-bottom" v-if="item.auditName.split(',').length > 3">
<span v-for="(items, i) in item.auditName.split(',')" :key="i" v-if="i < 3" style="margin-left: 5px">
<span> {{ items }} </span>
</span>
<span>...</span>
</div>
<div class="cardssss-right-left-bottom" v-else>{{ item.auditName }}</div> -->
</div>
<div class="cardees-right-right" v-if="">2021-12-17</div>
</div>
<div class="lines"></div>
</div>
<div class="cardes-msg-top">1111</div>
<div class="imgs">
<img src="./components/yan.jpg" alt="" v-for="(e, i) in 4" :key="i" />
</div>
</div>
</div>
</div>
<div class="fixedBtn">
<div class="status00">
<div class="columns" @click="toTransfer">
<img src="./components/22.png" alt="" />
<span class="hint">转交事件</span>
</div>
<div class="columns" @click="toReject">
<img src="./components/22.png" alt="" />
<span class="hint">拒绝受理</span>
</div>
<div class="doIt" @click="ToMyDoIt">我来受理</div>
</div>
<!-- <div class="endDoIt">我已办结</div> -->
</div>
</div>
</template>
<script>
export default {
name: 'Detail',
components: {},
props: {},
data() {
return {
data: {},
id: '',
}
},
computed: {},
watch: {},
onLoad(o) {
this.id = o.id
this.$dict.load('realityStatus').then(() => {
this.getDetail()
})
},
onShow() {},
methods: {
getDetail() {
this.$http.post(`/app/appvisitvondolence/queryDetailById?id=${this.id}`).then((res) => {
if (res?.data) {
this.data = res.data
}
})
},
toTransfer() {
console.log('转交事件')
uni.navigateTo({ url: `./Transfer?id=${this.id}` })
},
toReject() {
console.log('拒绝受理')
uni.navigateTo({ url: `./Reject?id=${this.id}` })
},
ToMyDoIt() {
console.log('我来受理')
uni.navigateTo({ url: `./DoThings?id=${this.id}` })
},
},
}
</script>
<style scoped lang="scss">
uni-page-body {
height: 100%;
}
.Detail {
height: 100%;
background: #fff;
.header-top {
display: flex;
margin: 26px 0 14px 0;
padding: 0 32px;
.avatars {
width: 80px;
height: 80px;
line-height: 80px;
background: #4e8eee;
border-radius: 50%;
color: #fff;
text-align: center;
font-size: 28px;
font-weight: 500;
margin-right: 16px;
}
.right {
.names {
font-size: 32px;
font-weight: 500;
}
.times {
margin-top: 10px;
font-size: 28px;
color: #999999;
}
}
}
.header-middle {
padding: 0 32px;
.titles {
margin: 32px 0;
line-height: 1.4;
word-break: break-all;
font-size: 40px;
font-weight: 600;
}
.status {
display: inline-block;
margin-bottom: 14px;
padding: 4px 8px;
font-size: 26px;
color: #ffffff;
border-radius: 8px;
}
.status0 {
background: #ff883c;
}
.status1 {
background: #1aaaff;
}
.status2 {
background: #42d784;
}
.status3 {
background: #ff4466;
}
.card {
display: flex;
justify-content: space-between;
padding: 34px 0;
border-bottom: 1px solid #ddd;
.card-left {
width: 46%;
font-size: 32px;
color: #999999;
}
.card-right {
font-size: 32px;
.u-icon {
margin-left: 8px;
}
}
}
.card:last-child {
border-bottom: none;
}
img {
width: 225px;
height: 226px;
margin-right: 8px;
}
img:nth-child(3n) {
margin-right: 0;
}
}
.header-bottom {
padding-bottom: 80px;
.line {
height: 16px;
background: #f3f6f9;
}
.plan {
padding: 0 32px;
.nav {
padding: 26px 0;
}
.cards {
position: relative;
padding-bottom: 80px;
.cardss {
display: flex;
justify-content: space-between;
.cardss-left {
position: relative;
width: 80px;
height: 80px;
text-align: center;
line-height: 80px;
color: #fff;
background: #197df0;
border: 1px solid #dddddd;
border-radius: 50%;
font-size: 28px;
z-index: 9;
// img {
// width: 100%;
// height: 100%;
// border-radius: 50%;
// }
.avatarIcon {
position: absolute;
bottom: 0;
right: 0;
width: 38px;
height: 38px;
}
}
.cardss-right {
width: calc(100% - 110px);
display: flex;
justify-content: space-between;
.cardsss-right-left {
.cardssss-right-left-top {
width: 300px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 32px;
}
.cardssss-right-left-bottom {
margin-top: 10px;
font-size: 28px;
color: #666666;
}
}
.cardees-right-right {
font-size: 28px;
color: #999999;
}
}
.lines {
position: absolute;
top: 0;
left: 40px;
width: 4px;
height: 100%;
background: #eeeeee;
}
}
.cardes-msg-top {
font-size: 28px;
color: #343d65;
margin-top: 10px;
margin-left: 110px;
}
.imgs {
margin-top: 10px;
margin-left: 110px;
img {
width: 136px;
height: 136px;
border-radius: 4px;
margin-right: 12px;
}
img:nth-child(4n) {
margin-right: 0;
}
}
}
.cards:last-child {
.lines {
width: 0;
height: 0;
}
}
}
}
.fixedBtn {
background: #fff;
position: fixed;
bottom: 0;
width: 100%;
box-sizing: border-box;
z-index: 999;
.status00 {
display: flex;
.columns {
display: flex;
flex-direction: column;
align-items: center;
width: 22%;
padding: 16px 0;
img {
width: 44px;
height: 42px;
}
.hint {
margin-top: 4px;
font-size: 28px;
color: #666666;
}
}
.doIt {
width: 56%;
background: #3975c6;
text-align: center;
height: 112px;
line-height: 112px;
font-size: 36px;
font-weight: 500;
color: #fff;
}
}
.endDoIt {
background: #3975c6;
text-align: center;
padding: 34px 0;
font-size: 32px;
font-weight: 500;
color: #ffffff;
}
}
}
</style>

View File

@@ -0,0 +1,160 @@
<template>
<div class="DoThings">
<div class="contents">
<u-form :model="forms" ref="uForm" label-width="auto" :border-bottom="false">
<u-form-item label="事件分类" prop="status" required :border-bottom="false" right-icon="arrow-right">
<u-input v-model="forms.status" placeholder="请选择事件分类" @click="show = true" />
<u-select v-model="show" :list="$dict.getDict('realityStatus')" value-name="dictValue" label-name="dictName" @confirm="selectStatus"></u-select>
</u-form-item>
<u-form-item label="拒绝意见" prop="content" :border-bottom="false" label-position="top" class="contents">
<u-input v-model="forms.content" placeholder="请写下你的拒绝意见..." type="textarea" auto-height height="100" maxlength="500" />
</u-form-item>
<div class="line"></div>
<u-form-item label="图片上传(最多9张)" prop="fileIds" :border-bottom="false" class="avatars" label-position="top">
<AiUploader :def.sync="forms.fileIds" multiple placeholder="上传图片" :limit="9"></AiUploader>
</u-form-item>
</u-form>
</div>
<div class="btn" @click="submit">转交事件</div>
</div>
</template>
<script>
export default {
name: 'DoThings',
components: {},
props: {},
data() {
return {
forms: {
status: '',
content: '',
fileIds: [],
},
flag: false,
show: false,
}
},
computed: {},
watch: {},
onLoad() {
this.$dict.load('realityStatus').then(() => {
// this.getDetail()
})
},
onShow() {},
methods: {
submit() {
if (this.flag) return
this.$refs.uForm.validate((valid) => {
if (valid) {
if (!this.forms.content) {
return this.$u.toast('请选择转交人')
}
const imgs = []
if (this.forms.fileIds) {
this.forms.fileIds.map((e) => {
imgs.push({ url: e.url, id: e.id })
})
}
this.flag = true
this.$http
.post(`/app/appvisitvondolence/addOrUpdate`, {
title: this.forms.title,
content: this.forms.content,
// images: JSON.stringify(imgs) || [],
images: imgs || [],
people: this.forms.people,
phone: this.forms.phone,
id: this.id,
})
.then((res) => {
if (res.code == 0) {
this.$u.toast('发布成功')
this.flag = false
uni.navigateTo({ url: `./AppHandSnapshot` })
}
})
} else {
this.$u.toast('失败')
}
})
},
},
}
</script>
<style scoped lang="scss">
.DoThings {
height: 100%;
.contents {
::v-deep .u-form {
.u-form-item {
padding: 0 45px !important;
.u-form-item__body {
.u-form-item--right__content__slot {
padding-bottom: 0;
.u-input {
text-align: right !important;
}
}
}
}
.u-form-item:first-child {
.u-form-item__body {
border-bottom: 1px solid #ddd;
}
}
.line {
height: 24px;
background: #f3f6f9;
}
.contents {
padding-bottom: 20px !important;
.u-form-item__body {
.u-form-item--right__content__slot {
.u-input {
text-align: left !important;
}
}
}
}
.avatars {
padding-bottom: 20px !important;
.u-form-item__body {
.default {
width: 160px;
height: 160px;
}
}
}
}
}
.btn {
position: fixed;
bottom: 0;
width: 100%;
box-sizing: border-box;
background: #3975c6;
padding: 34px 0;
text-align: center;
font-size: 32px;
font-weight: 500;
color: #ffffff;
}
}
</style>

View File

@@ -0,0 +1,160 @@
<template>
<div class="Reject">
<div class="contents">
<u-form :model="forms" ref="uForm" label-width="auto" :border-bottom="false">
<u-form-item label="事件分类" prop="status" required :border-bottom="false" right-icon="arrow-right">
<u-input v-model="forms.status" placeholder="请选择事件分类" @click="show = true" />
<u-select v-model="show" :list="$dict.getDict('realityStatus')" value-name="dictValue" label-name="dictName" @confirm="selectStatus"></u-select>
</u-form-item>
<u-form-item label="拒绝意见" prop="content" :border-bottom="false" label-position="top" class="contents">
<u-input v-model="forms.content" placeholder="请写下你的拒绝意见..." type="textarea" auto-height height="100" maxlength="500" />
</u-form-item>
<div class="line"></div>
<u-form-item label="图片上传(最多9张)" prop="fileIds" :border-bottom="false" class="avatars" label-position="top">
<AiUploader :def.sync="forms.fileIds" multiple placeholder="上传图片" :limit="9"></AiUploader>
</u-form-item>
</u-form>
</div>
<div class="btn" @click="submit">转交事件</div>
</div>
</template>
<script>
export default {
name: 'Reject',
components: {},
props: {},
data() {
return {
forms: {
status: '',
content: '',
fileIds: [],
},
flag: false,
show: false,
}
},
computed: {},
watch: {},
onLoad() {
this.$dict.load('realityStatus').then(() => {
// this.getDetail()
})
},
onShow() {},
methods: {
submit() {
if (this.flag) return
this.$refs.uForm.validate((valid) => {
if (valid) {
if (!this.forms.content) {
return this.$u.toast('请选择转交人')
}
const imgs = []
if (this.forms.fileIds) {
this.forms.fileIds.map((e) => {
imgs.push({ url: e.url, id: e.id })
})
}
this.flag = true
this.$http
.post(`/app/appvisitvondolence/addOrUpdate`, {
title: this.forms.title,
content: this.forms.content,
// images: JSON.stringify(imgs) || [],
images: imgs || [],
people: this.forms.people,
phone: this.forms.phone,
id: this.id,
})
.then((res) => {
if (res.code == 0) {
this.$u.toast('发布成功')
this.flag = false
uni.navigateTo({ url: `./AppHandSnapshot` })
}
})
} else {
this.$u.toast('失败')
}
})
},
},
}
</script>
<style scoped lang="scss">
.Reject {
height: 100%;
.contents {
::v-deep .u-form {
.u-form-item {
padding: 0 45px !important;
.u-form-item__body {
.u-form-item--right__content__slot {
padding-bottom: 0;
.u-input {
text-align: right !important;
}
}
}
}
.u-form-item:first-child {
.u-form-item__body {
border-bottom: 1px solid #ddd;
}
}
.line {
height: 24px;
background: #f3f6f9;
}
.contents {
padding-bottom: 20px !important;
.u-form-item__body {
.u-form-item--right__content__slot {
.u-input {
text-align: left !important;
}
}
}
}
.avatars {
padding-bottom: 20px !important;
.u-form-item__body {
.default {
width: 160px;
height: 160px;
}
}
}
}
}
.btn {
position: fixed;
bottom: 0;
width: 100%;
box-sizing: border-box;
background: #3975c6;
padding: 34px 0;
text-align: center;
font-size: 32px;
font-weight: 500;
color: #ffffff;
}
}
</style>

View File

@@ -0,0 +1,29 @@
<template>
<div class="Selecter"></div>
</template>
<script>
export default {
name: 'Selecter',
components: {},
props: {
dict: Object,
instance: Function,
params: Object,
},
data() {
return {}
},
computed: {},
watch: {},
onLoad() {},
onShow() {},
methods: {},
}
</script>
<style scoped lang="scss">
.Selecter {
height: 100%;
}
</style>

View File

@@ -0,0 +1,109 @@
<template>
<div class="Statistics">
<div class="pad-b120"></div>
<div class="tabs">
<div class="item">
<img src="./components/img/handle-icon.png" alt="">
<p>办理</p>
</div>
<div class="item">
<img src="./components/img/statistics-icon-active.png" alt="">
<p class="color-3267F0">统计</p>
</div>
<div class="item">
<img src="./components/img/set-icon.png" alt="">
<p>配置</p>
</div>
</div>
</div>
</template>
<script>
export default {
props: {},
data() {
return {
}
},
onLoad() {
},
onShow() {},
methods: {
getList() {
this.$http
.post('/app/appvisitvondolence/list', null, {
params: {
size: this.size,
current: this.current,
createUserId: this.currentTabs == 1 ? this.user.id : '',
},
})
.then((res) => {
if (res.code == 0) {
this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records
this.pages = res.data.pages
}
})
},
goDetail(item) {
uni.navigateTo({ url: `./Detail?id=${item.id}` })
},
change(index) {
this.currentTabs = index
this.getList()
},
},
onReachBottom() {
this.current = this.current + 1
this.getList()
},
}
</script>
<style scoped lang="scss">
uni-page-body {
height: 100%;
}
.Statistics {
height: 100%;
.pad-b120{
background-color: #f3f6f9;
padding-bottom: 120px;
}
.tabs{
width: 100%;
height: 98px;
background: #FFF;
border-top: 1px solid #ddd;
position: fixed;
bottom: 0;
left: 0;
display: flex;
.item{
flex: 1;
text-align: center;
img{
width: 56px;
height: 56px;
margin-top: 8px;
}
p{
font-size: 22px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #C4CAD4;
line-height: 8px;
}
.color-3267F0{
color: #3267F0;
}
}
}
}
</style>

View File

@@ -0,0 +1,153 @@
<template>
<div class="Transfer">
<div class="contents">
<u-form :model="forms" ref="uForm" label-width="auto" :border-bottom="false">
<u-form-item label="转交给" prop="status" required :border-bottom="false" right-icon="arrow-right" class="first-form">
<u-input v-model="forms.status" placeholder="请选择转交对象" />
</u-form-item>
<u-form-item label="办理意见" prop="content" :border-bottom="false" label-position="top" class="contents">
<u-input v-model="forms.content" placeholder="请写下你的办理意见..." type="textarea" auto-height height="100" maxlength="500" />
</u-form-item>
<div class="line"></div>
<u-form-item label="图片上传(最多9张)" prop="fileIds" :border-bottom="false" class="avatars" label-position="top">
<AiUploader :def.sync="forms.fileIds" multiple placeholder="上传图片" :limit="9"></AiUploader>
</u-form-item>
</u-form>
</div>
<div class="btn" @click="submit">转交事件</div>
</div>
</template>
<script>
export default {
name: 'Transfer',
components: {},
props: {},
data() {
return {
forms: {
status: '',
content: '',
fileIds: [],
},
flag: false,
}
},
computed: {},
watch: {},
onLoad() {},
onShow() {},
methods: {
submit() {
if (this.flag) return
this.$refs.uForm.validate((valid) => {
if (valid) {
if (!this.forms.content) {
return this.$u.toast('请选择转交人')
}
const imgs = []
if (this.forms.fileIds) {
this.forms.fileIds.map((e) => {
imgs.push({ url: e.url, id: e.id })
})
}
this.flag = true
this.$http
.post(`/app/appvisitvondolence/addOrUpdate`, {
title: this.forms.title,
content: this.forms.content,
// images: JSON.stringify(imgs) || [],
images: imgs || [],
people: this.forms.people,
phone: this.forms.phone,
id: this.id,
})
.then((res) => {
if (res.code == 0) {
this.$u.toast('发布成功')
this.flag = false
uni.navigateTo({ url: `./AppHandSnapshot` })
}
})
} else {
this.$u.toast('失败')
}
})
},
},
}
</script>
<style scoped lang="scss">
.Transfer {
height: 100%;
.contents {
::v-deep .u-form {
.u-form-item {
padding: 0 45px !important;
.u-form-item__body {
.u-form-item--right__content__slot {
padding-bottom: 0;
.u-input {
text-align: right !important;
}
}
}
}
.u-form-item:first-child {
.u-form-item__body {
border-bottom: 1px solid #ddd;
}
}
.line {
height: 24px;
background: #f3f6f9;
}
.contents {
padding-bottom: 20px !important;
.u-form-item__body {
.u-form-item--right__content__slot {
.u-input {
text-align: left !important;
}
}
}
}
.avatars {
padding-bottom: 20px !important;
.u-form-item__body {
.default {
width: 160px;
height: 160px;
}
}
}
}
}
.btn {
position: fixed;
bottom: 0;
width: 100%;
box-sizing: border-box;
background: #3975c6;
padding: 34px 0;
text-align: center;
font-size: 32px;
font-weight: 500;
color: #ffffff;
}
}
</style>

Binary file not shown.

After

Width:  |  Height:  |  Size: 623 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 810 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

View File

@@ -17,6 +17,11 @@ export default {
icon: require('./img/jmhd.png'),
url: '../AppResidentActivitie/AppResidentActivities'
},
{
name: '居民议事',
icon: require('./img/jmys.png'),
url: '../AppVillageDiscuss/AppVillageDiscuss'
},
{
name: '小程序公告',
icon: require('./img/xcxgg.png'),

Binary file not shown.

After

Width:  |  Height:  |  Size: 684 KiB