<template>
  <div style="padding: 10px 15px">
    <div class="maintindetail">
      <div class="title">
        {{ facilitieinfo.name }}养护计划
        <div class="btngroup">
          <el-button
            type="primary"
            v-if="maintaininfo.status == 1"
            @click="showpf = true"
            >派 发</el-button
          >

          <el-button
            type="primary"
            v-if="maintaininfo.status == 2"
            @click="showzxfk = true"
            >执行反馈</el-button
          >
          <el-button
            type="primary"
            v-if="maintaininfo.status == 3"
            @click="showcgsc = true"
            >成果上传</el-button
          >

          <el-button
            type="danger"
            @click="
              () => {
                router.back();
              }
            "
            >返回</el-button
          >
        </div>
      </div>
      <div class="card">
        <div class="title" style="position: relative">设施信息</div>
        <div class="body">
          <el-row>
            <el-col :span="6">台账序号：{{ facilitieinfo.exId }}</el-col>
            <el-col :span="6">所在道路：{{ facilitieinfo.roadName }}</el-col>
            <el-col :span="6">性质：{{ facilitieinfo.nature }}</el-col>
            <el-col :span="6">运维长度：{{ facilitieinfo.fLength }}</el-col>
            <el-col :span="6">设施名称：{{ facilitieinfo.name }}</el-col>
            <el-col :span="18"
              >设施起止点：{{ facilitieinfo.addrFrom }}-{{
                facilitieinfo.addrEnd
              }}</el-col
            >
          </el-row>
        </div>
      </div>

      <div class="card">
        <div class="title" style="position: relative">
          养护计划信息
          <div
            style="
              position: absolute;
              right: 10px;
              top: 0;
              color: #333;
              font-size: 20px;
            "
          >
            {{
              maintain_status.filter(
                (i) => i.value.toString() === maintaininfo.status.toString()
              )[0]?.label ?? "-"
            }}
          </div>
        </div>
        <div class="body">
          <el-row>
            <el-col :span="6"
              >养护类型：{{
                maintain_type.filter(
                  (i) => i.value === maintaininfo.maintainType + ""
                )[0]?.label ?? "-"
              }}</el-col
            >
            <el-col :span="6"
              >养护数量：{{ maintaininfo.maintainCount }}</el-col
            >
            <el-col :span="6">养护单位：{{ maintaininfo.maintainUnit }}</el-col>
            <el-col :span="6"
              >报南排：{{
                maintaininfo.maintainReportNp == 1 ? "是" : "否"
              }}</el-col
            >
            <el-col :span="6">年计划：{{ maintaininfo.maintainYear }}</el-col>
            <el-col :span="6">月计划：{{ maintaininfo.maintainMonth }}</el-col>
            <el-col :span="12">计划备注：{{ maintaininfo.maintainDes }}</el-col>
            <el-col :span="24">备注：{{ maintaininfo.maintainRemark }}</el-col>
          </el-row>
        </div>
      </div>

      <div class="card" v-if="maintaininfo.status > 1">
        <div class="title">派发信息</div>
        <div class="body">
          <el-row>
            <el-col :span="6"
              >负责人：{{
                allusers.filter(
                  (i) =>
                    i.userId.toString() ===
                    JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 2
                      )[0].logDes
                    ).fzr.toString()
                )[0]?.nickName ?? "-"
              }}</el-col
            >
            <el-col :span="6"
              >联系方式：{{
                allusers.filter(
                  (i) =>
                    i.userId.toString() ===
                    JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 2
                      )[0].logDes
                    ).fzr.toString()
                )[0]?.phonenumber ?? "-"
              }}</el-col
            >
            <el-col :span="6"
              >处置班组：{{
                alldept
                  .filter(
                    (i) =>
                      (
                        JSON.parse(
                          maintaininfo.maintainLogs.filter(
                            (ii) => ii.maintainStatus === 2
                          )[0].logDes
                        ).fzbz ?? []
                      ).indexOf(i.deptId) != -1
                  )
                  .map((i) => i.deptName)
                  .join(",")
              }}</el-col
            >
            <el-col :span="6"
              >派发时间：{{
                maintaininfo.maintainLogs.filter(
                  (ii) => ii.maintainStatus === 2
                )[0].createTime
              }}</el-col
            >
          </el-row>
        </div>
      </div>

      <div class="card" v-if="maintaininfo.status >2">
        <div class="title" style="position: relative">执行反馈</div>
        <div class="body">
           <div class="titleheader" :style="`${'margin-top:0px'}`">
            {{ "作业组" }}
          </div>
          <div>
            <el-row>
                <el-col :span="6">
                  负责人：{{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.fzr}}
                </el-col>
                <el-col :span="6">
                  组员：
                  {{
                  allusers
                    .filter(
                      (i) =>
                        (
                          JSON.parse(
                            maintaininfo.maintainLogs.filter(
                              (ii) => ii.maintainStatus === 3
                            )[0].logDes
                          ).gzz.zy ?? []
                        ).indexOf(i.userId) != -1
                    )
                    .map((i) => i.nickName)
                    .join(",")
                }}

                </el-col>
                <el-col :span="6">
                  人数： {{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.rs}}
                </el-col>
                <el-col :span="6">
                  开始时间：{{ moment(JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.starttime).format("YYYY-MM-DD")}}
                </el-col>
                <el-col :span="6">
                  管线起点：{{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.addrstart}}
                </el-col>
                <el-col :span="6">
                  管线终点：{{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.addrend}}
                </el-col>
                <el-col :span="6">
                  城区： {{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.cq}}
                </el-col>

                <el-col :span="6">
                  结束时间：{{
                    moment(JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.endtime).format("YYYY-MM-DD")}}
                </el-col>
                <el-col :span="6">
                  作业地址： {{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.addr}}
                </el-col>
                 <el-col :span="6">
                  作业方式：{{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.jcsb}}
                </el-col>
                 <el-col :span="6">
                  车辆：{{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.cars}}
                </el-col>
                 <el-col :span="6">
                  车牌：{{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 3
                    )[0].logDes ?? "{}"
                  ).gzz.carnumber}}
                </el-col>
                <el-col :span="12">
                  作业照片：
                </el-col>
                <el-col :span="12">
                  工作照片：
                </el-col>
                <el-col :span="12">
                  <ImagePreview
                  v-model:src="
                  JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzz.zyimages
                  "
                  :height="'120px'"
                  :width="'120px'"
                ></ImagePreview>
                </el-col>
                <el-col :span="12">
                  <ImagePreview
                  v-model:src="
                  JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzz.gzimages
                  "
                  :height="'120px'"
                  :width="'120px'"
                ></ImagePreview>
                </el-col>
            </el-row>
          </div>
           <div class="titleheader" :style="`${'margin-top:0px'}`">
            {{ "工作量" }}
          </div>
          <div>
            <el-row>
              <el-col :span="6">管径(mm)：
                {{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.gj}}
              </el-col>
              <el-col :span="6">对应长度(m)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.dycd}}</el-col>
              <el-col :span="6">泥量(方)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.nl}}</el-col>
              <el-col :span="6">检查井(座)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.jcj}}</el-col>
              <el-col :span="6">雨水口(座)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.ysk}}</el-col>
              <el-col :span="6">箅子(个)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.bz}}</el-col>
              <el-col :span="6">雨水口支管(m)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.yskzg}}</el-col>
              <el-col :span="6">备注：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.remark}}</el-col>
              <el-col :span="12">未能作业原因：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.wnzyyy}}</el-col>
              <el-col :span="12">备注：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.remark1}}</el-col>
              <el-col :span="24">现场照片：</el-col>
              <el-col :span="24"><ImagePreview
                  v-model:src="
                  JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 3
                      )[0].logDes ?? '{}'
                    ).gzl.images
                  "
                  :height="'120px'"
                  :width="'120px'"
                ></ImagePreview></el-col>
            </el-row>
          </div>



        </div>
      </div>

      <div class="card" v-if="maintaininfo.status >3">
        <div class="title" style="position: relative">养护成果</div>
        <div class="body">

            <div class="titleheader" :style="`${'margin-top:0px'}`">
            {{ "收单方" }}
          </div>
          <div>
            <el-row>
                <el-col :span="6">
                  收单编号：{{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 4
                    )[0].logDes ?? "{}"
                  ).sdf.sdfbh}}
                </el-col>
                <el-col :span="6">
                  城区：{{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 4
                    )[0].logDes ?? "{}"
                  ).sdf.cq}}
                </el-col>
                <el-col :span="6">
                  完成月份： {{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 4
                    )[0].logDes ?? "{}"
                  ).sdf.wcyf}}
                </el-col>
                <el-col :span="6">
                  备注：{{JSON.parse(
                    maintaininfo.maintainLogs.filter(
                      (ii) => ii.maintainStatus === 4
                    )[0].logDes ?? "{}"
                  ).sdf.bz}}
                </el-col>

                <el-col :span="12">
                  作业图纸：
                </el-col>
                <el-col :span="12">
                  收单方：
                </el-col>
                <el-col :span="12">
                 <div style="position:relative">
                  <div
                  style="position: absolute; top: 0; left: 60px; width: 100%"
                >
                  <div
                    style="
                      margin-bottom: 10px;
                      color: #4f9eee;
                      display: inline-block;
                      margin-left: 10px;
                    "
                    v-for="i in JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).sdf.tz?.split(',') ?? []"
                  >
                    <a target="_blank" :href="`${STATICURL + i}`">
                      {{ i.split("/")[i.split("/").length - 1] }}
                    </a>
                  </div>  </div>
                </div>
                </el-col>
                <el-col :span="12">
                  <div style="position:relative">
                  <div
                  style="position: absolute; top: 0; left: 60px; width: 100%"
                >
                  <div
                    style="
                      margin-bottom: 10px;
                      color: #4f9eee;
                      display: inline-block;
                      margin-left: 10px;
                    "
                    v-for="i in JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).sdf.sfd?.split(',') ?? []"
                  >
                    <a target="_blank" :href="`${STATICURL + i}`">
                      {{ i.split("/")[i.split("/").length - 1] }}
                    </a>
                  </div>  </div>
                </div>
                </el-col>
                <el-col :span="12">
                  作业照片：
                </el-col>
                <el-col :span="12">
                  作业视频：
                </el-col>
                <el-col :span="12">
                   <ImagePreview
                  v-model:src="
                  JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).sdf.zyzp
                  "
                  :height="'120px'"
                  :width="'120px'"
                ></ImagePreview>
                </el-col>
                <el-col :span="12">
                    <VideoPreview
                  v-model:src="
                  JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).sdf.zysp
                  "
                  :height="'120px'"
                  :width="'120px'"
                ></VideoPreview>
                </el-col>
            </el-row>
          </div>
           <div class="titleheader" :style="`${'margin-top:0px'}`">
            {{ "班组验收信息" }}
          </div>
          <div>
            <el-row>
              <el-col :span="24">实际养护路段范围：
                {{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.sjfw}}
              </el-col>
              <el-col :span="6">管径(mm)：
                {{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.zgkj}}
              </el-col>
              <el-col :span="6">对应长度(m)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.dycd}}</el-col>
              <el-col :span="6">泥量(方)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.nl}}</el-col>
              <el-col :span="6">检查井(座)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.jcj}}</el-col>
              <el-col :span="6">雨水口(座)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.ysk}}</el-col>
              <el-col :span="6">箅子(个)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.bz}}</el-col>
              <el-col :span="6">雨水口支管(m)：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.yskzg}}</el-col>

              <el-col :span="12">验收情况：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.ysqk}}</el-col>
              <el-col :span="12">验收备注：{{JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.remark}}</el-col>
              <el-col :span="24">验收图纸：</el-col>
              <el-col :span="24">
                 <div style="position:relative">
                  <div
                  style="position: absolute; top: 0; left: 60px; width: 100%"
                >
                  <div
                    style="
                      margin-bottom: 10px;
                      color: #4f9eee;
                      display: inline-block;
                      margin-left: 10px;
                    "
                    v-for="i in JSON.parse(
                      maintaininfo.maintainLogs.filter(
                        (ii) => ii.maintainStatus === 4
                      )[0].logDes ?? '{}'
                    ).bzys.ystz?.split(',') ?? []"
                  >
                    <a target="_blank" :href="`${STATICURL + i}`">
                      {{ i.split("/")[i.split("/").length - 1] }}
                    </a>
                  </div>  </div>
                </div>
              </el-col>
            </el-row>
          </div>


        </div>
      </div>
    </div>

    <el-dialog v-model="showpf" title="计划派发" draggable>
      <div>
        <el-form :model="pdobj" label-width="120px">
          <el-form-item label="负责班组"
            ><el-tree-select
              style="width: 100%"
              v-model="pdobj.fzbz"
              multiple
              :data="treedept"
          /></el-form-item>
          <el-form-item label="负责人">
            <el-select
              v-model="pdobj.fzr"
              placeholder="请选择"
              style="width: 100%"
            >
              <el-option
                v-for="item in allusers.filter(
                  (i) => (pdobj.fzbz ?? []).indexOf(i.deptId) !== -1
                )"
                :label="item.nickName"
                :value="item.userId"
              />
            </el-select>
          </el-form-item>
        </el-form>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="showpf = false">取消</el-button>
          <el-button type="primary" @click="Maintaindistributed"
            >确定</el-button
          >
        </span>
      </template>
    </el-dialog>

    <el-dialog v-model="showzxfk" title="计划执行反馈" draggable>
      <div>
        <el-form :model="zxfkobj" label-width="10px">
          <el-form-item label="">
            <el-tabs v-model="currenttabname" class="demo-tabs">
              <el-tab-pane label="作业组" name="zyz">
                <el-row>
                  <el-col :span="6">
                    <el-form-item label="负责人" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzz.fzr"
                        placeholder="请输入负责人"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="组员" label-width="80px">
                      <el-select
                        v-model="zxfkobj.gzz.zy"
                        multiple
                        filterable
                        allow-create
                        default-first-option
                        :reserve-keyword="false"
                        placeholder="请输入组员"
                      >
                        <el-option
                          v-for="item in allusers"
                          :key="item.nickName"
                          :label="item.nickName"
                          :value="item.userId"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="人数" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzz.rs"
                        type="number"
                        placeholder="请输入人数"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="城区" label-width="80px">


                    <el-select
                        v-model="zxfkobj.gzz.cq"
                        placeholder="请选择城区"
                      >
                        <el-option
                          v-for="item in sys_area"
                          :key="item.label"
                          :label="item.label"
                          :value="item.label"
                        />
                      </el-select>

                    </el-form-item>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="6">
                    <el-form-item label="管线起点" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzz.addrstart"
                        placeholder="请输入地址"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="管线终点" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzz.addrend"
                        placeholder="请输入地址"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="开始时间" label-width="80px">
                      <el-date-picker
                        v-model="zxfkobj.gzz.starttime"
                        type="date"
                        format="YYYY-MM-DD"
                        placeholder="请选择"
                      />
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="结束时间" label-width="80px">
                      <el-date-picker
                        v-model="zxfkobj.gzz.endtime"
                        type="date"
                        format="YYYY-MM-DD"
                        placeholder="请选择"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="6">
                    <el-form-item label="作业地址" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzz.addr"
                        placeholder="请输入地址"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="作业方式" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzz.jcsb"
                        placeholder="请输入"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="车辆" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzz.cars"
                        placeholder="请输入车辆"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="车牌号" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzz.carnumber"
                        placeholder="请输入车牌号"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="作业图片" label-width="80px">
                      <ImageUpload v-model="zxfkobj.gzz.zyimages"></ImageUpload>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="工作图片" label-width="80px">
                      <ImageUpload v-model="zxfkobj.gzz.gzimages"></ImageUpload>
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-tab-pane>
              <el-tab-pane label="工作量" name="gzl">
                <el-row>
                  <el-col :span="6">
                    <el-form-item label="管径(mm)" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzl.gj"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="对应长度(m)" label-width="90px">
                      <el-input
                        v-model="zxfkobj.gzl.dycd"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="泥量(方)" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzl.nl"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="检查井(座)" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzl.jcj"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col> </el-row
                ><el-row>
                  <el-col :span="6">
                    <el-form-item label="雨水口(座)" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzl.ysk"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="6">
                    <el-form-item label="箅子(个)" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzl.bz"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="6">
                    <el-form-item label="雨水口支管(m)" label-width="120px">
                      <el-input
                        v-model="zxfkobj.gzl.yskzg"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="备注" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzl.remark"
                        placeholder="请输入备注"
                      ></el-input>
                    </el-form-item>
                  </el-col> </el-row
                ><el-row>
                  <el-col :span="12">
                    <el-form-item label="未能作业原因" label-width="100px">
                      <el-input
                        v-model="zxfkobj.gzl.wnzyyy"
                        placeholder="请输入备注"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="备注" label-width="80px">
                      <el-input
                        v-model="zxfkobj.gzl.remark1"
                        placeholder="请输入备注"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  </el-row>
                  <el-row>
                  <el-col :span="24">
                    <el-form-item label="现场图片" label-width="80px">
                      <ImageUpload v-model="zxfkobj.gzl.images"></ImageUpload>
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-tab-pane>
            </el-tabs>
          </el-form-item>
        </el-form>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="showzxfk = false">取消</el-button>
          <el-button type="primary" @click="FeedbackMaintain">确定</el-button>
        </span>
      </template>
    </el-dialog>

    <el-dialog v-model="showcgsc" title="计划成果上传" draggable>
      <div>
        <el-form :model="cgscobj" label-width="10px">
          <el-form-item label="">
            <el-tabs v-model="currenttabname1" class="demo-tabs">
              <el-tab-pane label="收单方" name="sdf">
                <el-row>
                  <el-col :span="6">
                    <el-form-item label="收方单编号" label-width="100px">
                      <el-input
                        v-model="cgscobj.sdf.sdfbh"
                        placeholder="请输入编号"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                   <el-col :span="6">
                    <el-form-item label="城区" label-width="80px">
                       <el-select
                        v-model="cgscobj.sdf.cq"
                        placeholder="请选择城区"
                      >
                        <el-option
                          v-for="item in sys_area"
                          :key="item.label"
                          :label="item.label"
                          :value="item.label"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="完成月份" label-width="80px">
                     <el-select
                        v-model="cgscobj.sdf.wcyf"
                        placeholder="请选择月份"
                      >
                        <el-option
                          v-for="item in getmonth()"
                          :key="item"
                          :label="item"
                          :value="item"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="备注" label-width="80px">
                      <el-input
                        v-model="cgscobj.sdf.bz"
                        type="number"
                        placeholder="请输入备注"
                      ></el-input>
                    </el-form-item>
                  </el-col>

                </el-row>

                <el-row>
                  <el-col :span="12">
                    <el-form-item label="作业图纸" label-width="80px">
                      <FileUpload v-model="cgscobj.sdf.tz" :fileSize="100"></FileUpload>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="收单方" label-width="80px">
                      <FileUpload v-model="cgscobj.sdf.sfd" :fileSize="100"></FileUpload>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="作业照片" label-width="80px">
                       <ImageUpload v-model="cgscobj.sdf.zyzp"></ImageUpload>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="作业视频" label-width="80px">
                       <VideoUpload v-model="cgscobj.sdf.zysp"></VideoUpload>
                    </el-form-item>
                  </el-col>
                </el-row>


              </el-tab-pane>
              <el-tab-pane label="班组验收信息" name="bzys">
                <el-row>
                   <el-col :span="24">
                    <el-form-item label="实际养护路段范围" label-width="130px">
                      <el-input
                        v-model="cgscobj.bzys.sjfw"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="管径(mm)" label-width="80px">
                      <el-input
                        v-model="cgscobj.bzys.zgkj"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="对应长度(m)" label-width="90px">
                      <el-input
                        v-model="cgscobj.bzys.dycd"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="泥量(方)" label-width="80px">
                      <el-input
                        v-model="cgscobj.bzys.nl"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="检查井(座)" label-width="80px">
                      <el-input
                        v-model="cgscobj.bzys.jcj"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col> </el-row
                ><el-row>
                  <el-col :span="6">
                    <el-form-item label="雨水口(座)" label-width="80px">
                      <el-input
                        v-model="cgscobj.bzys.ysk"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="6">
                    <el-form-item label="箅子(个)" label-width="80px">
                      <el-input
                        v-model="cgscobj.bzys.bz"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="6">
                    <el-form-item label="雨水口支管(m)" label-width="120px">
                      <el-input
                        v-model="cgscobj.bzys.yskzg"
                         type="number"
                        placeholder="请输入数量"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                   </el-row
                ><el-row>
                  <el-col :span="12">
                    <el-form-item label="验收情况" label-width="100px">
                      <el-input
                        v-model="cgscobj.bzys.ysqk"
                        placeholder="请输入"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="验收备注" label-width="80px">
                      <el-input
                        v-model="cgscobj.bzys.remark"
                        placeholder="请输入备注"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  </el-row>
                  <el-row>
                  <el-col :span="24">
                    <el-form-item label="验收图纸" label-width="80px">
                      <FileUpload v-model="cgscobj.bzys.ystz"></FileUpload>
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-tab-pane>
            </el-tabs>
          </el-form-item>
        </el-form>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="showcgsc = false">取消</el-button>
          <el-button type="primary" @click="MaintainComplete">确定</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script lang="ts" setup>
