postdischarge-ui/src/views/manage/Datadetails/index.vue

<template>
  <div class="app-container">
    <div class="list">
      <div class="timelist">
        <div class="timetitle">
          {{ this.$route.query.patientName }}，管理路径节点
        </div>
        <el-timeline>
          <el-timeline-item
            v-for="(uitem, uindex) in getAllNodeByPatientlist"
            :key="uindex"
            :color="listindex == uindex ? '#409EFF' : ''"
          >
            <div class="top">
              <div class="toptop">
                <el-select
                  v-model="uitem.routeNodeName"
                  style="width: 87px"
                  disabled
                >
                  <el-option label="出院后" value="AFTER_DISCHARGE" />
                  <el-option label="入院后" value="AFTER_ADMISSION" />
                  <el-option label="就诊后" value="AFTER_CONSULTATION" />
                  <el-option
                    label="就诊/出院后"
                    value="AFTER_VISIT_DISCHARGE"
                  />
                  <el-option label="术前" value="PREOPERATIVE" />
                  <el-option label="术后" value="POSTOPERATIVE" />
                </el-select>
                <el-input
                  disabled
                  v-model="uitem.routeNodeDay"
                  style="width: 70px"
                  type="number"
                ></el-input>
                <span>天</span>
              </div>
              <div></div>
            </div>
            <el-card
              v-for="(ulitem, ulindex) in uitem.list"
              :key="ulindex"
              @click.native="bottomclickevent(ulitem, uindex, ulindex)"
              :class="
                listindex == uindex && itemindex == ulindex ? 'cards' : ''
              "
            >
              <h3 style="height: 20px">{{ ulitem.taskTypeName }}</h3>
              <el-tag
                v-if="ulitem.routeCheckStatus == 'AGREE'"
                class="routeCheckStatus"
                >已审核</el-tag
              >
              <el-tag
                v-else-if="ulitem.routeCheckStatus == 'DISAGREE'"
                type="danger"
                class="routeCheckStatus"
                >不同意</el-tag
              >
              <el-tag v-else type="warning" class="routeCheckStatus"
                >未审核</el-tag
              >
              <p style="height: 16px">{{ ulitem.taskPartitionDictName }}</p>
            </el-card>
          </el-timeline-item>
        </el-timeline>
      </div>
      <div class="texts">
        <div class="topform">
          <div v-if="getParamslistData">
            <div
              v-for="(item, index) in getParamslistData"
              :key="index"
              style="display: flex"
            >
              <el-card class="box-card">
                <el-form
                  ref="form"
                  :inline="true"
                  :model="form"
                  class="form"
                  label-width="100px"
                  :rules="rules"
                >
                  <el-form-item
                    :label="ite.paramName"
                    v-for="(ite, ind) in item"
                    :key="ind"
                  >
                    <el-input
                      class="textarea"
                      v-model="ite.paramValue"
                    ></el-input>
                  </el-form-item>
                </el-form>
              </el-card>
              <div class="icon">
                <i
                  class="el-icon-delete"
                  @click="delitem(index)"
                  v-if="index != 0"
                ></i>
                <i
                  v-if="index == 0"
                  class="el-icon-circle-plus-outline"
                  @click="additem(index)"
                ></i>
                <el-button
                  v-if="
                    taskPartitionCode == 'MEDICATION_GUIDE' ||
                    taskPartitionCode == 'SPORT_GUIDE' ||
                    taskPartitionCode == 'DIET_GUIDE' ||
                    taskPartitionCode == 'NURSING_GUIDE'
                  "
                  round
                  style="margin-left: 10px"
                  @click="knowledge(index, item)"
                  >知识库获取</el-button
                >
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="TemporaryStorage" type="primary">保 存</el-button>
    </div>
    <!-- 药品名称弹框 -->
    <el-dialog
      title=""
      :visible.sync="Drugshow"
      width="1200px"
      append-to-body
      :before-close="innerVisiblecancel"
    >
      <el-form
        ref="queryForm"
        :model="informationqueryParams"
        :rules="rules"
        label-width="80px"
        :inline="true"
      >
        <el-form-item label="药品名称" prop="drugName" label-width="120">
          <el-input
            v-model="informationqueryParams.drugName"
            placeholder="请输入药品名称"
            clearable
          />
        </el-form-item>
        <el-form-item label="适用症" prop="purpose">
          <el-input
            v-model="informationqueryParams.purpose"
            placeholder="请输入适用症"
            clearable
          />
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="mini"
            @click="informationInfoinfo"
            >搜索</el-button
          >
          <el-button
            icon="el-icon-refresh"
            size="mini"
            @click="addresetQuerylist"
            >重置</el-button
          >
        </el-form-item>
      </el-form>

      <el-table
        :data="baseDrugList"
        @cell-dblclick="nurseclick"
        v-loading="loading"
      >
        <el-table-column label="请选择" width="100" align="center">
          <template slot-scope="scope">
            <el-button
              type="primary"
              style="width: 15px; height: 15px"
              v-if="getParamslistData[indexdata].ids == scope.row.id"
              circle
              @click="nurseclick(scope.row)"
            ></el-button>
            <el-button
              v-else
              style="width: 15px; height: 15px"
              circle
              @click="nurseclick(scope.row)"
            ></el-button>
          </template>
        </el-table-column>
        <el-table-column
          label="药品名称"
          align="center"
          prop="drugName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="适用症"
          align="center"
          prop="purpose"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="给药途径"
          align="center"
          prop="applyWay"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="用药频次"
          align="center"
          prop="applyFrequency"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="服药说明"
          align="center"
          prop="applyRemark"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="用法用量(服法剂量)"
          align="center"
          prop="dosage"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="副作用(不良反应)"
          align="center"
          prop="sideEffects"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="禁忌症"
          align="center"
          prop="contraindications"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="存储条件"
          align="center"
          prop="storage"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="漏服或过服的处理方法"
          align="center"
          prop="emergency"
          :show-overflow-tooltip="true"
        />
      </el-table>
      <pagination
        v-show="baseDrugtotal > 0"
        :total="baseDrugtotal"
        :page.sync="informationqueryParams.pageNum"
        :limit.sync="informationqueryParams.pageSize"
        @pagination="informationInfoinfo"
      />
    </el-dialog>
    <!-- 运动弹框 -->
    <el-dialog
      title=""
      :visible.sync="Sportshow"
      width="1200px"
      append-to-body
      :before-close="innerVisiblecancel"
    >
      <el-form
        ref="queryForm"
        :model="SporParams"
        :rules="rules"
        label-width="80px"
        :inline="true"
      >
        <el-form-item label="运动名称" prop="sportName">
          <el-input
            v-model="SporParams.sportName"
            placeholder="请输入运动名称"
            clearable
          />
        </el-form-item>
        <el-form-item label="运动方式" prop="sportWay">
          <el-input
            v-model="SporParams.sportWay"
            placeholder="请输入运动方式"
            clearable
          />
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="mini"
            @click="spotgetList"
            >搜索</el-button
          >
          <el-button
            icon="el-icon-refresh"
            size="mini"
            @click="addresetQuerylist"
            >重置</el-button
          >
        </el-form-item>
      </el-form>

      <el-table
        :data="baseSportList"
        @cell-dblclick="nurseclick"
        v-loading="loading"
      >
        <el-table-column label="请选择" width="100" align="center">
          <template slot-scope="scope">
            <el-button
              type="primary"
              style="width: 15px; height: 15px"
              v-if="getParamslistData[indexdata].ids == scope.row.id"
              circle
              @click="nurseclick(scope.row)"
            ></el-button>
            <el-button
              v-else
              style="width: 15px; height: 15px"
              circle
              @click="nurseclick(scope.row)"
            ></el-button>
          </template>
        </el-table-column>
        <el-table-column
          label="运动名称"
          align="center"
          prop="sportName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="运动类型名称"
          align="center"
          prop="sportTypeName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="运动方式"
          align="center"
          prop="sportWay"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="运动频率"
          align="center"
          prop="sportFrequency"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="每次运动时长"
          align="center"
          prop="sportDuration"
          :show-overflow-tooltip="true"
        />
        <el-table-column label="运动时间" align="center" prop="sportTime" />
        <el-table-column
          label="运动强度"
          align="center"
          prop="sportIntensity"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="运动注意事项"
          align="center"
          prop="sportAttention"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="动作说明"
          align="center"
          prop="sportRemark"
          :show-overflow-tooltip="true"
        />
      </el-table>
      <pagination
        v-show="Sporttotal > 0"
        :total="Sporttotal"
        :page.sync="SporParams.pageNum"
        :limit.sync="SporParams.pageSize"
        @pagination="spotgetList"
      />
    </el-dialog>
    <!-- 饮食弹框 -->
    <el-dialog
      title=""
      :visible.sync="Dieshow"
      width="1200px"
      append-to-body
      :before-close="innerVisiblecancel"
    >
      <el-form
        ref="queryForm"
        :model="SporParams"
        :rules="rules"
        label-width="80px"
        :inline="true"
      >
        <el-form-item label="饮食建议名称" prop="dietName">
          <el-input
            v-model="SporParams.dietName"
            placeholder="请输入饮食建议名称"
            clearable
          />
        </el-form-item>
        <el-form-item label="饮食原则" prop="dietPrinciple">
          <el-input
            v-model="SporParams.dietPrinciple"
            placeholder="请输入饮食原则"
            clearable
          />
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="mini"
            @click="DiegetList"
            >搜索</el-button
          >
          <el-button
            icon="el-icon-refresh"
            size="mini"
            @click="addresetQuerylist"
            >重置</el-button
          >
        </el-form-item>
      </el-form>

      <el-table
        :data="baseDietList"
        @cell-dblclick="nurseclick"
        v-loading="loading"
      >
        <el-table-column label="请选择" width="100" align="center">
          <template slot-scope="scope">
            <el-button
              type="primary"
              style="width: 15px; height: 15px"
              v-if="getParamslistData[indexdata].ids == scope.row.id"
              circle
              @click="nurseclick(scope.row)"
            ></el-button>
            <el-button
              v-else
              style="width: 15px; height: 15px"
              circle
              @click="nurseclick(scope.row)"
            ></el-button>
          </template>
        </el-table-column>

        <el-table-column
          label="饮食建议名称"
          align="center"
          prop="dietName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="饮食原则"
          align="center"
          prop="dietPrinciple"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="主食推荐"
          align="center"
          prop="mainFood"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="蔬菜推荐"
          align="center"
          prop="vegetable"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="水果推荐"
          align="center"
          prop="fruit"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="肉类推荐"
          align="center"
          prop="meat"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="饮食说明"
          align="center"
          prop="dietRemark"
          :show-overflow-tooltip="true"
        />
      </el-table>
      <pagination
        v-show="Dietotal > 0"
        :total="Dietotal"
        :page.sync="DieParams.pageNum"
        :limit.sync="DieParams.pageSize"
        @pagination="DiegetList"
      />
    </el-dialog>
    <!-- 护理弹框 -->
    <el-dialog
      title=""
      :visible.sync="Nursingshow"
      width="1200px"
      append-to-body
      :before-close="innerVisiblecancel"
    >
      <el-form
        ref="queryForm"
        :model="NursingParams"
        :rules="rules"
        label-width="80px"
        :inline="true"
      >
        <el-form-item label="护理知识名称" prop="nursingName">
          <el-input
            v-model="NursingParams.nursingName"
            placeholder="请输入护理知识名称"
            clearable
          />
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="mini"
            @click="NursinggetList"
            >搜索</el-button
          >
          <el-button
            icon="el-icon-refresh"
            size="mini"
            @click="addresetQuerylist"
            >重置</el-button
          >
        </el-form-item>
      </el-form>

      <el-table
        :data="baseNursingList"
        @cell-dblclick="nurseclick"
        v-loading="loading"
      >
        <el-table-column label="请选择" width="100" align="center">
          <template slot-scope="scope">
            <el-button
              type="primary"
              style="width: 15px; height: 15px"
              v-if="getParamslistData[indexdata].ids == scope.row.id"
              circle
              @click="nurseclick(scope.row)"
            ></el-button>
            <el-button
              v-else
              style="width: 15px; height: 15px"
              circle
              @click="nurseclick(scope.row)"
            ></el-button>
          </template>
        </el-table-column>
        <el-table-column
          label="护理知识名称"
          align="center"
          prop="nursingName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="烟酒指导"
          align="center"
          prop="tobaccoWine"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="睡眠指导"
          align="center"
          prop="sleep"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="情绪指导"
          align="center"
          prop="emotion"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="居家安全指导"
          align="center"
          prop="homeSafeguard"
          :show-overflow-tooltip="true"
        />
      </el-table>
      <pagination
        v-show="Nursingtotal > 0"
        :total="Nursingtotal"
        :page.sync="NursingParams.pageNum"
        :limit.sync="NursingParams.pageSize"
        @pagination="NursinggetList"
      />
    </el-dialog>
  </div>
