巡查养护计划

src/views/rain/inspection/plan.vue

@@ -27,6 +27,11 @@
                 <div v-else-if="column.type=='daterange'">
                   {{scope.row['start_date']}}至{{scope.row['end_date']}}
                 </div>
+                <div v-else-if="column.type=='road_name'">
+                  <el-tag style="margin-right:5px" v-for="item in scope.row[column.field]">
+                    {{item.road?item.road.name:""}}
+                  </el-tag>
+                </div>
                 <div v-else>{{scope.row[column.field]}}</div>
               </template>
           </el-table-column>
@@ -38,7 +43,7 @@
         </div>
       </div>
 
-      <el-dialog class="common-dialog" title="巡查计划编辑" :visible.sync="dialogFormVisible" width="40%">
+      <el-dialog class="common-dialog" title="巡查计划编辑" :visible.sync="dialogFormVisible" width="50%">
         <div class="dialogConcent">
           <el-scrollbar style="flex: 1">
 
@@ -73,6 +78,23 @@
                       </el-select>
                   </el-form-item>
                 </el-col>
+                <el-col :span="24">
+                  <el-form-item label="巡查道路" prop="road_id">
+                      <el-transfer
+                        filterable
+                        :titles="['待选择', '已选择']"
+                        :format="{ noChecked: '${total}',hasChecked: '${checked}/${total}' }"
+                        :filter-method="filterRoadMethod"
+                        filter-placeholder="请输入道路关键字"
+                        v-model="roadArr"
+                        :props="{
+                          key: 'id',
+                          label: 'name'
+                        }"
+                        :data="roadList">
+                      </el-transfer>
+                  </el-form-item>
+                </el-col>
                 <el-col :span="24">
                   <el-form-item label="循环机制" prop="day">
                     <el-select style="width:100%" v-model="form.day" placeholder="请选择循环机制">
@@ -147,6 +169,9 @@
   import {
     listarea
   } from '../../../api/basic/area.js'
+  import {
+    listroad
+  } from '../../../api/basic/road.js'
   import { getparameteritem } from '../../../api/system/dictionary.js'
   import LxHeader from "@/components/LxHeader/index.vue";
 
@@ -188,9 +213,12 @@
           start_date:"",
           end_date:"",
           responsible_id:"",
-          remark:""
-        },
-
+          remark:"",
+          roads_list:[]
+        },
+        roadArr:[],
+        roadList:[],
+        roadloading:false,
         rules: {
           name:[{
             required: true,
@@ -225,6 +253,13 @@
               width:180,
               align: "center"
           },
+          {
+              field: "road_name",
+              title: "巡查道路",
+              type: "road_name",
+              width:180,
+              align: "center"
+          },
           {
               field: "day",
               title: "循环机制",
@@ -265,11 +300,13 @@
           }
         ],
       }
+    },
+    mounted() {
+
     },
     created() {
       this.initLoad();
       this.load();
-
     },
     methods: {
       initLoad() {
@@ -298,6 +335,13 @@
           console.log(error)
           reject(error)
         });
+      listroad({
+        page:1,
+        page_size:999
+      }).then(res => {
+        // this.roadloading = false
+        this.roadList = res.data
+      })
         // getparameteritem('plan-type').then(res => {
         //   that.plantypes = res.detail
         // })
@@ -321,6 +365,9 @@
                 m.item_type_name = k.value
               }
             }
+            if(m.roads.length>0){
+              m.road_name = m.roads
+            }
             m.area_name = m.area_info.name
             m.responsibleName = m.responsible?m.responsible.name :""
           }
@@ -339,6 +386,9 @@
           // this.$set(that.form,res);
           that.form = result;
           that.dateRange = [result.start_date,result.end_date]