import { defineComponent, ref, onMounted, watch } from "vue";
import { useDict } from "@/utils/dict";
// 图片预览组件
import ImagePreview from "@/components/ImagePreview";
import ImageUpload from "@/components/ImageUpload";
import FileUpload from "@/components/FileUpload";
import VideoUpload from "@/components/VideoUpload";
import VideoPreview from "@/components/VideoPreview";
import { cloneDeep } from "lodash";
import { listDept, getDept } from "@/api/system/dept";
import { ElMessage } from "element-plus";
import router from "../../../router";
import { useRoute } from "vue-router";
import { listFacilities, getFacilities } from "@/api/system/facilities";
import {
  listMaintain,
  addMaintain,
  getMaintain,
  distributedMaintain,
  feedbackMaintain,
  completeMaintain
} from "@/api/system/maintain";
import {
  changeUserStatus,
  listUser,
  resetUserPwd,
  delUser,
  getUser,
  updateUser,
  addUser,
} from "@/api/system/user";
import { treeselect as deptTreeselect } from "@/api/system/dept";
import moment from "moment";

const { maintain_status, maintain_type,sys_area } = useDict(
  "maintain_status",
  "maintain_type",
  "sys_area"
);

const STATICURL = import.meta.env.VITE_APP_BASE_API;
const route = useRoute();
if (!route.params.id || route.params.id == "undefined") {
  router.back();
}

