1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192 |
- <template>
- <div class="sub_stage">
- <tit :tname="name"/>
- <!-- 选择大区 -->
- <ul class="stage_box">
- <li
- v-for="(item,index) in stages"
- :key="index"
- >{{ item.text }}</li>
- </ul>
- <!-- end:选择大区 -->
- <button>确定</button>
- </div>
- </template>
- <script>
- import tit from '~/components/titles.vue'
- export default {
- data() {
- return {
- name:'选择阶段',
- stages: [
- { text: '全部' },
- { text: '规划可研' },
- { text: '立项审批' },
- { text: '项目设计' },
- { text: '土建设备招标采购' },
- { text: '施工建设' },
- { text: '项目完工(投产)' },
- { text: '其他' },
-
- ],
- }
- },
- methods:{
- chooseOne: function(index){
- this.current=index;
- }
- },
- components:{
- tit,
- }
- }
- </script>
-
- <style>
- .sub_stage{
-
- }
- .sub_stage .stage_box{
- width: 100%;
- padding-left: 15px;
- }
- .sub_stage .stage_box li{
- color: #202020;
- line-height: 60px;
- transition: 0.2s;
- position: relative;
- background-image: url('../..//static/img/icon_select.png');
- background-position: right center;
- background-size: 20px;
- background-repeat: no-repeat;
- }
- .sub_stage .stage_box li::after{
- position: absolute;
- content: '';
- display: block;
- width: 100%;
- height: 1px;
- left: 0;
- bottom: 0;
- right: 0;
- padding-right: 1.5rem;
- background-color: #f0f0f0;
- }
- .sub_stage .stage_box li.active{
-
- }
- .sub_stage button{
- width: 100%;
- height: 50px;
- position: absolute;
- bottom: 0;
- left: 0;
- border: none;
- background: #ff5c5c;
- font-size: 18px;
- font-family: PingFang-SC-Medium;
- font-weight: 500;
- color: white;
- }
- </style>
|