+          for(var m of result.roads){
+            this.roadArr.push(m.road_id)
+          }
 
         }).catch(error => {
           //reject(error)
@@ -347,6 +397,7 @@
 
      edit(obj) {
        this.form = this.$options.data().form
+       this.roadArr=[]
        if (obj) {
          this.info(obj)
        }
@@ -376,7 +427,17 @@
       submitForm(formName) {
         this.form.start_date = this.dateRange[0]
         this.form.end_date = this.dateRange[1]
-        var that = this;
+        var that = this;
+        console.log(this.roadArr)
+        if(this.roadArr.length>0){
+          for(var m of this.roadArr){
+            this.form.roads_list.push({
+              road_id:m
+            })
+          }
+        }
+        console.log(this.form)
+        // return
         this.$refs[formName].validate((valid) => {
           if (valid) {
             if (that.form.id) {
@@ -406,9 +467,24 @@
       resetForm(formName) {
         var that = this;
         that.dateRange = [];
+        this.roadArr = []
         this.$refs[formName].resetFields();
         that.dialogFormVisible = false;
 
+      },
+      filterRoadMethod(query,item){
+        return item.name.indexOf(query) > -1;
+        // if (query != '') {
+        //   this.roadloading = true
+        //   listroad({
+        //     name: query
+        //   }).then(res => {
+        //     this.roadloading = false
+        //     this.roadList = res.data
+        //   })
+        // } else {
+        //   this.roadList = []
+        // }
       }
     }
   }

src/views/rain/maintain/plan.vue

@@ -9,6 +9,8 @@
               <Input style="width: 200px; margin-right: 10px" v-model="searchFields.keyword" placeholder="关键字搜索" />
               <Button type="primary" @click="load" style="margin-left: 10px">查询</Button>
               <Button type="primary" @click="edit()" style="margin-left: 10px">新增</Button>
+              <Button type="primary" @click="dialogPlanVisible = true" slot="reference" style="margin-left: 10px">导入</Button>
+
               <div class="upfile">
                   <el-popover
                     placement="bottom-start"
@@ -16,23 +18,8 @@
                     width="300"
                     trigger="hover"
                     content="">
-                    <el-upload
-                      slot="reference"
-                      class="upload-demo"
-                      action="/api/admin/maintain-plan/import-show"
-                      :on-preview="handlePreview"
-                      :on-remove="handleRemove"
-                      :before-remove="beforeRemove"
-                      :data="uploadOther"
-                      multiple
-                      :limit="1"
-                      :on-success="handleSuccess"
-                      :on-exceed="handleExceed"
-                      :file-list="fileList">
-                      <el-button size="small" type="primary">点击上传</el-button>
 
 
-                    </el-upload>
                   </el-popover>
               </div>
 
@@ -65,18 +52,55 @@
           </el-pagination>
         </div>
       </div>
-
+
+
+      <el-dialog class="common-dialog" title="上传文件" :visible.sync="dialogPlanVisible" width="40%">
+        <div class="dialogConcent">
+          <el-scrollbar style="flex: 1">
+            <el-form :model="form" :rules="rules" ref="form" label-position="right" :label-width="formLabelWidth">
+              <el-row>
+                <el-col :span="24">
+                  <el-form-item label="所属片区" prop="plan_area_id">
+                    <el-select @change="showArea" filterable style="width:100%" v-model="plan_area_id" placeholder="请选择所属片区">
+                        <el-option
+                          v-for="item in areaList"
+                          :key="item.id"
+                          :label="item.name"
+                          :value="item">
+                        </el-option>
+                      </el-select>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="24">
+                   <el-form-item label="文件上传" prop="filelist">
+                    <el-upload
+                      class="upload-demo"
+                      action="/api/admin/maintain-plan/import-show"
+                      :on-preview="handlePreview"
+                      :on-remove="handleRemove"
+                      :before-remove="beforeRemove"
+                      :data="uploadOther"
+                      multiple
+                      :limit="1"
+                      :on-success="handleSuccess"
+                      :on-exceed="handleExceed"
+                      :file-list="fileList">
+                      <el-button size="small" type="primary">点击上传</el-button>
+                    </el-upload>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+
+            </el-form>
+          </el-scrollbar>
+        </div>
+      </el-dialog>
       <el-dialog class="common-dialog" title="养护计划编辑" :visible.sync="dialogFormVisible" width="40%">
         <div class="dialogConcent">
           <el-scrollbar style="flex: 1">
 
             <el-form :model="form" :rules="rules" ref="form" label-position="right" :label-width="formLabelWidth">
               <el-row>
-                <!-- <el-col :span="24">
-                  <el-form-item label="养护计划名称" prop="name">
-                    <el-input v-model="form.name" placeholder="请填写养护计划名称" autocomplete="off"></el-input>
-                  </el-form-item>
-                </el-col> -->
                 <el-col :span="24">
                   <el-form-item label="所属道路" prop="road_id">
                     <el-select class="width100" v-model="roadName" filterable remote @change="chooseRoad"
@@ -188,27 +212,17 @@
       </el-dialog>
     </div>
 
+
+
     <el-dialog class="common-dialog" title="文件预览" @close="resetFile" :visible.sync="dialogFileVisible" width="60%">
       <div class="dialogConcent">
         <el-scrollbar style="flex: 1">
+            <div>所属片区：{{plan_area_name}}</div>
             <el-table :data="fileData" class="v-table" :height="tableHeight" style="width: 100%">
               <el-table-column :prop="column.field" :align="column.align" v-for="(column,index) in filecolumns"
                 :label="column.title" :width="column.width" :fixed="column.fixed">
                   <template slot-scope="scope">
-                    <!-- <div v-if="column.type=='date'">
-                    <el-form>
-                        <el-form-item label="" prop="scope.row[column.field]">
-                          <el-date-picker
-                              style="width:100%"
-                              v-model="scope.row[column.field]"
-                              type="date"
-                              format="yyyy-MM-dd"
-                              value-format="yyyy-MM-dd"
-                              >
-                          </el-date-picker>
-                        </el-form-item>
-                    </el-form>
-                    </div> -->
+
                     <div>
                       <el-input v-model="scope.row[column.field]"></el-input>
                     </div>
@@ -326,12 +340,16 @@
           }]
         },
         fileData:[],
+        plan_area_id:"",
+        plan_area_name:"",
+        dialogPlanVisible:false,
         dialogFileVisible:false,
         filecolumns:[{
           field: "序号",
           title: "序号",
           type: "string",
           align: "left",
+          width:80
         },{
           field: "路名",
           title: "路名",
@@ -357,6 +375,16 @@
           title: "支管",
           type: "string",
           align: "left",
+        },{
+          field: "inspection_well",
+          title: "窨井",
+          type: "string",
+          align: "left",
+        },{
+          field: "side_well",
+          title: "边井",
+          type: "string",
+          align: "left",
         }],
 
         columns: [{
@@ -619,6 +647,7 @@
       },
       handleSuccess(response, file, fileList){
         // this.fileList = response
+
         var nowyear = ""
         var k = 0
         for(var i=0;i<response.length;i++){
@@ -664,18 +693,29 @@
 
           }
         }
+        this.dialogPlanVisible = false
         this.dialogFileVisible = true
 
       },
+      showArea(val){
+        console.log(val)
+        if(val){
+          this.plan_area_id = val.id
+          this.plan_area_name = val.name
+        }
+      },
       submitFile(){
+        console.log(this.plan_area_id)
         console.log(this.fileData)
         // return
         importPlan({
-          data:this.fileData
+          data:this.fileData,
+          area_id:this.plan_area_id
         }).then(res=>{
             this.$Message.success('操作成功');
             this.fileList = []
-            this.fileData = []
+            this.fileData = []
+            this.plan_area_id=""
             this.load();
             this.dialogFileVisible = false
         }).catch(error=>{
@@ -687,6 +727,7 @@
       resetFile(){
         this.fileList = []
         this.fileData = []
+        this.plan_area_id=""
         this.dialogFileVisible = false
       }
     }