const currenttabname = ref("zyz");
const currenttabname1 = ref("sdf");
const showzxfk = ref(false);
const zxfkobj = ref({
  gzz: {
    fzr: "",
    zy: "",
    rs: 1,
    starttime: "",
    endtime: "",
    addrstart: "",
    addrend: "",
    cq: "",
    addr: "",
    jcsb: "",
    cars: "",
    carnumber: "",
    zyimages: [],
    gzimages: [],
  },
  gzl: {
    gj: "",
    dycd: "",
    nl: "",
    jcj: "",
    ysk: "",
    bz: "",
    yskzg: "",
    remark: "",
    wnzyyy: "",
    remark1: "",
    images: [],
  },
});
const FeedbackMaintain = () => {
  feedbackMaintain({
    maintainId: route.params.id,
    logDes: JSON.stringify(zxfkobj.value),
  }).then((res) => {
    showzxfk.value = false;
    ElMessage.success("反馈成功！");
    getMaintain(Number(route.params.id)).then((res) => {
      maintaininfo.value = res.data;
    });
  });
}

const showcgsc = ref(false);
const cgscobj = ref({
  sdf: {
    sdfbh: "",
    cq: "",
    rs: 1,
    wcyf: "",
    bz: "",
    tz: [],
    sfd: [],
    zyzp: [],
    zysp: []
  },
  bzys: {
    sjfw: "",
    zgkj: "",
    dycd: "",
    nl: "",
    jcj: "",
    ysk: "",
    bz: "",
    yskzg: "",
    ysqk: "",
    remark: "",
    ystz: [],
  },
});
const MaintainComplete = () => {
  completeMaintain({
    maintainId: route.params.id,
    logDes: JSON.stringify(cgscobj.value),
  }).then((res) => {
    showcgsc.value = false;
    ElMessage.success("上传成功！");
    getMaintain(Number(route.params.id)).then((res) => {
      maintaininfo.value = res.data;
    });
  });
}




