From 5d2ecad061c9747aec071299870baddc9008ebca Mon Sep 17 00:00:00 2001
From: TiaStars <L18864257234@163.com>
Date: Mon, 18 Sep 2023 11:13:08 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BF=97=E6=84=BF=E8=80=85=E9=A6=96=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/components/myInput/index.vue |  47 +++
 src/views/yingji/planManage.vue        | 389 +++++--------------------
 2 files changed, 117 insertions(+), 319 deletions(-)
 create mode 100644 src/views/components/myInput/index.vue

diff --git a/src/views/components/myInput/index.vue b/src/views/components/myInput/index.vue
new file mode 100644
index 0000000..ff155fa
--- /dev/null
+++ b/src/views/components/myInput/index.vue
@@ -0,0 +1,47 @@
+<template>
+  <div class="my-inputs">
+    <el-input v-model="input" placeholder="请输入内容" @change="inputValue"></el-input>
+    <div class="btn"><i class="el-icon-search"></i></div>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      input:'',
+    }
+  },
+  methods:{
+    inputValue(e){
+      this.$emit('changeInput',e)
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+.my-inputs {
+  display: flex;
+  ::v-deep .el-input {
+    width: 515px;
+    height: 43px;
+    .el-input__inner {
+      width: 100%;
+      height: 100%;
+      border-right: none;
+      border-radius: 4px 0 0 4px;
+      border: 1px solid #DBD7D7;
+    }
+  }
+  .btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 52px;
+    height: 43px;
+    border-radius: 0 4px 4px 0;
+    background-color: #F8414D;
+    cursor: pointer;
+    color: #fff;
+  }
+}
+</style>
diff --git a/src/views/yingji/planManage.vue b/src/views/yingji/planManage.vue
index a8261c1..dce0d5b 100644
--- a/src/views/yingji/planManage.vue
+++ b/src/views/yingji/planManage.vue
@@ -2,64 +2,14 @@
  * @Descripttion: 
  * @version: 
  * @Author: JC9527
- * @Date: 2023-09-04 10:20:06
+ * @Date: 2023-09-18 10:08:30
  * @LastEditors: JC9527
- * @LastEditTime: 2023-09-13 17:22:51
+ * @LastEditTime: 2023-09-18 11:07:21
 -->
 <template>
     <div class="plan-management">
       <div class="plan-topBox">
-        <div class="drup-downs">
-          <div class="year">
-            <div class="year-span">年份:</div>
-            <!-- <el-select v-model="value" placeholder="请选择">
-              <el-option
-                v-for="item in optionsyear"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value">
-              </el-option>
-            </el-select> -->
-            <el-date-picker
-              v-model="form.plannedYear"
-              type="month"
-              format="yyyy-MM"
-              :clearable="false"
-              value-format="yyyy-MM"
-              placeholder="请选择年份">
-            </el-date-picker>
-          </div>
-          <div class="area">
-            <div class="area-span">区划:</div>
-            <!-- <el-select v-model="value2" placeholder="请选择">
-              <el-option
-                v-for="item in options"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value">
-              </el-option>
-            </el-select> -->
-            <!-- <div class="block">
-            <span class="demonstration">默认 click 触发子菜单</span> -->
-            <el-cascader
-              v-model="form.district"
-              placeholder="请选择"
-              :options="options"
-              :props="props"
-              @change="handleChange"></el-cascader>
-          <!-- </div> -->
-          </div>
-        </div>
-        <div class="btns">
-          <div class="export" @click="exportFile">
-            <img src="@/assets/images/export.png" alt="">
-            <span>导出excel</span>
-          </div>
-          <div class="newProject" @click="newProject">
-            <img src="@/assets/images/newProject.png" alt="">
-            <span>新增计划</span>
-          </div>
-        </div>
+        <my-input @changeInput="changeInput"></my-input>
       </div>
       <div class="plan-bottomBox">
         <div class="tables">
@@ -69,52 +19,46 @@
             :height="484"
             v-loading="loading"
             tooltip-effect="light"
-            @selection-change="handleSelectionChange"
             :row-class-name="tableRowClassName"
           >
             <el-table-column
-              type="selection"
-              width="55"
+              label="序号"
+              type="index"
               header-align="center"
-            >
+              width="70">
             </el-table-column>
             <el-table-column
-              prop="plannedYear"
-              label="计划年份"
-              width="180"
-              header-align="center"
+              prop="content"
+              label="参与活动"
+              width="280"
             >
+              <template slot-scope="scope">
+                <div class="activity">
+                  <div>{{ scope.row.content.split(' ')[0] }}</div>
+                  <div>{{ scope.row.content.split(' ')[1] }}</div>
+                </div>
+              </template>
             </el-table-column>
             <el-table-column
-              prop="district"
-              label="行政区划"
+              prop="person"
+              label="参与人员"
               show-overflow-tooltip
               width="180"
-              header-align="center"
             >
             </el-table-column>
             <el-table-column
-              prop="planNumb"
-              label="计划企业数量"
-              header-align="center"
+              prop="duration"
+              label="服务活动时长"
             >
             </el-table-column>
             <el-table-column
-              prop="keyCount"
-              label="省重点数"
-              header-align="center"
-            >
-            </el-table-column>
-            <el-table-column
-              prop="createTime"
-              label="创建时间"
-              header-align="center"
+              prop="time"
+              label="参与时间"
             >
             </el-table-column>
             <el-table-column
               label="操作"
               width="250"
-              header-align="center"
             >
               <template slot-scope="scope">
                 <div class="tabs-btns">
@@ -122,14 +66,7 @@
                     <img src="@/assets/images/look.png" alt="">
                     <span>查看</span>
                   </div>
-                  <div class="change" @click="change(scope.row)">
-                    <img src="@/assets/images/change.png" alt="">
-                    <span>修改</span>
-                  </div>
-                  <div class="delete" @click="deleteItem(scope.row)">
-                    <img src="@/assets/images/delete.png" alt="">
-                    <span>删除</span>
-                  </div>
+                  <div><span>评估评分：</span></div>
                 </div>
               </template>
             </el-table-column>
@@ -139,34 +76,24 @@
           <my-pagination :total="total" @pagesChange="pagesChange"></my-pagination>
         </div>
       </div>
-      <my-dialog ref="myDialog" v-on:close="padlock"></my-dialog>
-      <my-dialogtwo ref="myDialogTwo"></my-dialogtwo>
     </div>
   </template>
   <script>
   import myPagination from "@/views/components/myPagination/index.vue"
-  import myDialog from "@/views/components/dialog/index.vue"
-  import myDialogtwo from "@/views/components/dialogTwo/index.vue"
+  import myInput from "@/views/components/myInput/index.vue"
   export default {
-    components:{myPagination,myDialog,myDialogtwo},
+    components:{myPagination,myInput},
     data() {
       return {
-        optionsyear:[],
-        options:[
-
+        tableData: [
+          {
+            content:'志愿活动协助指挥交通 我参加的志愿者活动，指挥交通',
+            person:'吴加好',
+            duration:'10',
+            time:'2023-08-14'
+          }
         ],
-        form:{
-          district:'',
-          plannedYear:''
-        },
-        props:{
-          value:'county',
-          label:'institutionName'
-        },
-        value:'2022',
-        value2:'苏州',
-        tableData: [],
-        multipleSelection: [],
+        input: '',
         pages:{
           pageSize:10,
           pageNum:1
@@ -181,108 +108,20 @@
         // console.log(pages)
         this.getList(pages)
       },
-      // 选中的数据
-      handleSelectionChange(val) {
-        // 选中的数组
-        this.multipleSelection = val;
-      },
-      // 导出
-      exportFile(){
-        console.log(this.multipleSelection)
-      },
-      // 新增计划
-      newProject(){
-        this.$refs.myDialog.open('newlyIncreased')
-      },
-      // 新增成功后关闭dialog事件触发
-      padlock(){
-        this.getList(this.pages);
-      },
-      // 区划级联选择器选择触发
-      handleChange(value){
-        console.log(value)
-      },
-      // 查看
-      look(row){
-        this.$refs.myDialogTwo.open(row);
-      },
-      // 修改
-      change(row){
-        this.$refs.myDialog.open(row)
-      },
-      // 删除
-      deleteItem(row){
-        let	idList = [];
-        idList.push(row.id)
-        this.$modal.confirm("你确认要删除该条数据吗？", "提示", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning",
-        })
-        .then(async() => {
-          this.loading = true;
-          try {
-            let data = await this.$api.yingji.bPlanManage('delete',_,{idList:idList.join(',')})
-            if(data.code == 200) {
-              this.loading = false;
-              this.$message({
-                message: '删除成功',
-                type: 'success'
-              });
-              this.getList();
-            }
-          } catch (error) {
-            console.log(error)
-          }
-        })
-        .catch(() => {
-          console.log('取消删除')
-        });
-      },
-      tableRowClassName({row, rowIndex}) {
-        if (rowIndex % 2 !== 0) {
-          return 'success-row';
-        }
-        return '';
+      // 输入框的值
+      changeInput(value){
+        this.input = value;
       },
-      // 获取list表
-      async getList(pages){
-        this.loading = true;
-        let res = await this.$api.yingji.bPlanManage('get',_,pages);
-        console.log(res);
-        if(res.code == 200) {
-          this.loading = false;
-        }
-        this.tableData = res.data.list;
-        this.total = res.data.total
-      },
-      commentData(item){
-        if(item instanceof Array) {
-          item.map((item)=>{
-            if(item.children instanceof Array && item.children.length == 0){
-              delete item.children;
-            } else {
-              this.props.value = 'subdistrict'
-              this.commentData(item.children)
-            }
-          })
-        }
-        this.options = item
+      // tabs不同行给不同class
+      tableRowClassName({ row, rowIndex }) {
+      if (rowIndex % 2 !== 0) {
+        return "success-row";
       }
+      return "";
+    },
     },
     async created() {
-      this.checkListTwo = this.checkList;
-      // this.$nextTick(()=>{
-        // let dom = document.getElementsByClassName('tables');
-        // let height = dom[0].getBoundingClientRect();
-        // let windowHeight = window.innerHeight;
-        // let relativeHeight = windowHeight - height.top
-        // this.main.height = relativeHeight - 80
-        // console.log(this.main.height)
-      // })
-      let data = await this.$api.yingji.tree();
-      this.commentData(data.data)
-      this.getList(this.pages);
+
     },
   }
   </script>
@@ -292,110 +131,7 @@
     background-color: #fff;
     height: 100%;
     .plan-topBox {
-      display: flex;
-      justify-content: space-between;
-      padding: 31px 0 12px 0;
-      // background-color: yellow;
-      .drup-downs {
-        display: flex;
-        align-items: center;
-        .year {
-          display: flex;
-          align-items: center;
-          margin-right: 81px;
-          .year-span {
-            font-size: 14px;
-            font-family: 'Alibaba PuHuiTi';
-            font-weight: 400;
-            color: #525966;
-            line-height: 40px;
-            margin-right: 10px;
-          }
-        }
-        .area {
-          display: flex;
-          align-items: center;
-          .area-span {
-            font-size: 14px;
-            font-family: 'Alibaba PuHuiTi';
-            font-weight: 400;
-            color: #525966;
-            line-height: 40px;
-            margin-right: 10px;
-          }
-          ::v-deep .el-cascader {
-            background-color: transparent;
-            width: 276px;
-            .el-input__inner {
-              height: 33px;
-            }
-            .el-input .el-input__suffix .el-input__suffix-inner .el-icon-arrow-down::before {
-              content: "";
-              background: url(../../assets/images/down2.png) center center no-repeat;
-              background-size: cover;
-              position: absolute;
-              width: 10px;
-              height: 7px;
-              top: 50%;
-              left: 50%;
-              transform: translate(-50%, -50%);
-            }
-          }
-        }
-        ::v-deep .el-select {
-          background-color: transparent;
-          width: 276px;
-          .el-input__inner {
-            height: 33px;
-          }
-          .el-input .el-input__suffix .el-input__suffix-inner .el-icon-arrow-up {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-          }
-          // border-radius: 2px;
-          .el-input .el-input__suffix .el-input__suffix-inner .el-icon-arrow-up::before {
-            content: "";
-            background: url(../../assets/images/down2.png) center center no-repeat;
-            background-size: cover;
-            position: absolute;
-            width: 10px;
-            height: 7px;
-            // top: 50%;
-            // left: 50%;
-            // transform: translate(-50%, -50%);
-            transform: rotate(180deg);
-          }
-        }
-      }
-      .btns {
-        display: flex;
-        align-items: center;
-        .export,.newProject {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          padding: 6px 19px;
-          cursor: pointer;
-          img {
-            width: 22px;
-            margin-right: 10px;
-          }
-          span {
-            color: #ffffff;
-            font-size: 14px;
-            font-family: 'Alibaba PuHuiTi';
-            font-weight: 400;
-          }
-        }
-        .export {
-          background-color: #2378EC;
-          margin-right: 30px;
-        }
-        .newProject {
-          background-color: #28B384;
-        }
-      }
+      padding: 20px 0;
     }
     .plan-bottomBox {
       margin-top: 10px;
@@ -404,10 +140,31 @@
           .success-row {
             background-color: rgba(234, 242, 253, 0.25);
           }
+          .activity {
+            div {
+              text-align: left;
+              &:nth-child(1) {
+                font-size: 14px;
+                font-family: 'Alibaba PuHuiTi';
+                font-weight: 400;
+                color: #4D4949;
+              }
+              &:nth-child(2) {
+                width: 180px;
+                font-size: 14px;
+                font-family: 'Alibaba PuHuiTi';
+                font-weight: 400;
+                color: #999191;
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+              }
+            }
+          }
           td {
             height: 42px;
             box-sizing: border-box;
-            text-align: center;
+            // text-align: center;
             font-size: 14px;
             font-family: 'Alibaba PuHuiTi';
             font-weight: 400;
@@ -415,11 +172,11 @@
           }
           th {
             height: 45px;
-            background-color: #EAF2FD;
+            background-color: #F7F5F5;
             font-size: 15px;
             font-family: 'Alibaba PuHuiTi';
             font-weight: bold;
-            color: #525966;
+            color: #4D4949;
             .el-checkbox {
               display: none;
             }
@@ -431,10 +188,10 @@
         .tabs-btns {
           display: flex;
           align-items: center;
-          justify-content: center;
-          .look,.change,.delete {
+          // justify-content: center;
+          .look{
             display: flex;
-            align-items: center;
+            // align-items: center;
             margin-right: 30px;
             cursor: pointer;
             img {
@@ -448,12 +205,6 @@
               color: #045FFD;
             }
           }
-          .delete {
-            margin-right: 0;
-            span {
-              color: #F71052;
-            }
-          }
         }
       }
       .pagination {