123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116 |
- <template>
- <div id="activitys">
- <template v-if="view === 'lab'">
- <div class="view">
- 当前处于:
- <el-tooltip class="item" effect="dark" placement="bottom">
- <template #content> {{ getProp('start_time') }} 至 {{ getProp('end_time') }} </template>
- <el-link>{{ getProp('year') }}年度-{{ getProp('name') }}</el-link>
- </el-tooltip>
- 时间内
- </div>
- </template>
- <template v-else-if="view === 'admin'">
- <el-row class="rows">
- <el-col :span="24">当前处于:</el-col>
- <el-col :span="24" v-if="preparing._id">
- 筹建期:
- <el-tooltip class="item" effect="dark" placement="bottom">
- <template #content> {{ getProp('start_time', preparing) }} 至 {{ getProp('end_time', preparing) }} </template>
- <el-link>{{ getProp('year', preparing) }}年度-{{ getProp('name', preparing) }}</el-link>
- </el-tooltip>
- 时间内
- <el-divider direction="vertical"></el-divider>
- </el-col>
- <el-col :span="24" v-if="working._id">
- 正常运营期:
- <el-tooltip class="item" effect="dark" placement="bottom">
- <template #content> {{ getProp('start_time', working) }} 至 {{ getProp('end_time', working) }} </template>
- <el-link>{{ getProp('year', working) }}年度-{{ getProp('name', working) }}</el-link>
- </el-tooltip>
- 时间内
- </el-col>
- </el-row>
- </template>
- </div>
- </template>
- <script>
- const _ = require('lodash');
- const moment = require('moment');
- import { mapState, createNamespacedHelpers } from 'vuex';
- const { mapActions } = createNamespacedHelpers('activitys');
- export default {
- name: 'activitys',
- props: {},
- components: {},
- data: function() {
- return {
- view: '',
- preparing: {},
- working: {},
- };
- },
- computed: {
- ...mapState(['user', 'isInAct']),
- },
- created() {
- if (this.user.role_id === 'admin' || this.user.role_type === '1') {
- // 管理员/超级管理员: 显示当前正处于哪个活动时间段,显示标题;
- this.view = 'admin';
- this.getActingTime();
- } else {
- // 显示自己处于哪个时间段即可
- this.view = 'lab';
- }
- },
- methods: {
- ...mapActions(['query']),
- getProp(prop, data = {}) {
- if (this.view === 'lab') data = this.isInAct;
- return _.get(data, prop);
- },
- async getActingTime() {
- const res = await this.query({ is_use: '0' });
- if (this.$checkRes(res)) {
- const data = res.data;
- const working = data.find(f => f.type === '1');
- if (working) {
- const { start_time, end_time } = working;
- const is_in = moment().isBetween(start_time, end_time, null, '[]');
- console.log(is_in);
- if (is_in) this.$set(this, `working`, working);
- }
- const preparing = data.find(f => f.type === '-1');
- if (preparing) {
- const { start_time, end_time } = preparing;
- const is_in = moment().isBetween(start_time, end_time, null, '[]');
- console.log(is_in);
- if (is_in) this.$set(this, `preparing`, preparing);
- }
- }
- },
- },
- };
- </script>
- <style lang="less" scoped>
- .view {
- color: white;
- font-weight: 700;
- padding: 15px 0;
- font-size: 14px;
- .el-link {
- font-size: 16px;
- color: red;
- }
- }
- .rows {
- color: white;
- font-size: 14px;
- .el-link {
- font-size: 16px;
- color: red;
- }
- }
- </style>
|