const showpf = ref(false);
const pdobj = ref({ fzbz: [], fzr: "" });
const Maintaindistributed = () => {
  distributedMaintain({
    maintainId: route.params.id,
    logDes: JSON.stringify(pdobj.value),
  }).then((res) => {
    showpf.value = false;
    ElMessage.success("派发成功！");
    getMaintain(Number(route.params.id)).then((res) => {
      maintaininfo.value = res.data;
    });
  });
};





const alldept = ref([]);
listDept().then((response) => {
  alldept.value = cloneDeep(response.data);
});

function setdatakey(dept) {
  if (dept.children) {
    dept.children = dept.children.map((i) => {
      return setdatakey(i);
    });
  }
  dept["value"] = dept.id;
  return dept;
}

const treedept = ref([]);
const allusers = ref([]);

deptTreeselect().then((res) => {
  treedept.value = [setdatakey(res.data[0])];
});
const facilitieinfo = ref({
  addrEnd: "",
  addrFrom: "",
  areaAdDes: "",
  areaDes: "",
  createBy: null,
  createTime: null,
  exId: 1,
  exId1: "",
  ext1: null,
  fLength: "0",
  id: null,
  name: "",
  nature: "",
  params: {},
  remark: null,
  roadName: "",
  searchValue: null,
  updateBy: null,
  updateTime: null,
});
const maintaininfo = ref({
  createBy: null,
  createTime: null,
  ext1: "多少v啥的",
  ext2: null,
  facilitiesId: 1,
  id: 1,
  maintainCount: 2,
  maintainDes: "是东方闪电",
  maintainLogs: [],
  maintainMonth: "06",
  maintainRemark: "是东方闪电",
  maintainReportNp: 1,
  maintainType: 1,
  maintainUnit: "南宁公交集团",
  maintainYear: "2022",
  params: {},
  remark: null,
  searchValue: null,
  status: 1,
  updateBy: null,
  updateTime: null,
});

