index.vue 17.6 KB
<template>
  <div class="app-container">
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button :class="{'el-button':true, 'el-button--primary':this.queryParams.pageStatus==0}" size="mini"
          @click="getList(0);">报工自查</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button :class="{'el-button':true,'el-button--primary':this.queryParams.pageStatus==1}" size="mini"
          @click="getList(1);">报工抽查</el-button>
      </el-col>
    </el-row>


    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="项目名称" prop="name">
          <el-input v-model="queryParams.name" placeholder="请输入项目类型 "  size="small" />
      </el-form-item>
      <el-form-item label="项目类型" prop="type">
        <el-select v-model="queryParams.type" placeholder="请选择项目类型 "  size="small">
          <el-option label="工地" value="0" />
          <el-option label="消纳场" value="1" />
        </el-select>
      </el-form-item>
      <el-form-item label="所属区域" prop="place">
        <el-select v-model="queryParams.place" placeholder="请选择所属区域 "  size="small">
         <el-option v-for="item in areas" :label="item.name" :value="item.code" :key="item.code" />
        </el-select>
      </el-form-item>

      <el-form-item label="开始时间" prop="workStartTime" v-if="this.queryParams.status==1">
        <el-date-picker  size="small" style="width: 200px" v-model="queryParams.workStartTime" type="date"
          value-format="yyyy-MM-dd" placeholder="开始时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="结束时间" prop="workEndTime" v-if="this.queryParams.status==1">
        <el-date-picker  size="small" style="width: 200px" v-model="queryParams.workEndTime" type="date"
          value-format="yyyy-MM-dd" placeholder="开始时间">
        </el-date-picker>
      </el-form-item>


      <el-form-item>
        <el-button type="primary" size="mini" @click="handleQuery">搜索</el-button>
        <el-button size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" size="mini" @click="handleAdd" v-hasPermi="['business:threestep:add']" v-if="this.queryParams.pageStatus==0 && new Date().getHours() > 7 && new Date().getHours() < 24">新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button size="mini" @click="handleExport" v-hasPermi="['business:threestep:export']">导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="threestepList" @selection-change="handleSelectionChange">
      <el-table-column label="序号" align="center" type='index'/>

      <el-table-column label="项目类型" align="center" prop="type">
        <template slot-scope="scope">
          <span>{{ scope.row.type==0?"工地":"消纳场"}}</span>
        </template>
      </el-table-column>
      <el-table-column label="项目名称" align="center" prop="name" />

      <el-table-column label="管辖区" align="center" prop="place">
      </el-table-column>

      <el-table-column label="自查时间" align="center" prop="selfCheckTime" width="180">
        <template slot-scope="scope">
          <span>{{scope.row.selfCheckTime}}</span>
        </template>
      </el-table-column>
      <el-table-column label="巡查时间" align="center" prop="checkTime" width="180">
        <template slot-scope="scope">
          <span>{{ scope.row.checkTime}}</span>
        </template>
      </el-table-column>
      <el-table-column label="抽查时间" align="center" prop="checkEndTime" width="180" v-if="queryParams.pageStatus==1">
        <template slot-scope="scope">
          <span>{{ scope.row.checkEndTime }}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row,0)"
            v-hasPermi="['business:threestep:edit']" v-if="queryParams.pageStatus==1 && scope.row.status==1 && scope.row.checkEndTime == null">抽查</el-button>
            <el-button size="mini" type="text" icon="el-icon-edit" @click="reSub(scope.row)"
              v-hasPermi="['business:threestep:add']" v-if="scope.row.status==2">被驳回</el-button>

          <el-button size="mini" type="text" @click="handleUpdate(scope.row,1)"  v-hasPermi="['business:threestep:edit']">查看详情</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />

    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body v-loading="loading">
      <el-form ref="form" :model="form" :rules="rules" label-width="100px" v-if="open">
        <el-row type="flex" justify="center">
          <el-col :span="12">
            <el-form-item label="项目类型" prop="type">
              <el-select v-model="form.type" placeholder="请选择项目类型" @change="selectType">
                <el-option label="工地" value="0" />
                <el-option label="消纳场" value="1" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所属区域" prop="place">
              <el-select v-model="form.place" placeholder="请选择所属区域" filterable  reserve-keyword @clear="areaClear" @change="selectArea">
                <el-option v-for="item in areas" :label="item.name" :value="item.code" :key="item.code">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" justify="center" v-if="form.type != null">
          <el-col :span="12">
            <el-form-item :label="labelName" prop="name">
              <el-select v-model="form.name" filterable  reserve-keyword @change="getObjId">
                <el-option v-for="item in remoteData" :label="item.name"
                  :value="item.name" :key="item.id" v-if="!form.place || item.areaCode == form.place">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="labelName2" prop="place">
              <el-select v-model="bindname" filterable  reserve-keyword @change="getEarthsiteId">
                <el-option  v-if="item.show"
                  v-for="item in bindData"
                  :label="item.name"
                  :value="item.name"
                  :key="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" justify="center"  v-if="form.type != null">
          <el-col>
            <el-form-item label="消纳合同" prop="contract">
              <el-select v-model="form.contract" filterable  reserve-keyword  @change="conractCheck">
                <el-option v-for="item in filterContract" :label="item.contractNo" :value="item.contractNo" :key="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" justify="center" v-if="form.type == 0" >
          <el-col :span="12" >
            <el-form-item label="运输企业" prop="companys">
              <el-select v-model="form.companys" filterable multiple @change="checkCompany" >
                <el-option  v-for="item in companyList" :label="item.name" :value="item.name" :key="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12" >
            <el-form-item label="运输车辆" prop="companyTrucks" >
              <el-select v-model="form.companyTrucks" filterable multiple  reserve-keyword >
                <el-option v-for="item in truckList" :label="item.licenseplateNo" :value="item.id" :key="item.id"
                v-if="form.companys && (form.companys.indexOf(item.companyName) > -1)"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" justify="center"  v-if="form.type != null">
          <el-col :span="12">
            <el-form-item label="现场负责人" prop="person">
              <el-input v-model="form.person" :maxlength="20" show-word-limit  />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话" prop="phone">
              <el-input v-model="form.phone" :maxlength="11" show-word-limit  />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" justify="center"  v-if="form.type != null">
          <el-col>
            上传附件:<a style="color:blue;font-size: 12px;" @click="picSample=true">示意图</a>
          </el-col>
        </el-row>
        <el-row type="flex" justify="center" style="margin-top: 20px;"  v-if="form.type != null">
          <el-col :span="6">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(0)">过水槽照片</a>
            <el-input v-model="form.img0" type="hidden"></el-input>
            <p v-for="img,index in form.img0">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(0,img)" style="color:red"> x</a></p>
          </el-col>
          <el-col :span="6">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(1)">洗车平台照片</a>
            <el-input v-model="form.img1" type="hidden"></el-input>
            <p v-for="img,index in form.img1">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(1,img)" style="color:red"> x</a></p>
          </el-col>
          <el-col :span="6">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(2)">出入口照片</a>
            <el-input v-model="form.img2" type="hidden"></el-input>
            <p v-for="img,index in form.img2">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(2,img)" style="color:red"> x</a></p>
          </el-col>
          <el-col :span="6">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(3)">沉淀池照片</a>
            <el-input v-model="form.img3" type="hidden"></el-input>
            <p v-for="img,index in form.img3">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(3,img)" style="color:red"> x</a></p>
          </el-col>
        </el-row>
        <el-row type="flex" justify="center"  v-if="form.type != null">
          <el-col :span="6">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(4)">硬质路面照片</a>
            <el-input v-model="form.img4" type="hidden"></el-input>
            <p v-for="img,index in form.img4">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(4,img)" style="color:red"> x</a></p>
          </el-col>
          <el-col :span="6">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(5)">{{form.type==0?"摄像头视频截图1":"洗车设施照片"}}</a>
            <el-input v-model="form.img5" type="hidden"></el-input>
            <p v-for="img,index in form.img5">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(5,img)" style="color:red"> x</a></p>
          </el-col>
          <el-col :span="6">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(6)">{{form.type==0?"摄像头视频截图2":"雾炮机"}}</a>
            <el-input v-model="form.img6" type="hidden"></el-input>
            <p v-for="img,index in form.img6">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(6,img)" style="color:red"> x</a></p>
          </el-col>
          <el-col :span="6">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(7)">{{form.type==0?"摄像头视频截图3":"裸露黄土覆盖照片"}}</a>
            <el-input v-model="form.img7" type="hidden"></el-input>
            <p v-for="img,index in form.img7">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(7,img)" style="color:red"> x</a></p>
          </el-col>
        </el-row>
        <el-row type="flex" justify="center"  v-if="form.type != null">
          <el-col :span="5">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(8)">其他1</a>
            <el-input v-model="form.img8" type="hidden"></el-input>
            <p v-for="img,index in form.img8">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(8,img)" style="color:red"> x</a></p>
          </el-col>
          <el-col :span="5">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(9)">其他2</a>
            <el-input v-model="form.img9" type="hidden"></el-input>
            <p v-for="img,index in form.img9">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(9,img)" style="color:red"> x</a></p>
          </el-col>
          <el-col :span="5">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(10)">其他3</a>
            <el-input v-model="form.img10" type="hidden"></el-input>
            <p v-for="img,index in form.img10">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(10,img)" style="color:red"> x</a>
            </p>
          </el-col>
          <el-col :span="5">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(11)">其他4</a>
            <el-input v-model="form.img11" type="hidden"></el-input>
            <p v-for="img,index  in form.img11">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(11,img)" style="color:red"> x</a>
            </p>
          </el-col>
          <el-col :span="4">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(12)">其他5</a>
            <el-input v-model="form.img12" type="hidden"></el-input>
            <p v-for="img,index in form.img12">{{img.split("/")[img.split("/").length -1]}}<a @click="removeImage(12,img)" style="color:red"> x</a>
            </p>
          </el-col>
        </el-row>

          <el-input v-model="form.earthsitesId" type="hidden" />
        <el-input v-model="form.objectId" type="hidden" />
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" >确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>


    <el-dialog title="抽查" width="800px" append-to-body :visible.sync="info">
      <threestepInfo :businessKey="businessKey" v-if="info"/>

      <el-form ref="form" :model="form" :rules="rules" label-width="100px" v-if="this.queryParams.pageStatus==1">
        <el-form-item label="补充说明">
          <el-input type="textarea" v-model="form.subSubReason" maxlength="100"></el-input>
        </el-form-item>

        <el-row type="flex" justify="center">
          <el-col :span="8">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(91)">附件1</a>
            <el-input v-model="form.attchItem1" type="hidden"></el-input>
            <p v-for="img,index in form.attchItem1">{{img.split("/")[img.split("/").length -1]}}<a @click="removeAttchItem(1,img)" style="color:red"> x</a></p>
          </el-col>
          <el-col :span="8">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(92)">附件2</a>
            <el-input v-model="form.attchItem2" type="hidden"></el-input>
            <p v-for="img,index in form.attchItem2">{{img.split("/")[img.split("/").length -1]}}<a @click="removeAttchItem(2,img)" style="color:red"> x</a></p>
          </el-col>
          <el-col :span="8">
            <a style="color:blue;font-size: 12px;" @click="showFileUpload(93)">附件3</a>
            <el-input v-model="form.attchItem3" type="hidden"></el-input>
            <p v-for="img,index in form.attchItem3">{{img.split("/")[img.split("/").length -1]}}<a @click="removeAttchItem(3,img)" style="color:red"> x</a></p>
          </el-col>
        </el-row>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="checkEndSuccess()" v-if="this.queryParams.pageStatus==1">抽查通过</el-button>
        <el-button type="danger" @click="checkEndError()" v-if="this.queryParams.pageStatus==1">异常</el-button>
        <el-button @click="info=false;">关 闭</el-button>
      </div>
    </el-dialog>

    <el-dialog title="查看详情" width="800px" append-to-body :visible.sync="info2">
      <threestepInfo :businessKey="businessKey" v-if="info2"/>
    </el-dialog>


    <el-dialog title="附件" :visible.sync="uploadImageDialog" append-to-body :beforeClose="handleClose" >
      <el-upload multiple :headers="upload.headers" :action="upload.url" :file-list="fileList"
        :on-success="uploadSuccess" :before-upload="beforeUpload">
        <el-button size="small" type="primary">选择附件</el-button>
        <div slot="tip" class="el-upload__tip">只能上传不超过 20MB 的jpg pdf word文件</div>
      </el-upload>
      <div style="height: 40px;width:100%;">
        <el-button type="primary" style="margin-top: 20px;float:right;" @click="handleClose">关闭</el-button>
      </div>
    </el-dialog>

    <el-dialog title="示意图" :visible.sync="picSample" append-to-body>
      <img src="../../../assets/logo/logo.jpg" width="100%" height="800px" />
    </el-dialog>
  </div>

</template>


<script src="../../../api/three_step.js" />