zhongshujie
2025-04-03 0523065a9277e0d11b82cd19e0684b86361b1f06
src/views/achievements/index.vue
@@ -1,14 +1,112 @@
<template>
  <div>学术成果</div>
  <div class="page">
    <div class="page-header">
      <p>王永炎院士学术成果</p>
    </div>
    <!-- 搜索框 -->
    <ul class="page-input">
      <li class="input-main">
        <el-input placeholder="请输入内容" v-model="input3" class="input-with-select" suffix="搜索">
          <el-select v-model="select" slot="prepend" placeholder="请选择">
            <el-option label="餐厅名" value="1"></el-option>
            <el-option label="订单号" value="2"></el-option>
            <el-option label="用户电话" value="3"></el-option>
          </el-select>
          <el-button slot="append" >搜索</el-button>
        </el-input>
      </li>
      <li class="input-txt" @click="isDisplay = !isDisplay">
        高级检索
        <img v-if="isDisplay" src="../../assets/images/achievements/top-Icon.png" alt="">
        <img v-else src="../../assets/images/achievements/bottom-Icon.png" alt="">
      </li>
    </ul>
    <!-- 高级搜索 -->
    <div v-if="isDisplay">
      123
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      isDisplay: false,
      input3: '',
    }
  },
  methods: {
  }
}
</script>
<style>
<style lang="less" scoped>
.page {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  background-color: #e9e1d4;
  overflow: auto;
}
.page-header {
  height: 102px;
  width: 100%;
  text-align: left;
  margin-bottom: 8px;
  border-bottom: 2px solid #937950;
  p {
    padding: 35px 0 34px 0;
    font-family: Alimama DongFangDaKai;
    font-size: 30px;
    text-indent: 1em;
    border-bottom: 1px solid #937950;
  }
}
.page-input {
  width: 1330px;
  margin: 0 auto;
  display: flex;
  background-color: #fff;
}
.input-main {
  padding: 15px 0;
  text-align: center;
  width: 90%;
  border-right: 2px solid #E4DACE;
  .input-with-select{
    width: 50%;
  }
}
.input-txt {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 10%;
  padding: 15px 0;
  font-family: Source Han Sans;
  font-size: 14px;
  font-weight: bold;
  color: #6F5A3A;
  cursor: pointer;
  img {
    width: 10px;
    height: auto;
    margin-left: 5px;
  }
}
el-input__suffix {
right: 22px;
color: #999;
}
</style>