/*我的项目*/
<template>
  <div class="myproject">
    <div class="title">
      <span>我的项目</span>
    </div>
    <div class="btn">
      <el-row>
      <el-button class="btn_color1" @click="dialogVisible = true">新建项目</el-button>
      <el-button class="btn_color1">新建文件夹</el-button>
      <el-button type="warning">导入</el-button>
</el-row>
    </div>
    <div class="scher">
      <span></span>
      <span class="xuanzhogn">1个已选中</span>|
      <div class="input">
      <el-select v-model="value" placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
      <el-input v-model="input" class="text" ></el-input>

      </div>
    </div>
    <!-- 表格 -->
     <template>
    <el-table
      :data="tableData"
      class="lbg_color2"
      @row-click="rowclinck"
      style="width: 100%">
      <el-table-column
        label="名称"
        prop="name"
        >
      </el-table-column>
      <el-table-column
      prop="date"
        label="最近编辑时间"
        >
       
      </el-table-column>
      <el-table-column
         prop="address"
        label="所有者">
       
      </el-table-column>
    </el-table>
  </template>
  <!-- 、新建文件 -->
<el-dialog
  title="创建新项目"
  :visible.sync="dialogVisible"
  width="30%"
>
       <el-form>
   <el-form-item>
      <span class="sblock">项目类型</span>
          <el-radio  v-model="project.fileType" label="binary"
            >公开</el-radio
          >
          <el-radio v-model="project.fileType" label="ascii">私有</el-radio>
        </el-form-item>
 
        <div class="disflex">
          <span class="sblock">项目名称：</span>
          <el-input class="inpwidth" v-model="project.name"></el-input>
        </div>
       </el-form>
  <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
  </span>
</el-dialog>

  </div>
</template>

<script>

export default {
  name: 'Project',
  data() {
    return {
        options:[{
          value: '0',
          label: '搜索项目'
        }, {
          value: '1',
          label: '搜索标签'
        }
        ],
        value:'0',
        input:'',
             tableData: [{
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄'
          }, {
            date: '2016-05-04',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1517 弄'
          }, {
            date: '2016-05-01',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1519 弄'
          }, {
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄'
          }],
           dialogVisible: false,
           project:{
             fileType:"公开",
             name:''
           }
    }
  },
  created() {

  },
  methods: {
    rowclinck(){
      this.$router.push({path:'/index',query:{setid:123456}});
    }
  }
}
</script>

<style lang="scss" scoped>
@import '@/styles/variables.scss';
@import '@/styles/mixin.scss';
.myproject{
  padding: 15px;
}
.myproject .title span{
  font-size: 26px;
  display: inline-block;
     color: #b6b6b6;

}
.btn{
  padding: 10px;
  display: flex;
  justify-content: flex-end;
}
.scher{
  display: flex;
  padding-bottom: 15px;
}
.scher span{
  font-size: 16px;
  height: 40px;
  line-height: 40px;
  display: inline-block;
  
}
.xuanzhogn{
  font-size: 16px;
     color: #b6b6b6;
}
.scher .input{
  width: 30%;
    box-sizing: border-box;
   border:1px solid transparent;
  &:hover{
border: 1px solid #666;
transition: 0.5s linear; 
position:relative;  
-moz-box-sizing: border-box; 
 box-sizing: border-box; 
  }
}
.scher .el-select{
  width: 110px;
}
.input{
  display: flex;
}
.input .text{
  flex:1;
}

//  .el-table, .el-table__expanded-cell{
//   background-color:#333;
//  }
 
</style>
<style >
.scher .el-input__inner{
  border-radius: 0;
  border: none;
}

</style>



