AiCard #custom #menu

This commit is contained in:
花有清香月有阴
2021-12-16 17:13:18 +08:00
parent 81c6e9ce04
commit c61082f72c
4 changed files with 187 additions and 154 deletions

View File

@@ -9,13 +9,13 @@
<u-form-item label="公开类型" prop="status" required style="position: relative"> <u-form-item label="公开类型" prop="status" required style="position: relative">
<u-input v-model="forms.status" disabled placeholder="请选择公开类型" @click="showStstus = true" /> <u-input v-model="forms.status" disabled placeholder="请选择公开类型" @click="showStstus = true" />
<u-select v-model="showStstus" :list="$dict.getDict('realityStatus')" value-name="dictValue" label-name="dictName" @confirm="realityStstus"></u-select> <u-select v-model="showStstus" :list="$dict.getDict('realityStatus')" value-name="dictValue" label-name="dictName" @confirm="selectStatus"></u-select>
<u-icon name="arrow-right" color="#CCCCCC" style="position: absolute; top: 25px; right: 30px"></u-icon> <u-icon name="arrow-right" color="#CCCCCC" style="position: absolute; top: 25px; right: 30px"></u-icon>
</u-form-item> </u-form-item>
<u-form-item label="发布地区" prop="areaId" required style="position: relative"> <u-form-item label="发布地区" prop="areaId" required style="position: relative">
<AiAreaPicker v-model="areaId" :areaId="areaIdProps" @select="areaSelect"></AiAreaPicker> <AiAreaPicker v-model="forms.areaId" :areaId="areaIdProps" @select="areaSelect"></AiAreaPicker>
<u-icon name="arrow-right" color="#CCCCCC" style="position: absolute; top: 25px; right: 30px"></u-icon> <u-icon name="arrow-right" color="#CCCCCC" style="position: absolute; top: 25px; right: 30px"></u-icon>
</u-form-item> </u-form-item>
@@ -45,10 +45,11 @@ export default {
props: {}, props: {},
data() { data() {
return { return {
show: false, id: '',
forms: { forms: {
title: '', title: '',
status: '', status: '',
statusValue: '',
content: '', content: '',
fileIds: [], fileIds: [],
areaId: '', areaId: '',
@@ -59,43 +60,45 @@ export default {
} }
}, },
computed: { ...mapState(['user']) }, computed: { ...mapState(['user']) },
created() { onLoad(o) {
console.log(o)
this.id = o.id
this.areaIdProps = this.user.areaId this.areaIdProps = this.user.areaId
this.$dict.load('realityStatus').then(() => { this.$dict.load('realityStatus').then(() => {
this.getDetail() this.getDetail()
}) })
}, },
mounted() {}, mounted() {},
methods: { methods: {
getDetail() { // getDetail() {
this.$http.post(`/app/appvisitvondolence/queryDetailById?id=${this.params.id}`).then((res) => { // this.$http.post(`/app/appvisitvondolence/queryDetailById?id=${this.id}`).then((res) => {
if (res?.data) { // if (res?.data) {
this.forms = res.data // this.forms = res.data
this.forms.realityValue = res.data.reality // this.forms.statusValue = res.data.status
this.forms.reality = this.$dict.getLabel('realityStatus', res.data.reality) // this.forms.status = this.$dict.getLabel('realityStatus', res.data.status)
if (res.data.images) { // if (res.data.images) {
this.forms.images = JSON.parse(res.data.images || '[]') // this.forms.images = JSON.parse(res.data.images || '[]')
} // }
} // }
}) // })
}, // },
submit() { submit() {
if (this.flag) return if (this.flag) return
this.$refs.uForm.validate((valid) => { this.$refs.uForm.validate((valid) => {
if (valid) { if (valid) {
if (!this.forms.create_user_name) {
return this.$u.toast('请选择走访慰问对象')
}
if (!this.forms.title) { if (!this.forms.title) {
return this.$u.toast('请输入入户走访事项') return this.$u.toast('请输入标题')
}
if (!this.forms.content) {
return this.$u.toast('请输入正文')
} }
const imgs = [] const imgs = []
if (this.forms.images) { if (this.forms.fileIds) {
this.forms.images.map((e) => { this.forms.fileIds.map((e) => {
console.log(e)
imgs.push({ url: e.url, id: e.id }) imgs.push({ url: e.url, id: e.id })
}) })
} }
@@ -103,26 +106,19 @@ export default {
this.flag = true this.flag = true
this.$http this.$http
.post(`/app/appvisitvondolence/addOrUpdate`, { .post(`/app/appvisitvondolence/addOrUpdate`, {
areaId: this.forms.areaId,
applicationId: this.forms.applicationId,
name: this.forms.create_user_name,
optionId: this.forms.applicationId,
reality: this.forms.realityValue ? this.forms.realityValue : this.forms.reality,
title: this.forms.title, title: this.forms.title,
description: this.forms.description, status: this.forms.statusValue ? this.forms.statusValue : this.forms.status,
createUserId: this.user.id, areaId: this.forms.areaId,
createUserName: this.user.name, content: this.forms.content,
images: JSON.stringify(imgs) || [], // images: JSON.stringify(imgs) || [],
images: imgs || [],
id: this.id, id: this.id,
}) })
.then((res) => { .then((res) => {
console.log(4)
if (res.code == 0) { if (res.code == 0) {
console.log(5)
this.$u.toast('发布成功') this.$u.toast('发布成功')
this.flag = false this.flag = false
uni.navigateTo({ url: `./AppWalkask` }) uni.navigateTo({ url: `./AppServicePublic` })
console.log(6)
} }
}) })
} else { } else {
@@ -132,24 +128,12 @@ export default {
}, },
areaSelect(e) { areaSelect(e) {
if (e.type == 5) {
this.forms.areaId = e.id this.forms.areaId = e.id
} else {
return this.$u.toast('请选择到村')
}
}, },
backlist(e) { selectStatus(e) {
console.log(e.item) this.forms.status = e[0].label
this.forms.create_user_name = e.item.create_user_name this.forms.statusValue = e[0].value
this.forms.applicationId = e.appId
this.forms.optionId = e.item.id
// this.addList = true
},
realityStstus(e) {
this.forms.reality = e[0].label
this.forms.realityValue = e[0].value
}, },
}, },
} }

View File

@@ -8,13 +8,10 @@
<u-search class="serach_content" placeholder="请输入公开标题" :show-action="false" v-model="keyword" @clear="clearSearch" @search="search"></u-search> <u-search class="serach_content" placeholder="请输入公开标题" :show-action="false" v-model="keyword" @clear="clearSearch" @search="search"></u-search>
<template v-if="datas.length > 0"> <template v-if="datas.length > 0">
<u-card v-for="(item, index) in datas" :key="index" :foot-border-top="false" :head-border-bottom="false" :show-head="false" :border-radius="32" @click="goDetail(item, 1)"> <AiCard v-for="(item, i) in datas" :key="i" @click.native="toAdd(item, 1)">
<view class="body" slot="body"> <template #custom>
<view class="u-body-item">
<div class="title">{{ item.createUserName }}</div> <div class="title">{{ item.createUserName }}</div>
</view>
<view class="u-body-item">
<div class="flex"> <div class="flex">
<span class="left"> <span class="left">
<span class="garydiv">财务公开</span> <span class="garydiv">财务公开</span>
@@ -26,9 +23,17 @@
<span>人看过</span> <span>人看过</span>
</span> </span>
</div> </div>
</view>
</view> <div class="imgs">
</u-card> <!-- <img :src="items.url" alt="" v-for="(items, i) in item.images" :key="i" @click.stop="previewImage(item.images, items.url)" /> -->
</div>
</template>
<template #menu>
<div class="menu" @tap.stop="toAdd(item, 2)">编辑</div>
<div class="menu" @tap.stop="toDetele(item)">删除</div>
</template>
</AiCard>
<u-loadmore :status="loadmore" color="#999" font-size="24" margin-top="32" margin-bottom="80" /> <u-loadmore :status="loadmore" color="#999" font-size="24" margin-top="32" margin-bottom="80" />
</template> </template>
@@ -38,6 +43,8 @@
<AiFixedBtn> <AiFixedBtn>
<div class="addBtn iconfont iconfont-iconfangda" @tap.stop="toAdd()" /> <div class="addBtn iconfont iconfont-iconfangda" @tap.stop="toAdd()" />
</AiFixedBtn> </AiFixedBtn>
<u-modal v-model="deletShow" content="您确认要删除该条信息吗?" :show-cancel-button="true" :mask-close-able="true" :show-title="false" @confirm="delet"></u-modal>
</div> </div>
</template> </template>
@@ -57,6 +64,8 @@ export default {
current: 1, current: 1,
size: 10, size: 10,
pages: 0, pages: 0,
deletShow: false,
deletId: '',
} }
}, },
computed: { computed: {
@@ -92,20 +101,37 @@ export default {
}, },
areaSelect(e) { areaSelect(e) {
if (e.type == 5) {
this.areaId = e.id this.areaId = e.id
} else {
return this.$u.toast('请选择到村')
}
this.getList() this.getList()
}, },
goDetail(item) { toAdd(item, type) {
if (type == '1') {
console.log('详情')
uni.navigateTo({ url: `./Detail?id=${item.id}` }) uni.navigateTo({ url: `./Detail?id=${item.id}` })
}
if (type == '2') {
console.log('编辑')
uni.navigateTo({ url: `./Add?id=${item.id}` })
}
if (type == null) {
console.log('添加')
uni.navigateTo({ url: `./Add` })
}
}, },
toAdd() { toDetele(item) {
uni.navigateTo({ url: `./Add` }) this.deletShow = true
this.deletId = item.id
},
delet() {
this.$http.post(`/app/appvisitvondolence/delete?ids=${this.deletId}`).then((res) => {
if (res.code == 0) {
this.$u.toast('删除成功!')
this.getList()
}
})
}, },
}, },
onReachBottom() { onReachBottom() {
@@ -135,14 +161,16 @@ uni-page-body {
padding: 20px 30px; padding: 20px 30px;
} }
.u-card { ::v-deep .AiCard {
::v-deep .u-card__body { background: #f3f6f9;
.body { .start {
position: relative; background: #fff;
.u-body-item { padding: 32px;
border-radius: 16px;
.title { .title {
font-size: 36px; font-size: 32px;
font-weight: 500; font-weight: 500;
color: #333333;
margin-bottom: 16px; margin-bottom: 16px;
} }
.flex { .flex {
@@ -172,6 +200,17 @@ uni-page-body {
} }
} }
} }
.mask {
.moreMenu {
.menu {
text-align: center;
line-height: 80px;
width: 192px;
height: 80px;
font-size: 28px;
font-weight: 400;
color: #333333;
}
} }
} }
} }

View File

@@ -25,13 +25,32 @@ export default {
components: {}, components: {},
props: {}, props: {},
data() { data() {
return {} return {
data: [],
id: '',
}
}, },
computed: {}, computed: {},
watch: {}, watch: {},
created() {}, onLoad(o) {
this.id = o.id
this.$dict.load('realityStatus').then(() => {
// this.getDetail()
})
},
mounted() {}, mounted() {},
methods: {}, methods: {
getDetail() {
this.$http.post(`/app/appvisitvondolence/queryDetailById?id=${this.id}`).then((res) => {
if (res?.data) {
this.data = res.data
if (this.data.images) {
this.data.images = JSON.parse(this.data.images || '[]')
}
}
})
},
},
} }
</script> </script>

View File

@@ -4,34 +4,30 @@
<div class="header-description"> <div class="header-description">
<u-form :model="forms" ref="uForm" label-width="auto"> <u-form :model="forms" ref="uForm" label-width="auto">
<u-form-item label="区域选择" prop="areaId" style="position: relative"> <u-form-item label="区域选择" prop="areaId" style="position: relative">
<AiAreaPicker v-model="forms.areaId" ref="areaIds" :areaId="areaIdProps" @select="areaSelect" <AiAreaPicker v-model="forms.areaId" ref="areaIds" :areaId="areaIdProps" @select="areaSelect" style="color: #333"></AiAreaPicker>
style="color: #333"></AiAreaPicker>
</u-form-item> </u-form-item>
<u-form-item label="走访对象" prop="create_user_name" required style="position: relative"> <u-form-item label="走访对象" prop="create_user_name" required style="position: relative">
<u-input v-model="forms.create_user_name" disabled placeholder="请选择走访对象" @click="toWalkObject"/> <u-input v-model="forms.create_user_name" disabled placeholder="请选择走访对象" @click="toWalkObject" />
<u-icon name="arrow-right" color="#CCCCCC" style="position: absolute; top: 25px; right: 30px"></u-icon> <u-icon name="arrow-right" color="#CCCCCC" style="position: absolute; top: 25px; right: 30px"></u-icon>
</u-form-item> </u-form-item>
<u-form-item label="现实状态" prop="reality" style="position: relative"> <u-form-item label="现实状态" prop="reality" style="position: relative">
<u-input v-model="forms.reality" disabled placeholder="请选择走访慰问对象" @click="showStstus = true"/> <u-input v-model="forms.reality" disabled placeholder="请选择走访慰问对象" @click="showStstus = true" />
<u-select v-model="showStstus" :list="$dict.getDict('realityStatus')" value-name="dictValue" <u-select v-model="showStstus" :list="$dict.getDict('realityStatus')" value-name="dictValue" label-name="dictName" @confirm="realityStstus"></u-select>
label-name="dictName" @confirm="realityStstus"></u-select>
<u-icon name="arrow-right" color="#CCCCCC" style="position: absolute; top: 25px; right: 30px"></u-icon> <u-icon name="arrow-right" color="#CCCCCC" style="position: absolute; top: 25px; right: 30px"></u-icon>
</u-form-item> </u-form-item>
<u-form-item label="入户走访事项" prop="title" required label-position="top"> <u-form-item label="入户走访事项" prop="title" required label-position="top">
<u-input v-model="forms.title" placeholder="请输入入户走访事项(30字以内)" type="textarea" auto-height height="60" <u-input v-model="forms.title" placeholder="请输入入户走访事项(30字以内)" type="textarea" auto-height height="60" maxlength="30" />
maxlength="30"/>
<div>{{ forms.title.length }}/30</div> <div>{{ forms.title.length }}/30</div>
</u-form-item> </u-form-item>
<u-form-item label="入户走访内容" prop="description" label-position="top"> <u-form-item label="入户走访内容" prop="description" label-position="top">
<u-input v-model="forms.description" placeholder="请输入入户走访事项(500字以内)" type="textarea" auto-height height="60" <u-input v-model="forms.description" placeholder="请输入入户走访事项(500字以内)" type="textarea" auto-height height="60" maxlength="500" />
maxlength="500"/>
<div>{{ forms.description.length }}/500</div> <div>{{ forms.description.length }}/500</div>
</u-form-item> </u-form-item>
@@ -51,7 +47,7 @@
</template> </template>
<script> <script>
import {mapState} from 'vuex' import { mapState } from 'vuex'
import walkObject from './walkObject' import walkObject from './walkObject'
export default { export default {
@@ -83,7 +79,7 @@ export default {
clickedUserSelect: false, clickedUserSelect: false,
} }
}, },
computed: {...mapState(['user'])}, computed: { ...mapState(['user']) },
created() { created() {
this.areaIdProps = this.user.areaId this.areaIdProps = this.user.areaId
this.$dict.load('realityStatus').then(() => { this.$dict.load('realityStatus').then(() => {
@@ -106,7 +102,6 @@ export default {
}, },
submit() { submit() {
console.log(1)
if (this.flag) return if (this.flag) return
this.$refs.uForm.validate((valid) => { this.$refs.uForm.validate((valid) => {
@@ -121,8 +116,7 @@ export default {
const imgs = [] const imgs = []
if (this.forms.images) { if (this.forms.images) {
this.forms.images.map((e) => { this.forms.images.map((e) => {
console.log(e) imgs.push({ url: e.url, id: e.id })
imgs.push({url: e.url, id: e.id})
}) })
} }
@@ -142,13 +136,10 @@ export default {
id: this.id, id: this.id,
}) })
.then((res) => { .then((res) => {
console.log(4)
if (res.code == 0) { if (res.code == 0) {
console.log(5)
this.$u.toast('保存成功') this.$u.toast('保存成功')
this.flag = false this.flag = false
uni.navigateTo({url: `./AppWalkask`}) uni.navigateTo({ url: `./AppWalkask` })
console.log(6)
} }
}) })
} else { } else {