TEAMModelOS/TEAMModelOS.SmartTeach/ClientApp/view/resource/activity_certificate.vue

<template>
  <div class="activity_container">
    <Header></Header>
    <Activitycommon></Activitycommon>
    <div class="activity_certificate">
      <div class="activity_certificate_box">
        <div class="rowWrap py_white_bg pdt30">
          <div class="w1200 ni_g_are_s pdt20 ni_g_bg_e8f4ff">
            <!--下拉插件 S-->
            <Select v-model="model1" style="width:200px;margin-right:30px;">
              <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
            </Select>
            <!--下拉插件 E-->
            <!--下拉插件 S-->
            <Select v-model="model2" style="width:200px;margin-right:30px;">
              <Option v-for="itemc in cityList2" :value="itemc.value" :key="itemc.value">{{ itemc.label }}</Option>
            </Select>
            <!--下拉插件 E-->
            <!--下拉插件 S-->
            <Select v-model="model3" style="width:200px;margin-right:30px;">
              <Option v-for="itemm in cityList3" :value="itemm.value" :key="itemm.value">{{ itemm.label }}</Option>
            </Select>
            <!--下拉插件 E-->
            <!--下拉插件 S-->
            <Select v-model="model4" style="width:200px;margin-right:30px;">
              <Option v-for="itemy in cityList4" :value="itemy.value" :key="itemy.value">{{ itemy.label }}</Option>
            </Select>
            <!--下拉插件 E-->
            <div class="ni_g_search fr mgr20">
              <input type="text" placeholder="请输入证书编号或获奖者姓名" class="inp ni_g_w230">
              <a class="ni_button" href="javascript:" onclick="loadlist()"></a>
            </div>
          </div>
          <div class="w1200 ni_g_bg_fafafa pdtb30 ni_g_cup_s  ni_g_txt_center">
            <table class="adm_table mgb20" width="100%" cellspacing="0" cellpadding="0" border="0">
              <tbody>
                <tr>
                  <th width="5%" style="text-align:center">序号</th>
                  <th width="*" style="text-align:center">证书编号</th>
                  <th width="10%" style="text-align:center">获奖者</th>
                  <th width="17%" style="text-align:center">区域</th>
                  <th width="16%" style="text-align:center">学校</th>
                  <th width="10%" style="text-align:center">奖项</th>
                  <th width="16%" style="text-align:center">颁发机构</th>
                  <th width="10%" style="text-align:center">操作</th>
                </tr>
                <tr>
                  <td colspan="20">未搜索到课题证书</td>
                </tr>
              </tbody>
            </table>
            <div class="mgt30 t_c">

            </div>
          </div>
        </div>
      </div>
    </div>
    <Footer></Footer>
  </div>
</template>
<script>
import Header from '@/common/headers.vue'
  import Footer from '@/common/footer.vue'
  import Activitycommon from '@/components/resource/activitycommon.vue'
  export default {
    components: {
      Header,
      Footer,
      Activitycommon,
    },
    data() {
      return {
        cityList: [
          {
            value: '全部',
            label: '全部'
          },
          {
            value: '四川省',
            label: '四川省'
          },
          {
            value: '山东省',
            label: '山东省'
          },
          {
            value: '贵州省',
            label: '贵州省'
          },
          {
            value: '上海市',
            label: '上海市'
          },
          {
            value: '广东省',
            label: '广东省'
          },
          {
            value: '重庆市',
            label: '重庆市'
          }
        ],
        model1: '全部',
        cityList2: [
          {
            value: '全部',
            label: '全部'
          },
          {
            value: '成都市',
            label: '成都市'
          },
          {
            value: '雅安市',
            label: '雅安市'
          },
          {
            value: '宜宾市',
            label: '宜宾市'
          },
          {
            value: '绵阳市',
            label: '绵阳市'
          },
          {
            value: '眉山市',
            label: '眉山市'
          },
          {
            value: '达州市',
            label: '达州市'
          },
          {
            value: '广安市',
            label: '广安市'
          }
        ],
        model2: '全部',
        cityList3: [
          {
            value: '全部',
            label: '全部'
          },
        ],
        model3: '全部',
        cityList4: [
          {
            value: '全部',
            label: '全部'
          },
        ],
        model4: '全部',
      }
    }
  }
</script>
<style scoped>
  .activity_certificate {
    width:100%;
    height:auto;
  }
  .activity_certificate_box {
    width:1200px;
    height:auto;
    margin:0 auto;
  }
  .rowWrap {
    width: 100%;
  }
  .pdt30 {
    padding-top: 30px;
  }
  .ni_g_are_s {
    height: 57px;
  }
  .ni_g_bg_e8f4ff {
    background: #e8f4ff;
    padding:1%;
  }
  .fr {
    float: right;
  }
  .mgr20 {
    margin-right: 20px;
  }
  .ni_g_search .inp {
    padding-top: 9px;
    padding-bottom: 8px;
  }
  .inp {
    padding: 5px;
    border: 1px solid #d5d5d5;
    color: #888;
    outline: none;
    vertical-align: middle;
    height: 30px;
  }
  .ni_g_w230 {
    width: 180px;
  }
  .ni_g_search .ni_button {
    height: 30px;
    width: 38px;
    border: 1px solid #44a9f1;
    display: block;
    float: right;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    background: url(../../assets/image/resource/low_search_icon.png) no-repeat center center #56b8fd;
  }
  .ni_g_cup_s {
    position: relative;
  }
  .ni_g_txt_center {
    text-align: center;
    margin-top:2%;
    margin-bottom:5%;
  }
  .ni_g_bg_fafafa {
    background: #fafafa;
  }
  .adm_table {
    border: 1px solid #dbdce1;
  }
  .mgb20 {
    margin-bottom: 20px;
  }
  .adm_table tr th, .adm_table tr td {
    padding: 12px 10px;
  }
  .adm_table tr th {
    background: #f6f6f6;
    font-weight: normal;
    color: #222;
    text-align: left;
    font-family: "微软雅黑";
    font-size: 14px;
  }
  .adm_table tr td {
    border-top: 1px solid #dbdce1;
    font-family: "微软雅黑";
    font-size: 14px;
    color: #555;
  }
</style>