</template>

<script>
import { getAllNodeByPatient, getParams, inserList } from '@/api/manage/Datadetails'
import { listBaseDrug } from "@/api/system/baseDrug";
import { listBaseSport } from "@/api/system/baseSport";
import { listBaseDiet } from "@/api/system/baseDiet";
import { listBaseNursing } from "@/api/system/baseNursing";
export default {
  name: "datadetails",
  data() {
    return {
      itemid: null,
      // 药品
      baseDrugList: [],
      loading: true,
      baseDrugtotal: 0,
      Drugshow: false,
      informationqueryParams: {
        pageNum: 1,
        pageSize: 10,
        drugName: null,
      },
      //运动
      baseSportList: [],
      Sporttotal: 0,
      Sportshow: false,
      SporParams: {
        pageNum: 1,
        pageSize: 10,
        sportName: null,
        sportWay: null,
      },

      // 饮食
      baseDietList: [],
      Dietotal: 0,
      Dieshow: false,
      DieParams: {
        pageNum: 1,
        pageSize: 10,
        dietName: null,
        dietPrinciple: null,
      },
      // 护理
      baseNursingList: [],
      Nursingtotal: 0,
      Nursingshow: false,
      NursingParams: {
        pageNum: 1,
        pageSize: 10,
        nursingName: null,
      },
      itemdata: {},

      // infolist: [],
      taskPartitionCode: "",
      // 左侧列表
      getAllNodeByPatientlist: [],
      // 右侧列表
      getParamslistData: [],
      qurelist: {
        patientId: '',
      },
      querytParams: {
        id: '',
        patientId: this.$route.query.patientId,
      },
      rules: {
        routeCheckStatus: [
          { required: true, message: '请选择节点审核状态', trigger: 'change' }
        ],
      },
      totalNumber: 0,
      agreeNumber: 0,
      updata: {
        specialDiseaseRouteId: '',
        suitRange: '',
        routeName: '',
        specialDiseaseNodeList: [],
      },
      form: {},
      itemindex: 0,
      listindex: null,
      input: '',
      moban: [],
    };
  },
  created() {
    console.log(this.$route.query, 'this.$route.query')
    this.qurelist.patientId = this.$route.query.patientId
    this.getAllNodeBy()
  },
  beforeDestroy() { },
  watch: {},
  mounted() {
  },
  methods: {
    // 左侧
    getAllNodeBy() {
      const loading = this.$loading({
        lock: true,
        text: '数据加载中',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });
      this.getAllNodeByPatientlist = []
      if (this.$route.query) {
        getAllNodeByPatient(this.qurelist).then(res => {
          // this.getAllNodeByPatientlist = res.data
          loading.close();
          this.getAllNodeByPatientlist = this.handleData(res.data, 'routeNodeDay', 'routeNodeName')
          // console.log(this.getAllNodeByPatientlist, 'this.getAllNodeByPatientlist')
        })
      } else {
        loading.close();
        this.getAllNodeByPatientlist.push({
          routeNodeName: "",
          routeNodeDay: "",
          list: [
            {
              routeCheckStatus: "AGREE",
              routeId: '',
              routeName: "",
              routeNodeDay: "",
              routeNodeId: "",
              routeNodeName: "",
              taskPartitionCode: "",
              taskPartitionDictId: "",
              taskPartitionDictName: "",
              taskTypeCode: "",
              taskTypeId: "",
              taskTypeName: "",
            },
          ],
        });
      }
    },
    handleData(list, key, keytwo) {
      //得到数据的主键列表
      let keysArr = list.map((item) => {
        return {
          routeNodeDay: item[key],
          routeNodeName: item[keytwo],
        };
      });
      let array = keysArr.filter(
        (item, index, arr) =>
          index ===
          arr.findIndex(
            (ite) =>
              ite.routeNodeDay == item.routeNodeDay &&
              ite.routeNodeName == item.routeNodeName
          )
      );
      let keys = [...new Set(array)];
      let newList = keys.map((item) => {
        return {
          //这里写新的 数据结构 如下是整体复制
          routeNodeDay: item[key],     //1tian
          routeNodeName: item[keytwo],
          list: list.filter(
            (i) => i[key] == item[key] && i[keytwo] == item[keytwo]
          ),
        };
      });
      return newList;
    },
    getParams() {
      getParams(this.querytParams).then(res => {
        res.data.forEach(e => {
          e.forEach(el => {
            el.patientId = this.$route.query.patientId
            el.patientName = this.$route.query.patientName
            el.sn = Number(el.sn)
          })
        })
        this.moban = JSON.parse(JSON.stringify(res.data))
        this.getParamslistData = res.data
        console.log(this.getParamslistData, '009090')

      })
    },
    // 药品列表
    informationInfoinfo() {
      // this.informationqueryParams.pageNum = 1;
      this.loading = true;
      listBaseDrug(this.informationqueryParams).then(response => {
        this.baseDrugList = response.rows;
        this.baseDrugtotal = response.total;
        this.loading = false;
      });
    },
    // 运动
    spotgetList() {
      this.loading = true;
      listBaseSport(this.SporParams).then((response) => {
        this.baseSportList = response.rows;
        this.Sporttotal = response.total;
        this.loading = false;
      });
    },
    /** 查询饮食知识库列表 */
    DiegetList() {
      this.loading = true;
      listBaseDiet(this.DieParams).then(response => {
        this.baseDietList = response.rows;
        this.Dietotal = response.total;
        this.loading = false;
      });
    },
    /** 查询护理知识库列表 */
    NursinggetList() {
      this.loading = true;
      listBaseNursing(this.NursingParams).then(response => {
        this.baseNursingList = response.rows;
        this.Nursingtotal = response.total;
        this.loading = false;
      });
    },
    // 药品重置
    addresetQuerylist() {
      if (this.taskPartitionCode == 'MEDICATION_GUIDE') {    // 用药
        this.informationqueryParams = {
          pageNum: 1,
          pageSize: 10,
        };
        this.informationInfoinfo();
      } else if (this.taskPartitionCode == 'SPORT_GUIDE') {//运动
        this.SporParams = {
          pageNum: 1,
          pageSize: 10,
        };
        this.spotgetList();
      } else if (this.taskPartitionCode == 'DIET_GUIDE') {//饮食
        this.DieParams = {
          pageNum: 1,
          pageSize: 10,
        },
          this.DiegetList()
      } else if (this.taskPartitionCode == 'NURSING_GUIDE') {//居家护理
        this.NursingParams = {
          pageNum: 1,
          pageSize: 10,
          nursingName: null,
        }
        this.NursinggetList()
      }
    },
    // 药品名称关闭
    innerVisiblecancel() {
      this.Drugshow = false
      this.Sportshow = false
      this.Dieshow = false
      this.Nursingshow = false
    },
    // 圆点按钮
    nurseclick(row) {
      this.getParamslistData[this.indexdata].ids = row.id
      this.getParamslistData[this.indexdata].forEach(el => {
        // console.log(row[el.paramKey], 'row[el.paramKey]----------')
        el.paramValue = row[el.paramKey]
      })
      this.Drugshow = false
      this.Sportshow = false
      this.Dieshow = false
      this.Nursingshow = false
    },
    //保存
    TemporaryStorage() {
      var emptyItems = []
      emptyItems = this.getParamslistData.flat().filter(f => f.paramValue == "")
      this.getParamslistData.forEach(e => {
        e.forEach(el => {
          el.routeId = this.itemdata.routeId
          el.routeName = this.itemdata.routeName
          el.routeNodeId = this.querytParams.id
          el.routeNodeName = this.itemdata.routeNodeName
          el.taskPartitionCode = this.itemdata.taskPartitionCode
          el.taskPartitionDictId = this.itemdata.taskPartitionDictId
          el.taskPartitionDictName = this.itemdata.taskPartitionDictName
          el.taskTypeCode = this.itemdata.taskTypeCode
          el.taskTypeId = this.itemdata.taskTypeId
          el.taskTypeName = this.itemdata.taskTypeName
        })
      })
      // return
      if (emptyItems && emptyItems.length > 0) {
        this.$modal.msgError("请填写完整,再进行提交");
      } else {
        this.$confirm('是否确认提交？', '提示', {
          confirmButtonText: '确认',
          cancelButtonText: '取消',
        }).then(() => {
          const loading = this.$loading({
            lock: true,
            text: '提交中',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.7)'
          });
          inserList(this.getParamslistData).then(res => {
            if (res.code == 200) {
              this.$modal.msgSuccess("提交成功!");
              this.indexdata = null
              loading.close();
            }
            else {
              loading.close();
            }
          }).catch(() => {
            loading.close();
          });
        })
      }
    },
    bottomclickevent(ulitem, uindex, ulindex) {
      console.log(ulitem, uindex, ulindex)
      this.getParamslistData = []
      this.itemdata = ulitem
      this.taskPartitionList = []
      this.querytParams.id = ulitem.routeNodeId
      this.getParams()
      this.listindex = uindex
      this.itemindex = ulindex;
      this.taskPartitionCode = ulitem.taskPartitionCode
    },
    // 知识库获取
    knowledge(index, item) {
      // 用药
      if (this.taskPartitionCode == 'MEDICATION_GUIDE') {
        this.Drugshow = true
        this.informationInfoinfo()
      } else if (this.taskPartitionCode == 'SPORT_GUIDE') {//运动
        this.Sportshow = true
        this.spotgetList()
      } else if (this.taskPartitionCode == 'DIET_GUIDE') {//饮食
        this.Dieshow = true
        this.DiegetList()

      } else if (this.taskPartitionCode == 'NURSING_GUIDE') {//居家护理
        this.Nursingshow = true
        this.NursinggetList()
      }
      this.indexdata = index
    },
    additem(index) {
      this.moban[0].forEach(e => {
        e.paramValue = ""
        e.id = ""
      })
      const newVal = JSON.parse(JSON.stringify(this.moban[0]))
      // const newVal = JSON.parse(JSON.stringify(this.getParamslistData[0]))
      newVal.forEach(i => {
        // i.sn = this.getParamslistData.length +1
        i.sn = this.getParamslistData[this.getParamslistData.length - 1][0].sn + 1
      })
      this.getParamslistData.push(newVal)
    },
    delitem(index, item) {
      this.getParamslistData.splice(index, 1)

    },
  }
};
</script>
<style scoped lang="scss">
::v-deep .el-card__body {
  position: relative;
}
::v-deep .el-select .el-input.is-disabled .el-input__inner {
  background: #fff !important;
}
::v-deep .el-input.is-disabled .el-input__inner {
  background: #fff !important;
}
.routeCheckStatus {
  position: absolute;
  right: 10px;
  top: 30px;
}

