saber/src/views/manager/projectinfo/treeTemplate/template/promptSettings.vue

<template>
  <div>
    <div class="editDefault">
      <el-row :span="24">
        <el-col :span="3.3" style="line-height: 40px">
          元素坐标：
        </el-col>
        <el-col :span="18">
          <avue-input v-model="htmlData1.name" placeholder="请点击坐标" :disabled='true'></avue-input>
        </el-col>
      </el-row>

      <el-row :span="24">
        <el-col :span="3.3" style="line-height: 40px">
          提示信息：
        </el-col>
        <el-col :span="18">
          <el-input
            class="martop15"
            style="width:100%;"
            type="textarea"
            :rows="5"
            placeholder="请输入内容"
            v-model="textarea"
          ></el-input>
        </el-col>
      </el-row>
      <el-row style="text-align: center">
        <el-button type="primary"
                   size="small"
                   icon="el-icon-circle-plus-outline"
                   @click="saveTiool()">保存
        </el-button> &nbsp;&nbsp;
        <el-button type="primary"
                   size="small"
                   icon="el-icon-circle-plus-outline"
                   @click="cleanDefult()">清空
        </el-button>
      </el-row>
    </div>
    <div style="border: 1px dotted rgb(187, 187, 187);box-sizing: border-box;padding: 0px 15px;"
         class="martop20 marbottom10">
      <table @click
             class="table martop20 copyTable"
             width='100%'
             border='1px '
             bordercolor="#E5E5E5"
             cellpadding='2px'
      >
        <thead
          cellpadding='2px'
          height='40px'
        >
        <tr>
          <th width='30%'>元素位置</th>
          <th width='30%'>提示语</th>
          <th width='20%'>操作</th>
        </tr>
        </thead>
        <tbody height='36px'>
        <tr v-for="(item,key) in setsignaTable" :key="key" v-on:click="">
          <td>{{ item.colName }}</td>
          <td>{{ item.sigRoleName }}</td>
          <td align="center"><span style="color:red;cursor: pointer;" v-on:click="deleteTableSig(item.id)">删除</span></td>
        </tr>
        </tbody>
      </table>
    </div>
  </div>
</template>

<script>
import {getSigList, saveDdefual,remove} from "../../../../../api/manager/AdjustForm";

export default {
  props: ['pkeyId1', 'htmlData1'],
  data() {
    return {
      textarea: '',
      setsignaTable: [],
    }
  },
  methods: {
    cleanDefult () {//清空数据
      this.textarea='';
    },
    async saveTiool() {

      if(this.htmlData1.tr === '' || this.htmlData1.td === ''){
        this.$message({
          type: "warning",
          message: "请先选择元素"
        });
        return;
      }
      else if(this.htmlData1.name === '警告' ){
        this.$message({
            type: "warning",
            message: "警告框不能配置提示信息"
          });
          return;
      }

      if(this.textarea === '' || this.textarea=== ''){
        this.$message({
          type: "warning",
          message: "请输入提示语"
        });
        return;
      }


      // let isCan=true
      // this.setsignaTable.forEach(element => {
      //     if (isCan) {
      //         // 如果满足条件，执行相应的操作，并将条件修改为 false
      //         if (element.colKey===this.htmlData1.keyname) {  // 这里 someConditionMet 是你的条件判断函数
      //             isCan = false;
      //         }
      //     }
      // });
      // if(isCan){

        const {data: res} = await saveDdefual({
          trIndex: this.htmlData1.tr,
          tdIndex: this.htmlData1.td,
          tableId: this.pkeyId1,
          textId: this.textarea,
          type: '5',
        })
        if (res.code === 200) {
          this.getSingInfo()
          this.$message({
            type: "success",
            message: "操作成功"
          });
          this.$parent.getExcelHtml(this.pkeyId1);
        }
      // }
      // else{
      //   this.$message.warning('一个字段只能配置一个提示信息')
      // }
 
    },
    async deleteTableSig(ids) {//删除数据
    //  this.setsignaTable.splice(key, 1);
      const {data: res} = await remove(ids);
      this.getSingInfo();
      if (res.code === 200) {
        this.$message({
          type: "success",
          message: "操作成功"
        });
      }

    },
    async getSingInfo() {
      const {data: res} = await getSigList(
        {
          current: 0,
          size: 100,
          tabId: this.pkeyId1,
          type: 5
        }
      )
      if (res.code === 200) {
        this.setsignaTable = res.data.records;
      }
    }
  },
  created() {
    this.getSingInfo();
    this.setsignaTable = [];
  }
}
</script>
<style lang="scss" scoped>

.copyTable td{
  user-select:initial !important;
}

</style>