<template>
  <div class="main fr">
    <h4><a href="/">首页</a> > 学生成绩</h4>

    <div class="content ov bgf scoreListDetail " style="padding:0 20px;">
      <h5 class="content-title">2019级上学期·第一次模拟考试成绩公布</h5>
      <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>
      <div class="txt">
        <ul class="ov tc">
          <li class="table-head">
            <ol>
              <li>姓名</li>
              <li>学号 <i></i></li>
              <li>分数 <i></i></li>
              <li>排名 <i></i></li>
              <li>排名变化 <i></i></li>
            </ol>
          </li>
          <li>
            <ol>
              <li>李四</li>
              <li>201901001</li>
              <li>495</li>
              <li>1</li>
              <li>1</li>
            </ol>
          </li>
          <li>
            <ol>
              <li>李四</li>
              <li>201901001</li>
              <li>495</li>
              <li>1</li>
              <li>1</li>
            </ol>
          </li>
          <li>
            <ol>
              <li>李四</li>
              <li>201901001</li>
              <li>495</li>
              <li>1</li>
              <li>1</li>
            </ol>
          </li>
          <li>
            <ol>
              <li>李四</li>
              <li>201901001</li>
              <li>495</li>
              <li>1</li>
              <li>1</li>
            </ol>
          </li>
          <li>
            <ol>
              <li>李四</li>
              <li>201901001</li>
              <li>495</li>
              <li>1</li>
              <li>1</li>
            </ol>
          </li>
          <li>
            <ol>
              <li>李四</li>
              <li>201901001</li>
              <li>495</li>
              <li>1</li>
              <li>1</li>
            </ol>
          </li>
          <li>
            <ol>
              <li>李四</li>
              <li>201901001</li>
              <li>495</li>
              <li>1</li>
              <li>1</li>
            </ol>
          </li>
          <li>
            <ol>
              <li>李四</li>
              <li>201901001</li>
              <li>495</li>
              <li>1</li>
              <li>1</li>
            </ol>
          </li>
          <li>
            <ol>
              <li>李四</li>
              <li>201901001</li>
              <li>495</li>
              <li>1</li>
              <li>1</li>
            </ol>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: "index",
    data(){
      return{
        modal1: false,
        formItem: {
          input: '',
          textarea: ''
        }
      }
    },
    methods: {
      ok () {
        this.$Message.info('发布成功');
      },
      // cancel () {
      //   this.$Message.info('');
      // }
      yes () {
        this.modal1 = false;
        this.$Message.success('发布成功');
      },
      cancel () {
        this.modal1 = false;
      }
    }
  }
</script>

<style scoped>

</style>