.dialog-footer {
  padding: 0 20px 0;
  text-align: right;
}
.texts {
  overflow-y: scroll;
  overflow-x: hidden;
  width: 72%;
  height: calc(100vh - 30px);
  background-color: #fff;
  .topform {
    width: 100%;
    position: relative;
    padding: 15px 70px 30px 15px;
    .box-card {
      // width:calc(100% - 149px);
      width: 85%;
      margin-left: 20px;
      padding-top: 25px;
      .textarea {
        display: flex;
        // width: 500px;
        // width: 100%;
      }
    }
    .icon {
      width: 150px;
      right: -20px;
      top: 40px;
      position: relative;
    }
    .form {
      width: 100%;
      ::v-deep .el-form-item {
        display: flex;
      }
      ::v-deep .el-form-item__content {
        flex: 1;
      }
      ::v-deep .el-input__inner {
        height: 30px !important;
        line-height: 30px !important;
      }

      ::v-deep .el-form-item__label {
        font-size: 12px !important;
      }
    }
  }
}

.list {
  margin: 20px auto;
  width: 100%;
  height: 100vh;
  background-color: #f2f4f5;
  display: flex;
  padding-top: 15px;
  justify-content: space-evenly;
  ::v-deep .el-card {
    margin-top: 20px !important;
  }
  .timelist {
    width: 25%;
    background-color: #fff;
    padding: 0 20px 20px;
    // height: 680px;
    // height: calc(100vh - 294px);
    overflow: scroll;
    .timetitle {
      height: 60px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    ::v-deep .el-timeline {
      width: 100%;
      padding: 15px 0 0 !important;
    }
  }
}
.cards {
  border: 1px solid #409eff;
  border-left: 5px solid #409eff;
}

.top {
  display: flex;
  justify-content: space-between;
  align-items: center;

  .toptop {
    display: flex;
    align-items: center;
  }

  span {
    padding: 0 4px;
  }

  i {
    font-size: 17px;
  }

  i:nth-child(2) {
    padding-left: 12px;
  }
}

::v-deep .el-timeline-item__timestamp {
  margin: 0 !important;
  padding: 0 !important;
}

::v-deep .el-timeline-item__wrapper {
  padding-left: 14px !important;
}

::v-deep .el-timeline-item__content {
  transform: translateY(-2%);
}
</style>