项目

src/router/index.js

@@ -331,9 +331,21 @@ export const constantRoutes = [
     path: '/Platform/projectManage',
     name: '项目管理',
     component: Layout,
-    redirect: '/Platform/projectManage/projectList',
+    redirect: '/Platform/projectManage/projectList/projectIndex',
     meta: { title: '项目管理', icon: '项目管理' },
     children: [
+      {
+        path: 'projectIndex',
+        name: '项目列表',
+        component: () => import('@/views/projectManage/projectList/projectIndex'),
+        meta: { title: '项目' }
+      },
+      {
+        path: 'projectViewDetails',
+        name: '项目详情',
+        component: () => import('@/views/projectManage/projectList/projectViewDetails'),
+        meta: { title: '项目详情' }
+      },
       {
         path: 'projectList',
         name: '项目列表',

src/views/Platform/projectPage.vue

@@ -196,7 +196,7 @@
           <el-input v-model="formQuery.name" autocomplete="off" placeholder="项目名称" />
         </el-form-item>
         <div style="display: flex;">
-          <div style="flex:1;">
+          <div style="flex:2;">
             <el-form-item label="业务线" prop="bizId" :label-width="formLabelWidths">
               <el-select v-model="formQuery.bizId" placeholder="业务线">
                 <el-option v-for="item in bizOptions" :key="item.value" :label="item.name" :value="item.name" />
@@ -213,7 +213,7 @@
               </el-select>
             </el-form-item>
           </div>
-          <div style="flex:1;">
+          <div style="flex:2;">
             <el-form-item label="优先级" prop="priorityString" :label-width="formLabelWidths">
               <el-select v-model="formQuery.priorityString" placeholder="优先级">
                 <el-option v-for="item in priorityStrings" :key="item.value" :label="item.name" :value="item.name" />

src/views/ToConfigure/configure.vue

@@ -27,9 +27,8 @@
             <el-table v-loading="loading" :data="tableData" :header-cell-style="{ background: '#F0F2F4', color: '#333B4A' }" size="mini" width="80%" border show-overflow-tooltip="true">
               <el-table-column label="团队名称" min-width="100" align="center"><template slot-scope="scope">{{ scope.row.teamName }}</template></el-table-column>
               <el-table-column label="团队属性" min-width="60" align="center"><template slot-scope="scope">{{ scope.row.teamAttribute[0] }}, {{ scope.row.teamAttribute[1] }}</template></el-table-column>
-              <el-table-column label="成员名单" min-width="120" align="center">
+              <el-table-column label="成员名单" min-width="120" align="center" show-overflow-tooltip>
                 <template slot-scope="scope">
-
                   <span v-for="(item1, index) in scope.row.memberName" :key="index+'a'">{{ item1 }}<span v-show="item1" style="color: red; margin-left: 2%;">Leader 、</span></span>
                   <span v-for="(item, index) in scope.row.memberName1" :key="index">{{ item }}、</span>
                 </template>
@@ -53,7 +52,7 @@
             <el-option v-for="item in arr_team" :key="item.code" :label="item.msg" :value="item.code" />
           </el-select>
         </el-form-item>
-        <el-form-item label="团队Lerader">
+        <el-form-item label="团队Leader">
           <el-select v-model="form.lerader" style="width: 100%;" multiple filterable remote reserve-keyword placeholder="请输入姓名或者邮箱前缀" :remote-method="remoteMethod" :loading="loading" @change="team_lerader(form.lerader)">
             <el-option v-for="item in options" :key="item.idap" :label="item.name" :value="test2(item, 1)">
               <span style="float: left">{{ item.name }}</span>
@@ -71,8 +70,8 @@
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button size="mini" type="primary" plain @click="Preservation(form)">保 存</el-button>
         <el-button size="mini" type="danger" plain @click="dialogFormVisible = false">取 消</el-button>
+        <el-button size="mini" type="primary" plain @click="Preservation(form)">保 存</el-button>
       </div>
     </el-dialog>
   </div>

src/views/projectManage/projectList/projectIndex.vue

@@ -0,0 +1,263 @@
+<template>
+  <div style="background-color:#F2F3F6;display:flex;align-items: center;justify-content: center;">
+    <el-container>
+      <el-header class="bgborder" style="display:flex;align-items: center;justify-content: center;">
+        <el-select id="basicName" v-model="value" clearable size="mini" placeholder="全部">
+          <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+        <el-select id="basicName" v-model="value" clearable size="mini" placeholder="业务线">
+          <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+        <el-select id="basicName" v-model="value" clearable size="mini" placeholder="项目类型">
+          <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+        <el-select id="basicName" v-model="value" clearable size="mini" placeholder="优先级">
+          <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+        <el-select id="basicName" v-model="value1" filterable remote reserve-keyword :remote-method="remoteMethod" :loading="loading" clearable size="mini" placeholder="负责人">
+          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+        <el-select id="basicName" v-model="value1" filterable remote reserve-keyword :remote-method="remoteMethod" :loading="loading" clearable size="mini" placeholder="创建人">
+          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+        <el-button type="primary" size="mini" style="float: right;">查询</el-button>
+        <el-button size="mini" style="float: right;">重置</el-button>
+      </el-header>
+      <el-main class="bgborder" style="min-height: 79.5vh;padding:0 !important">
+        <div style="margin: 1.5%; font-weight: 600; white-space: nowrap;"><b style="color: #409EFF;margin: 0 0.5%; font-size: 20px; ">I</b>项目列表 <el-button type="primary" size="mini" icon="el-icon-plus" style="float: right;" @click="dialogFormVisible = true">新建</el-button></div>
+        <el-table :data="tableData" style="width: 100%;" size="mini" :header-cell-style="{ background: '#6AB4FF', color: '#FFFFFF' }" show-overflow-tooltip="true" :row-class-name="tableRowClassName">
+          <el-table-column label="优先级" min-width="100" sortable align="center">
+            <template slot-scope="scope"><el-tag size="mini" :type="random(scope.row)" effect="dark"> {{ scope.row.teamName }}</el-tag></template>
+          </el-table-column>
+          <el-table-column label="项目名称" min-width="200" align="center" show-overflow-tooltip>
+            <template slot-scope="scope">{{ scope.row.address }}</template>
+          </el-table-column>
+          <el-table-column label="业务线" min-width="100" align="center">
+            <template slot-scope="scope">{{ scope.row.teamName }}</template>
+          </el-table-column>
+          <el-table-column label="项目类型" min-width="100" align="center">
+            <template slot-scope="scope">{{ scope.row.teamName }}</template>
+          </el-table-column>
+          <el-table-column label="项目负责人" min-width="100" align="center">
+            <template slot-scope="scope">{{ scope.row.teamName }}</template>
+          </el-table-column>
+          <el-table-column label="产品负责人" min-width="100" align="center">
+            <template slot-scope="scope">{{ scope.row.teamName }}</template>
+          </el-table-column>
+          <el-table-column label="开发负责人" min-width="100" align="center">
+            <template slot-scope="scope">{{ scope.row.teamName }}</template>
+          </el-table-column>
+          <el-table-column label="需求" min-width="80" align="center">
+            <template slot-scope="scope">{{ scope.row.teamName }}</template>
+          </el-table-column>
+          <el-table-column label="任务" min-width="80" align="center">
+            <template slot-scope="scope">{{ scope.row.teamName }}</template>
+          </el-table-column>
+          <el-table-column label="Bug" min-width="80" align="center">
+            <template slot-scope="scope">{{ scope.row.teamName }}</template>
+          </el-table-column>
+          <el-table-column label="创建人" min-width="100" align="center">
+            <template slot-scope="scope">{{ scope.row.teamName }}</template>
+          </el-table-column>
+          <el-table-column label="创建日期" min-width="120" align="center">
+            <template slot-scope="scope">{{ scope.row.date }}</template>
+          </el-table-column>
+        </el-table>
+      </el-main>
+      <el-footer class="footer">
+        <el-pagination background :current-page="currentPage" :page-sizes="[15, 20, 25, 30]" :page-size="100" layout="total, prev, pager, next, jumper" :total="100" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
+      </el-footer>
+    </el-container>
+    <el-dialog title="新建项目" :visible.sync="dialogFormVisible" width="70%">
+      <el-form :model="form" label-position="left" style="margin: 0 3%;">
+        <el-form-item label="项目名称" :label-width="formLabelWidth">
+          <el-input v-model="form.name" autocomplete="off" placeholder="请输入项目名称" />
+        </el-form-item>
+        <div style="display: flex;">
+          <div style="flex; 1;">
+            <el-form-item label="项目类型" :label-width="formLabelWidth">
+              <el-select v-model="form.value" clearable placeholder="业务/产品" style="width: 100%">
+                <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="业务线" :label-width="formLabelWidth">
+              <el-select v-model="form.value" clearable placeholder="请选择" style="width:20vw">
+                <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="产品负责人" :label-width="formLabelWidth">
+              <el-select v-model="form.value1" filterable remote reserve-keyword :remote-method="remoteMethod" :loading="loading" clearable placeholder="请输入姓名或邮箱前缀" style="width: 100%">
+                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="测试负责人" :label-width="formLabelWidth">
+              <el-select v-model="form.value1" filterable remote reserve-keyword :remote-method="remoteMethod" :loading="loading" clearable placeholder="请输入姓名或邮箱前缀" style="width: 100%">
+                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+          </div>
+          <div style="flex; 1; margin: 0 0 0 auto;">
+            <el-form-item label="优先级" :label-width="formLabelWidth">
+              <el-select v-model="form.value" clearable placeholder="请选择" style="width:20vw">
+                <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="项目负责人" :label-width="formLabelWidth">
+              <el-select v-model="form.value1" filterable remote reserve-keyword :remote-method="remoteMethod" :loading="loading" clearable placeholder="请输入姓名或邮箱前缀" style="width: 100%">
+                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="开发负责人" :label-width="formLabelWidth">
+              <el-select v-model="form.value1" filterable remote reserve-keyword :remote-method="remoteMethod" :loading="loading" clearable placeholder="请输入姓名或邮箱前缀" style="width: 100%">
+                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+          </div>
+        </div>
+        <el-form-item label="项目描述" :label-width="formLabelWidth">
+          <el-input v-model="form.textarea" type="textarea" placeholder="请输入" show-word-limit />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogFormVisible = false">取 消</el-button>
+        <el-button type="primary" @click="dialogFormVisible = false">创 建</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      curIndex: 1,
+      pageSize: 15,
+      options: [],
+      value1: [],
+      list: [],
+      form: {},
+      loading: false,
+      dialogFormVisible: false,
+      formLabelWidth: '100px',
+      currentPage: 0,
+      gridData: [{
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-04',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-01',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-03',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }],
+      tableData: [{
+        date: '2016-05-02',
+        teamName: 'p0',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-04',
+        teamName: 'p3',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        teamName: 'p8',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-03',
+        teamName: 'p2',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }],
+      options1: [{
+        teamName: '选项1',
+        label: '黄金糕'
+      }, {
+        teamName: '选项2',
+        label: '双皮奶'
+      }, {
+        teamName: '选项3',
+        label: '蚵仔煎'
+      }, {
+        value: '选项4',
+        label: '龙须面'
+      }, {
+        value: '选项5',
+        label: '北京烤系三星那些闹事你辛苦啦斯诺克选手内心鸭'
+      }],
+      items: [
+        { type: '' },
+        { type: 'success' },
+        { type: 'info' },
+        { type: 'danger' },
+        { type: 'warning' }
+      ],
+      value: ''
+    }
+  },
+  methods: {
+    random(index) {
+      const number = Math.random() * 10
+      const a = Math.floor(number)
+      return this.items[a % 5].type
+    },
+    remoteMethod(query) {
+      if (query !== '') {
+        this.loading = true
+        setTimeout(() => {
+          this.loading = false
+          this.options = this.list.filter(item => {
+            return item.label.toLowerCase()
+              .indexOf(query.toLowerCase()) > -1
+          })
+        }, 200)
+      } else {
+        this.options = []
+      }
+    },
+    tableRowClassName({ row, rowIndex }) {
+      if (rowIndex === 1) {
+        return 'warning-row'
+      } else if (rowIndex === 3) {
+        return 'success-row'
+      }
+      return ''
+    },
+    handleSizeChange(size) { //  分页
+      this.pageSize = size
+      // this.get_list()
+    },
+    handleCurrentChange(curIndex) { //  分页
+      this.curIndex = curIndex
+      // this.get_list()
+    }
+  }
+}
+</script>
+
+<style>
+  .footer { text-align: right; margin: 1%; background-color: #FFFFFF; border-radius: 8px; }
+
+  .bgborder { margin: 1%; background-color: #FFFFFF; border-radius: 8px;}
+
+  .bgborder .el-input__inner { border: none; padding: 0px 50px 0px 0px;}
+
+  .bgborder .el-select .el-input .el-select__caret { color: #333333 !important; }
+
+  .bgborder .el-table .el-table__body tr:hover td { color: #409EFF; background: #EEF0F5; } /*hover时字体, 背景颜色*/
+
+  .bgborder .el-input__icon { width: 77px !important; }
+
+  .el-table .warning-row { background: oldlace; }
+
+  #basicName::-webkit-input-placeholder { color: #333333; }
+
+  /* #basicName:-moz-placeholder { color: #333333; } */
+
+  /* #basicName:-ms-input-placeholder { color: #333333; } */
+</style>

src/views/projectManage/projectList/projectViewDetails.vue

@@ -0,0 +1,653 @@
+<template>
+  <div style="background-color:#F2F3F6;display:flex;align-items: center;justify-content: center;">
+    <el-container>
+      <el-header
+        class="bgborder"
+        style="height: 7vh;display: flex; justify-content: space-between; align-items: center;"
+      >
+        <el-tooltip class="item" effect="dark" content="爱啥啥" placement="bottom">
+          <span
+            style="float: left;"
+          >项目名称："cmckldmcklmdcklmdsklcmklmckldklcmdsdcklmdklcdsklcmkldsmcklm"</span>
+        </el-tooltip>
+        <span style="float: right;">
+          <el-dropdown>
+            <el-button size="mini" type="primary">
+              未开始
+              <i class="el-icon-arrow-down el-icon--right" />
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item>进行中</el-dropdown-item>
+              <el-dropdown-item>已完成</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+          <el-dropdown>
+            <el-button size="mini" type="primary">
+              新建
+              <i class="el-icon-arrow-down el-icon--right" />
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item>新建需求</el-dropdown-item>
+              <el-dropdown-item>新建任务</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+        </span>
+      </el-header>
+      <el-container>
+        <el-aside class="bgborder" style="minWidth: 55%;">
+          <div style="margin: 5%; font-weight: 600; white-space: nowrap;">
+            <b style="color: #409EFF;margin: 0 0.5%; font-size: 20px; ">I</b>数据统计
+            <el-button size="mini" type="primary" style="float: right;">删除项目</el-button>
+          </div>
+          <div style="display: flex; justify-content: space-between; align-items: center;">
+            <span style="text-align: center; margin-left: 10%">
+              <p>需求数量</p>
+              <p style="font-size: 44px;">0</p>
+              <p>
+                <el-button size="mini" type="primary">提需求</el-button>
+              </p>
+            </span>
+            <span style="text-align: center;">
+              <p>任务数量</p>
+              <p style="font-size: 44px;">0</p>
+              <p>
+                <el-button size="mini" type="primary">建任务</el-button>
+              </p>
+            </span>
+            <span style="text-align: center;margin-right:10%;">
+              <p>Bug数量</p>
+              <p style="font-size: 44px;">0</p>
+              <p>
+                <el-button size="mini" type="primary">提bug</el-button>
+              </p>
+            </span>
+          </div>
+        </el-aside>
+        <el-container>
+          <el-main class="bgborder" style="min-height: 50vh;">
+            <div style="margin: 2.5%; font-weight: 600; white-space: nowrap;">
+              <b style="color: #409EFF;margin: 0 0.5%; font-size: 20px; ">I</b>基础信息
+            </div>
+            <el-form
+              label-position="left"
+              label-width="100px"
+              style="margin: 0 8%"
+              :model="formLabelAlign"
+            >
+              <el-row :gutter="20">
+                <el-col :span="12">
+                  <el-form-item label="项目类型：">
+                    <div class="grid-content bg-purple">1</div>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="12" :push="7">
+                  <el-button
+                    size="mini"
+                    type="primary"
+                    @click="project_modifica(formLabelAlign.describe)"
+                  >修改</el-button>
+                </el-col>
+              </el-row>
+              <el-row :gutter="20">
+                <el-col :span="12">
+                  <el-form-item label="业务线：">
+                    <div class="grid-content bg-purple">1</div>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                  <el-form-item label="优先级：">
+                    <div class="grid-content bg-purple">2</div>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+              <el-row :gutter="20">
+                <el-col :span="12">
+                  <el-form-item label="项目负责人：">
+                    <div class="grid-content bg-purple">1</div>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                  <el-form-item label="产品负责人：">
+                    <div class="grid-content bg-purple">2</div>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+              <el-row :gutter="20">
+                <el-col :span="12">
+                  <el-form-item label="开发负责人：">
+                    <div class="grid-content bg-purple">1</div>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                  <el-form-item label="测试负责人：">
+                    <div class="grid-content bg-purple">2</div>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+              <el-row :gutter="20">
+                <el-col :span="24">
+                  <el-form-item label="项目描述：">
+                    <el-input
+                      v-show="describe"
+                      ref="describe"
+                      v-model="formLabelAlign.describe"
+                      rows="3"
+                      type="textarea"
+                      placeholder="请输入内容"
+                      show-word-limit
+                      @blur="blur_describe(formLabelAlign.describe)"
+                    />
+                    <span v-show="describe1">{{ formLabelAlign.describe }}</span>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+            </el-form>
+          </el-main>
+        </el-container>
+      </el-container>
+      <el-header class="bgborder" style="height: auto;">
+        <el-tabs tab-position="top" @tab-click="handleClick">
+          <el-tab-pane label="项目总目标" style="position: relative;">
+            <div v-show="true" class="test">
+              您还没有设定目标请
+              <el-button type="text">立即添加</el-button>
+            </div>
+            <div v-show="false">
+              <el-row :gutter="20">
+                <el-col :span="24" :push="22" style="margin-bottom: 2%;">
+                  <el-button size="mini" type="primary">编辑</el-button>
+                </el-col>
+              </el-row>
+              <el-input
+                v-model="textarea"
+                rows="13"
+                type="textarea"
+                placeholder="请输入内容"
+                show-word-limit
+                style="margin-bottom: 3%;"
+              />
+            </div>
+          </el-tab-pane>
+
+          <el-tab-pane label="项目里程碑" style="overflow: auto;width: 100%;">
+            <div>
+              <el-divider style="position: absolute;" content-position="right">
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  content="温馨提示：点击添加可以新建里程碑"
+                  placement="bottom-end"
+                >
+                  <el-button
+                    style="z-index: 999999;"
+                    size="mini"
+                    type="primary"
+                    icon="el-icon-plus"
+                    circle
+                    @click="dialogFormVisible = true"
+                  />
+                </el-tooltip>
+              </el-divider>
+              <ul class="time-horizontal" style="margin-top:15%;">
+                <li v-for="(item, index) in project_Milepost" :key="index">
+                  <i>
+                    <div>
+                      <el-popover
+                        class="popover"
+                        placement="top"
+                        width="200"
+                        trigger="click"
+                        style="border-radius: 10px;"
+                      >
+                        <p style="text-align: center">
+                          <el-button size="mini">删除</el-button>
+                          <el-button size="mini" type="primary" @click="dialogFormVisible = true">编辑</el-button>
+                        </p>
+                        <b slot="reference">一&nbsp;</b>
+                      </el-popover>
+                    </div>
+                  </i>
+                  <div>
+                    {{ item.name }}
+                    <br>
+                    {{ item.date }}
+                  </div>
+                  <p>{{ item.code }}</p>
+                </li>
+              </ul>
+            </div>
+          </el-tab-pane>
+        </el-tabs>
+      </el-header>
+      <el-container>
+        <el-aside class="bgborder">
+          <div style="margin: 5%; font-weight: 600; white-space: nowrap;">
+            <b style="color: #409EFF;margin: 0 0.5%; font-size: 20px; ">I</b>需求列表
+          </div>
+          <div class="aside">全部任务</div>
+          <div class="aside" @click="show2 = !show2">归属需求任务</div>
+          <transition name="el-zoom-in-top">
+            <div v-show="show2" class="transition-box">
+              <el-table
+                :data="tableData"
+                style="width: 100%;"
+                size="mini"
+                :header-cell-style="{ background: '#6AB4FF', color: '#FFFFFF' }"
+                show-overflow-tooltip="true"
+                :row-class-name="tableRowClassName"
+              >
+                <el-table-column label="需求名称" min-width="100" align="center">
+                  <template slot-scope="scope">
+                    <el-tag
+                      size="mini"
+                      :type="random(scope.row)"
+                      effect="dark"
+                    >{{ scope.row.teamName }}</el-tag>
+                  </template>
+                </el-table-column>
+                <el-table-column label="PM" min-width="100" align="center" show-overflow-tooltip>
+                  <template slot-scope="scope">{{ scope.row.address }}</template>
+                </el-table-column>
+                <el-table-column label="状态" min-width="100" align="center">
+                  <template slot-scope="scope">{{ scope.row.teamName }}</template>
+                </el-table-column>
+              </el-table>
+            </div>
+          </transition>
+          <div class="aside">
+            无归属需求任务
+            <el-tooltip
+              class="item"
+              effect="dark"
+              content="点击“无归属需求的任务”，右边任务列表区域展示当前项目下所有无归属需求的任务。"
+              placement="bottom"
+            >
+              <i style="color: red;" class="el-icon-warning-outline" />
+            </el-tooltip>
+          </div>
+        </el-aside>
+        <el-container>
+          <el-main class="bgborder" style="min-height: 50vh;">
+            <div style="margin: 2.5%; font-weight: 600; white-space: nowrap;">
+              <b style="color: #409EFF;margin: 0 0.5%; font-size: 20px; ">I</b>任务列表
+            </div>
+            <el-table
+              :data="tableData"
+              style="width: 100%;"
+              size="mini"
+              :header-cell-style="{ background: '#6AB4FF', color: '#FFFFFF' }"
+              show-overflow-tooltip="true"
+              :row-class-name="tableRowClassName"
+            >
+              <el-table-column label="任务名称" min-width="100" align="center" show-overflow-tooltip>
+                <template slot-scope="scope">
+                  <el-tag
+                    size="mini"
+                    :type="random(scope.row)"
+                    effect="dark"
+                  >{{ scope.row.teamName }}</el-tag>
+                </template>
+              </el-table-column>
+              <el-table-column label="所属需求" min-width="100" align="center">
+                <template slot-scope="scope">{{ scope.row.address }}</template>
+              </el-table-column>
+              <el-table-column label="状态" min-width="100" align="center">
+                <template slot-scope="scope">{{ scope.row.teamName }}</template>
+              </el-table-column>
+              <el-table-column label="任务健康状态" min-width="100" align="center">
+                <template slot-scope="scope">{{ scope.row.teamName }}</template>
+              </el-table-column>
+              <el-table-column label="开发负责人" min-width="100" align="center">
+                <template slot-scope="scope">{{ scope.row.teamName }}</template>
+              </el-table-column>
+              <el-table-column label="测试负责人" min-width="100" align="center">
+                <template slot-scope="scope">{{ scope.row.teamName }}</template>
+              </el-table-column>
+              <el-table-column label="任务进度" min-width="100" align="center">
+                <template slot-scope="scope">{{ scope.row.teamName }}</template>
+              </el-table-column>
+            </el-table>
+          </el-main>
+        </el-container>
+      </el-container>
+      <el-footer class="footer">
+        <el-pagination
+          background
+          :current-page="currentPage"
+          :page-sizes="[15, 20, 25, 30]"
+          :page-size="100"
+          layout="total, prev, pager, next, jumper"
+          :total="100"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+        />
+      </el-footer>
+    </el-container>
+    <el-dialog :visible.sync="dialogFormVisible" class="dialog">
+      <div style="margin:0 0 2% 3%; font-weight: 600; white-space: nowrap;font-size: 20px;">
+        <b style="color: #409EFF;margin: 0 0.5%;">I</b>编辑里程碑
+      </div>
+      <el-form :model="form" label-position="right">
+        <el-form-item label="标题" :label-width="formLabelWidth">
+          <el-input v-model="form.name" autocomplete="off" placeholder="请输入标题" />
+        </el-form-item>
+        <el-form-item label="时间" :label-width="formLabelWidth">
+          <el-date-picker v-model="form.date" type="date" placeholder="请选择日期" />
+        </el-form-item>
+        <el-form-item label="详情" :label-width="formLabelWidth">
+          <el-input
+            v-model="textarea"
+            rows="3"
+            maxlength="200"
+            type="textarea"
+            placeholder="请输入详情内容，详情内容不可超过200字符"
+            show-word-limit
+          />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogFormVisible = false">取 消</el-button>
+        <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      total: 0,
+      tableData: [],
+      formLabelAlign: {
+        describe: '你好啊！'
+      },
+      show2: true,
+      describe: false,
+      describe1: false,
+      textarea: '',
+      dialogFormVisible: false,
+      form: {
+        name: '',
+        region: '',
+        date1: '',
+        date2: '',
+        delivery: false,
+        type: [],
+        resource: '',
+        desc: ''
+      },
+      formLabelWidth: '60px',
+      project_Milepost: [
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        },
+        {
+          name: '第一阶段',
+          date: '2019/12/06',
+          code: '你丹江口市内存卡就是你的错'
+        }
+      ]
+    }
+  },
+  created() {
+    this.get_list()
+  },
+  methods: {
+    get_list() {
+      if (this.formLabelAlign.describe !== '') {
+        this.describe1 = true
+      } else {
+        this.describe = false
+      }
+    },
+    project_modifica(e) {
+      this.describe = true
+      this.describe1 = false
+      this.$set(this.formLabelAlign, 'describe', e)
+      setTimeout(() => {
+        this.$refs.describe.focus()
+      }, 100)
+    },
+    blur_describe(e) {
+      this.describe = false
+      this.describe1 = true
+      this.$set(this.formLabelAlign, 'describe', e)
+    },
+    click_b() {
+      console.log('v')
+    },
+    handleClick(tab, event) {
+      console.log(tab, event)
+    },
+    tableRowClassName({ row, rowIndex }) {
+      if (rowIndex === 1) {
+        return 'warning-row'
+      } else if (rowIndex === 3) {
+        return 'success-row'
+      }
+      return ''
+    },
+    handleSizeChange(size) {
+      //  分页
+      this.pageSize = size
+      // this.get_list()
+    },
+    handleCurrentChange(curIndex) {
+      //  分页
+      this.curIndex = curIndex
+      // this.get_list()
+    }
+  }
+}
+</script>
+<style lang="stylus">
+.bgborder .el-tabs__nav-wrap::after {
+  background-color: #FFFFFF !important;
+}
+
+.bgborder {
+  margin: 1%;
+  background-color: #FFFFFF;
+  border-radius: 8px;
+}
+
+.footer {
+  text-align: right;
+  margin: 1%;
+  background-color: #FFFFFF;
+  border-radius: 8px;
+}
+
+.aside {
+  font-size: 14px;
+  margin: 5%;
+  cursor: pointer;
+}
+
+.aside:hover {
+  color: #409EFF;
+}
+
+.el-main {
+  padding: 0 !important;
+}
+
+.el-tooltip__popper {
+  max-width: 200px;
+}
+
+.test {
+  color: #666666;
+  font-size: 14px;
+  margin-top: 10%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.time-horizontal {
+  list-style-type: none;
+  padding: 0px;
+  margin: 0px;
+  width: 100%;
+  height: 222px;
+  white-space: nowrap;
+}
+
+.dialog .el-dialog__header {
+  padding: 0;
+}
+
+.time-horizontal li {
+  display: inline-block;
+  position: relative;
+  text-align: center;
+  width: 25%;
+  padding-top: 7%;
+}
+
+.time-horizontal li i div {
+  position: absolute;
+  top: -10px;
+  left: 50%;
+  margin-left: -10px;
+  width: 20px;
+  height: 20px;
+}
+
+.time-horizontal li i div b {
+  display: inline-block;
+  cursor: pointer;
+  border: 2px solid #61D3B8;
+  border-radius: 50%;
+  background: #61D3B8;
+  color: #61D3B8;
+  z-index: 9999;
+  width: 20px;
+  height: 20px;
+}
+
+.time-horizontal li i:before {
+  content: '';
+  width: 0%;
+  text-align: center;
+  position: absolute;
+  top: -50%;
+  left: 49.3%;
+  height: 100%;
+  border: 1px dashed #BBBBBB;
+}
+
+.time-horizontal li div {
+  text-align: center;
+  width: 100%;
+  position: absolute;
+  bottom: 197%;
+}
+
+.el-divider--horizontal {
+  display: block;
+  height: 1px;
+  width: 100%;
+  position: absolute !important;
+  margin: 0 !important;
+}
+</style>