const getmonth = () => {
  var months = [];
  for (var i = 0; i < 12; i++) {
    if (i < 9) {
       months.push("0"+(1 + i).toString());

    } else {
       months.push((1 + i).toString());
    }
  }
  return months;
}
onMounted(async () => {
  await listUser({ pageSize: 1000 }).then((res) => {
    allusers.value = res.rows;
  });
  getMaintain(Number(route.params.id)).then((res) => {
    maintaininfo.value = res.data;
    if (Number(maintaininfo.value.status) > 1) {
      try {
        zxfkobj.value.gzz.fzr =
          allusers.value.filter(
            (i) =>
              i.userId.toString() ===
              JSON.parse(
                maintaininfo.value.maintainLogs.filter(
                  (ii) => ii.maintainStatus === 2
                )[0].logDes
              ).fzr.toString()
          )[0]?.nickName ?? "-";
      } catch (e) {}
    }
    getFacilities(maintaininfo.value.facilitiesId).then((rep) => {
      facilitieinfo.value = rep.data;
    });
  });
});
</script>

<style lang="scss">
.demo-tabs {
  width: 100%;
}
.el-row {
  margin-bottom: 20px;
}
.maintindetail {
  background: #fff;
  padding: 30px 22px;
  border-radius: 8px;
  overflow-y: auto;
  padding-top: 20px;
  position: relative;

  .el-select {
    width: 100%;
  }

  .title {
    color: #2b3551;
    font-size: 16px;
    font-weight: 400;
    .btngroup {
      position: absolute;
      top: 13px;
      right: 20px;
      .el-button {
        margin-left: 25px;
      }
    }
  }
  .card {
    border: 1px solid #e5e9f2;
    border-radius: 8px;
    margin-top: 16px;
    overflow: hidden;
    .title {
      background: rgba(192, 204, 218, 0.2);
      height: 54px;
      line-height: 54px;
      color: #324057;
      font-size: 14px;
      font-weight: Bold;
      padding-left: 22px;
    }
    .body {
      padding: 20px;
      color: #475669;
      font-size: 14px;
      // padding-top: 10px;
      .el-col {
        margin-bottom: 20px;
      }
      .titleheader {
        color: #2c7de3;
        font-weight: Bold;
        margin-bottom: 24px;
        margin-top: 20px;
      }
    }
  }
}
</style>
