改造会议通知

This commit is contained in:
wanglei
2021-11-19 11:28:04 +08:00
parent c1a734355e
commit 00bf18dee6
4 changed files with 351 additions and 348 deletions

View File

@@ -94,9 +94,9 @@
}[status]
},
detail({id}) {
uni.navigateTo({
url: "/pages/meetingNotice/components/detail?id=" + id
})
this.comp="detail";
this.params = id;
this.isList = false;
},
getData() {
this.$http.post("/app/appmeetinginfo/list", null, {
@@ -139,7 +139,7 @@
},
onShow() {
this.$dict.load("meetingNoticeBefore", "meetingNoticeAfter");
this.$dict.load("meetingNoticeBefore", "meetingNoticeAfter","meetStatus");
this.getData()
}
}

View File

@@ -92,9 +92,9 @@
})
},
handleClick({id}) {
uni.navigateTo({
url: "/pages/meetingNotice/components/detail?id=" + id
})
this.$parent.params = id;
this.$parent.isList = false;
this.$parent.comp = "detail"
},
change(e) {
this.index = e.index

View File

@@ -82,148 +82,292 @@
</template>
<script>
import AiBack from "../../../components/AiBack";
import {mapActions} from "vuex";
import AiTopFixed from "../../../components/AiTopFixed";
import AiBack from "../../../components/AiBack";
import {mapActions} from "vuex";
import AiTopFixed from "../../../components/AiTopFixed";
export default {
name: "detail",
components: {AiBack, AiTopFixed},
data() {
return {
id: null,
detail: {},
list: false,
current: 0,
}
},
computed: {
tabs() {
return [
{name: this.count(0) + "人未确认"},
{name: this.count(1) + "人已确认"},
{name: this.count(2) + "人已请假"},
]
},
},
onLoad(opt) {
this.id = opt.id
this.$dict.load("meetStatus").then(_ => this.getDetail())
},
methods: {
count(sta) {
return this.detail.attendees?.filter(e => e.joinStatus == sta)?.length;
},
change(index) {
this.current = index;
},
call(item) {
if (item.phone) {
uni.makePhoneCall({
phoneNumber: item.phone
});
export default {
name: "detail",
components: {AiBack, AiTopFixed},
props: {
params: {
type: [String, Number]
}
},
...mapActions(['previewFile', 'injectJWeixin']),
preFile(e) {
if ([".jpg", ".png", ".gif"].includes(e.postfix.toLowerCase())) {
uni.previewImage({
current: e.url,
urls: [e.url]
})
} else {
this.previewFile({...e})
}
},
tag(status) {
data() {
return {
"1": "common/2confirmed2.png",
"2": "common/2absent2.png"
}[status]
detail: {},
list: false,
current: 0,
}
},
updateStatus(status) {
this.$http.post(status == 0 ? "/app/appmeetinginfo/absent" : "/app/appmeetinginfo/confirm", null, {
params: {
meetingId: this.id,
reason: status == 0 ? "" : null
}
}).then(res => {
if (res.code == 0) {
this.$u.toast(status == 0 ? "请假成功" : "确认成功")
this.getDetail()
}
})
computed: {
tabs() {
return [
{name: this.count(0) + "人未确认"},
{name: this.count(1) + "人已确认"},
{name: this.count(2) + "人已请假"},
]
},
},
color(status) {
if (status == 1) {
return "#FF8822"
}
if (status == 2) {
return "#1365DD"
}
if (status == 3) {
return "#FF4466"
}
return "#343D65"
},
getDetail() {
this.$http.post("/app/appmeetinginfo/info-id", null, {
params: {id: this.id}
}).then(res => {
if (res && res.data) {
this.detail = res.data
methods: {
count(sta) {
return this.detail.attendees?.filter(e => e.joinStatus == sta)?.length;
},
change(index) {
this.current = index;
},
call(item) {
if (item.phone) {
uni.makePhoneCall({
phoneNumber: item.phone
});
}
})
}
},
filters: {
transform(status) {
if (status == 1) {
return "已确认"
},
...mapActions(['previewFile', 'injectJWeixin']),
preFile(e) {
if ([".jpg", ".png", ".gif"].includes(e.postfix.toLowerCase())) {
uni.previewImage({
current: e.url,
urls: [e.url]
})
} else {
this.previewFile({...e})
}
},
tag(status) {
return {
"1": "common/2confirmed2.png",
"2": "common/2absent2.png"
}[status]
},
updateStatus(status) {
this.$http.post(status == 0 ? "/app/appmeetinginfo/absent" : "/app/appmeetinginfo/confirm", null, {
params: {
meetingId: this.id,
reason: status == 0 ? "" : null
}
}).then(res => {
if (res.code == 0) {
this.$u.toast(status == 0 ? "请假成功" : "确认成功")
this.getDetail()
}
})
},
color(status) {
if (status == 1) {
return "#FF8822"
}
if (status == 2) {
return "#1365DD"
}
if (status == 3) {
return "#FF4466"
}
return "#343D65"
},
getDetail() {
this.$http.post("/app/appmeetinginfo/info-id", null, {
params: {id: this.params}
}).then(res => {
if (res && res.data) {
this.detail = res.data
}
})
}
if (status == 2) {
return "已请假"
},
created() {
this.getDetail();
},
filters: {
transform(status) {
if (status == 1) {
return "已确认"
}
if (status == 2) {
return "已请假"
}
}
}
}
}
</script>
<style lang="scss" scoped>
.detail {
min-height: 100%;
background-color: #F5F5F5;
padding-bottom: 140px;
::v-deep .AiTopFixed {
margin-bottom: 16px;
.content {
padding: 0 !important;
}
}
.att-list {
.detail {
min-height: 100%;
background-color: #F5F5F5;
padding-bottom: 140px;
.att-wrap {
display: flex;
height: 112px;
align-items: center;
justify-content: space-between;
background-color: #ffffff;
::v-deep .AiTopFixed {
margin-bottom: 16px;
.content {
padding: 0 !important;
}
}
.att-list {
min-height: 100%;
.att-wrap {
display: flex;
height: 112px;
align-items: center;
justify-content: space-between;
background-color: #ffffff;
box-sizing: border-box;
padding: 0 50px;
border-bottom: 1px solid #E4E5E6;
.left {
display: flex;
align-items: center;
&:after {
content: "";
position: absolute;
right: 0;
bottom: 0;
width: 622px;
height: 2px;
background-color: rgba(216, 221, 230, 0.5);
}
.name {
font-size: 30px;
font-weight: 600;
color: #333333;
}
}
& > img {
width: 48px;
height: 48px;
}
}
}
.card {
background-color: #FFFFFF;
margin-bottom: 8px;
box-sizing: border-box;
padding: 0 50px;
border-bottom: 1px solid #E4E5E6;
padding: 16px 32px;
.left {
header {
font-size: 40px;
font-weight: 600;
color: #333333;
line-height: 64px;
letter-spacing: 1px;
}
.u-row {
& > div {
background-color: #2266FF;
border-radius: 50%;
text-align: center;
font-size: 22px;
font-weight: bold;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
}
& > span {
font-size: 30px;
color: #343D65;
margin-left: 16px;
}
::v-deep .u-avatar__img {
width: 56px;
height: 56px;
vertical-align: middle;
}
img {
width: 48px;
height: 48px;
}
}
& > span {
font-size: 32px;
color: #333333;
line-height: 48px;
letter-spacing: 1px;
display: inline-block;
box-sizing: border-box;
padding: 16px 0;
}
.label {
height: 96px;
font-size: 32px;
color: #333333;
display: flex;
align-items: center;
margin-bottom: 16px;
}
.file {
height: 128px;
background: #FFFFFF;
border-radius: 8px;
border: 1px solid #CCCCCC;
box-sizing: border-box;
padding: 0 16px;
margin-bottom: 32px;
& > .u-row {
height: 100%;
.left {
width: 522px;
display: flex;
align-items: center;
& > img {
width: 96px;
height: 96px;
}
& > span {
font-size: 32px;
color: #333333;
display: inline-block;
line-height: 44px;
}
}
& > span {
font-size: 28px;
color: #999999;
}
}
}
.active {
background-color: #F3F6F9;
}
.name {
font-size: 32px;
font-weight: 400;
color: #333333;
}
.wrap {
height: 112px;
display: flex;
align-items: center;
position: relative;
&:after {
content: "";
@@ -235,244 +379,103 @@ export default {
background-color: rgba(216, 221, 230, 0.5);
}
.name {
font-size: 30px;
& > label {
width: 80px;
height: 80px;
border-radius: 50%;
background-color: #4E8EEE;
font-size: 28px;
font-weight: 600;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
}
}
}
.item-wrap {
height: 112px;
padding: 0 32px;
.u-row {
height: 100%;
& > span {
font-size: 32px;
font-weight: 400;
color: #333333;
}
}
& > img {
width: 48px;
height: 48px;
.right {
font-size: 28px;
color: #999999;
display: flex;
align-items: center;
em {
font-style: normal;
color: #1365DD;
}
.right-arrow {
width: 16px;
height: 16px;
border-top: 5px solid #CCCCCC;
border-right: 5px solid #CCCCCC;
transform: rotate(45deg);
}
}
}
}
.card {
background-color: #FFFFFF;
margin-bottom: 8px;
box-sizing: border-box;
padding: 16px 32px;
.footer {
height: 112px;
width: 100%;
position: fixed;
left: 0;
bottom: 0;
background-color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
header {
font-size: 40px;
font-weight: 600;
color: #333333;
line-height: 64px;
letter-spacing: 1px;
}
.u-row {
& > div {
background-color: #2266FF;
border-radius: 50%;
text-align: center;
font-size: 22px;
font-weight: bold;
color: #FFFFFF;
font-size: 36px;
color: #333333;
}
& > div:first-child {
width: 270px;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
& > span {
font-size: 30px;
color: #343D65;
margin-left: 16px;
}
::v-deep .u-avatar__img {
width: 56px;
height: 56px;
vertical-align: middle;
}
img {
width: 48px;
height: 48px;
}
}
& > span {
font-size: 32px;
color: #333333;
line-height: 48px;
letter-spacing: 1px;
display: inline-block;
box-sizing: border-box;
padding: 16px 0;
}
.label {
height: 96px;
font-size: 32px;
color: #333333;
display: flex;
align-items: center;
margin-bottom: 16px;
}
.file {
height: 128px;
background: #FFFFFF;
border-radius: 8px;
border: 1px solid #CCCCCC;
box-sizing: border-box;
padding: 0 16px;
margin-bottom: 32px;
& > .u-row {
& > div:last-child {
width: calc(100% - 270px);
height: 100%;
.left {
width: 522px;
display: flex;
align-items: center;
& > img {
width: 96px;
height: 96px;
}
& > span {
font-size: 32px;
color: #333333;
display: inline-block;
line-height: 44px;
}
}
& > span {
font-size: 28px;
color: #999999;
}
}
}
.active {
background-color: #F3F6F9;
}
.name {
font-size: 32px;
font-weight: 400;
color: #333333;
}
.wrap {
height: 112px;
display: flex;
align-items: center;
position: relative;
&:after {
content: "";
position: absolute;
right: 0;
bottom: 0;
width: 622px;
height: 2px;
background-color: rgba(216, 221, 230, 0.5);
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
background-color: #1365DD;
}
& > label {
width: 80px;
height: 80px;
border-radius: 50%;
background-color: #4E8EEE;
font-size: 28px;
font-weight: 600;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
}
}
}
.item-wrap {
height: 112px;
padding: 0 32px;
.u-row {
height: 100%;
& > span {
font-size: 32px;
font-size: 36px;
font-weight: 400;
color: #333333;
}
}
.right {
font-size: 28px;
color: #999999;
display: flex;
align-items: center;
em {
font-style: normal;
color: #1365DD;
color: #999999;
}
.right-arrow {
width: 16px;
height: 16px;
border-top: 5px solid #CCCCCC;
border-right: 5px solid #CCCCCC;
transform: rotate(45deg);
img {
width: 158px;
height: 104px;
position: absolute;
right: 0;
top: 0;
}
}
}
.footer {
height: 112px;
width: 100%;
position: fixed;
left: 0;
bottom: 0;
background-color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
& > div {
font-size: 36px;
color: #333333;
}
& > div:first-child {
width: 270px;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
& > div:last-child {
width: calc(100% - 270px);
height: 100%;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
background-color: #1365DD;
}
& > label {
font-size: 36px;
font-weight: 400;
color: #999999;
}
img {
width: 158px;
height: 104px;
position: absolute;
right: 0;
top: 0;
}
}
}
</style>

View File

@@ -63,13 +63,13 @@
methods: {
detail({id}) {
let url
this.$parent.params = id;
this.$parent.isList = false;
if (this.params == 2) {
url = "/pages/meetingNotice/components/addMeeting?id=" + id
this.$parent.comp = "addMeeting"
} else {
url = "/pages/meetingNotice/components/detail?id=" + id
this.$parent.comp = "detail"
}
uni.navigateTo({url})
},
tag(status) {
return {