TEAMModelOS/TEAMModelOS.TeachZone/ClientApp/view/notice.vue

<template>
  <div id="app">
    <Header></Header>
    <Master></Master>
    <div class="wrap ov">
      <Left></Left>
      <div class="main fr">
        <h4><a href="/">首页</a> > 班级通知</h4>
        <div class="content ov bgf ">
          <dl class="notice" style="width: 100%;">
            <dt>班级通知 <!--<a href="" class="fr">更多+</a>--></dt>
            <div class="oper">
              <Button type="info" @click="modal1 = true">发布通知</Button>
              <Modal
                v-model="modal1" class-name="vertical-center-modal" footer-hide="true"
                title="发布通知"
                @on-ok="ok"
                @on-cancel="cancel">
                <Form :model="formItem" :label-width="80">
                  <FormItem label="通知标题">
                    <Input v-model="formItem.input" placeholder="请输入通知标题"></Input>
                  </FormItem>

                  <FormItem label="通知内容">
                    <Input v-model="formItem.textarea" type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder="请输入通知内容"></Input>
                  </FormItem>
                  <FormItem>
                    <Button type="primary" @click="yes">发布</Button>
                    <Button style="margin-left: 8px" @click="cancel">取消</Button>
                  </FormItem>
                </Form>
              </Modal>
            </div>
            <dd v-for="item in list"><a href="/noticeDetail">{{item.title}}<span>{{item.date}}</span></a></dd>
          </dl>
          <Page :total="100"  size="small" show-total class="fr" />
        </div>
      </div>
    </div>
    <Footer></Footer>
  </div>
</template>
<script>
  import Header from '@/common/header.vue'
  import Master from '@/common/master.vue'
  import Left from '@/common/left.vue'
  import Footer from '@/common/footer.vue'
  export default {
    components: {
      Header,
      Master,
      Left,
      Footer
    },
    data () {
      return {
        modal1: false,
        formItem: {
          input: '',
          textarea: ''
        },
        list:[
          {
            title:'2019.4.9 核心素养深入研究，开拓视野精彩纷呈。',
            date:'2019-05-09'
          },
          {
            title:'5月10日上午8点举行奥运知识抢答赛，请班级成员准时参加。',
            date:'2019-05-09'
          },
          {
            title:'2019年4月28日四年级教研活动通讯',
            date:'2019-05-09'
          },

          {
            title:'师退生进 让学生站在教室中央',
            date:'2019-05-09'
          },
          {
            title:'区数学高段“问题解决”专题 暨“老带青”教研活动通讯。',
            date:'2019-05-09'
          },
          {
            title:'2019年3月15日“图形的认识”专题教研活动通讯',
            date:'2019-05-09'
          },
          {
            title:'18.4.17“数学教师青年团”课堂教学能力提升培训活动简讯',
            date:'2019-05-09'
          },
          {
            title:'2018.9.11深入教材研究，共筑智慧课堂',
            date:'2019-05-09'
          },
        ]

      }
    },
    methods: {
      ok () {
        this.$Message.info('发布成功');
      },
      // cancel () {
      //   this.$Message.info('');
      // }
      yes () {
        this.modal1 = false;
        this.$Message.success('发布成功');
      },
      cancel () {
        this.modal1 = false;
      }
    }
    }
</script>