使用原生html<table>构造复杂table表

news2024/10/6 2:07:18

      <table border data-sort="sortDisabled" align="center" class="table">
        <tbody>
          <tr class="textarea1">
            <td rowspan="1" colspan="2" class="background-gray">
              <label>日期</label>
            </td>
            <td rowspan="1" colspan="4" class="inputcolor">
              <el-form-item prop="saveTime" class="saveTime">
                <el-date-picker v-model="form.saveTime" type="datetime" placeholder="选择日期时间" format="yyyy-MM-dd HH:mm" :clearable="false">
                </el-date-picker>
              </el-form-item>
            </td>
            <td rowspan="1" colspan="1" class="background-gray">
              <label style="color: red"> * </label><label>带班主任</label>
            </td>
            <td rowspan="1" colspan="3" class="inputcolor">
              <el-form-item prop="managerDaiban" class="textarmanagerDaibaneaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.}}</div>
                <el-input type="textarea" maxlength="10" v-model="form.managerDaiban" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
            <td rowspan="1" colspan="1" class="background-gray">
              <label style="color: red"> * </label><label>检查人</label>
            </td>
            <td rowspan="1" colspan="3" class="inputcolor">
              <el-form-item prop="checkMan" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.checkMan}}</div>
                <el-input type="textarea" maxlength="7" v-model="form.checkMan" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>
          <tr class="textarea2">
            <td rowspan="2" colspan="2" class="background-gray">
              <label style="color: red"> * </label><label>班组成员</label>
            </td>
            <td rowspan="2" colspan="12" class="inputcolor">
              <el-form-item prop="members" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.members}}</div>
                <el-input type="textarea" maxlength="100" v-model="form.members" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>
          <tr></tr>

          <tr>
            <td rowspan="5" colspan="2" class="background-gray">
              <label>运行提醒</label>
            </td>
            <td rowspan="2" colspan="12" class="background-gray">
              <label>早班重要信息:机场关闭、设备故障、跑道状态、危险天气、炮射信息、通航计划、重要保障计划等</label><br />
              <label>(前一日晚班人员填写,当日早班人员确认后打√)</label>
            </td>
          </tr>

          <tr></tr>
          <tr>
            <td rowspan="3" colspan="11" class="textarea2">
              <el-form-item prop="hint" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.hint}}</div>
                <el-input type="textarea" maxlength="100" v-model="form.hint" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
            <td rowspan="3" colspan="1" class="textarea1">
              <el-form-item prop="hintOK" class="textareaSub">
                <el-checkbox v-model="form.hintOK" style="margin: auto"></el-checkbox>
              </el-form-item>
            </td>
          </tr>
          <tr></tr>
          <tr></tr>

          <tr>
            <td rowspan="20" colspan="1" class="background-gray">
              <label>设备检查</label>
            </td>
            <td rowspan="1" colspan="1" class="background-gray">
              <label>设备名称</label>
            </td>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>检查方法及步骤</label>
            </td>
            <td rowspan="1" colspan="4" class="background-gray">
              <label>检查结果(正常打√不正常文字描述)</label>
            </td>
          </tr>
          <tr>
            <td rowspan="4" colspan="1" class="background-gray">
              <label>主用雷达自动化</label>
            </td>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>A.各席位检查雷达信号、显示、操作是否正常</label>
            </td>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="mainRadarOK" class="textareaSub">
                正常<el-checkbox v-model="form.mainRadarOK" style="margin: auto"></el-checkbox>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>B.各席位查看昌北、生米单模式是否正常</label>
            </td>
            <td rowspan="3" colspan="4" class="textarea2">
              <el-form-item prop="mainRadar" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.mainRadar}}</div>
                <el-input type="textarea" maxlength="54" v-model="form.mainRadar" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>C.将信号模式设置为SYSTEM,并对视频显示调整至正常工作设置</label>
            </td>
          </tr>

          <tr>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>D.设置气压基准面为QNH HEIGHT;检查QNH值与双振筒气压仪数据是否一致</label>
            </td>
          </tr>

          <tr>
            <td rowspan="2" colspan="1" class="background-gray">
              <label>备用雷达</label>
            </td>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>A.检查备用雷达自动化雷达信号、显示、操作是否正常</label>
            </td>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="bakRadarOK" class="textareaSub">
                正常<el-checkbox v-model="form.bakRadarOK" style="margin: auto"></el-checkbox>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>B.将备用雷达自动化视频显示调整至正常工作设置</label>
            </td>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="bakRadar" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.bakRadar}}</div>
                <el-input type="textarea" maxlength="36" v-model="form.bakRadar" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="3" colspan="1" class="background-gray">
              <label>甚高频</label>
            </td>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>A.检查甚高频的频率设置(各席位的朱永频率处于接收喝发射状态,带班、协调、监控席备用和应急频率处于接收状态并至于扬声器外放且音量设置至少60%)</label>
            </td>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="shengaopinOK" class="textareaSub">
                正常<el-checkbox v-model="form.shengaopinOK" style="margin: auto"></el-checkbox>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>B.分别选取RS及OTE,对各频点进行通话测试</label>
            </td>
            <td rowspan="2" colspan="4" class="textarea2">
              <el-form-item prop="shengaopin" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.shengaopin}}</div>
                <el-input type="textarea" maxlength="54" v-model="form.shengaopin" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>C.将各频点发射位调至OTE或RS</label>
            </td>
          </tr>

          <tr>
            <td rowspan="2" colspan="1" class="background-gray">
              <label>遥控盒</label>
            </td>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>A.检查遥控盒频点设置是否正确;</label>
            </td>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="remoteBoxOK" class="textareaSub">
                正常<el-checkbox v-model="form.remoteBoxOK" style="margin: auto"></el-checkbox>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="1" colspan="8" class="background-gray">
              <label>B.进行通话测试,检测频率</label>
            </td>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="remoteBox" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.remoteBox}}</div>
                <el-input type="textarea" maxlength="36" v-model="form.remoteBox" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="2" colspan="1" class="background-gray">
              <label>塔台电子进</label>
            </td>
            <td rowspan="2" colspan="8" class="background-gray">
              <label>检查显示是否正常</label>
            </td>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="twrAppOK" class="textareaSub">
                正常<el-checkbox v-model="form.twrAppOK" style="margin: auto"></el-checkbox>
              </el-form-item>
            </td>
          </tr>
          
          <tr>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="twrApp" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.twrApp}}</div>
                <el-input type="textarea" maxlength="54" v-model="form.twrApp" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="2" colspan="1" class="background-gray">
              <label>管制电话</label>
            </td>
            <td rowspan="2" colspan="8" class="background-gray">
              <label>A.检查各席位内话系统(触屏)是否正常</label><br />
              <label>B.检查各席位程控电话是否正常</label>
            </td>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="telOK" class="textareaSub">
                正常<el-checkbox v-model="form.telOK" style="margin: auto"></el-checkbox>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="tel" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.tel}}</div>
                <el-input type="textarea" maxlength="36" v-model="form.tel" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="2" colspan="1" class="background-gray">
              <label>进程单打印</label>
            </td>
            <td rowspan="2" colspan="8" class="background-gray">
              <label>进行进程单打印测试,判断进程单打印机是否正常</label>
            </td>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="formOK" class="textareaSub">
                正常<el-checkbox v-model="form.formOK" style="margin: auto"></el-checkbox>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="form" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.form}}</div>
                <el-input type="textarea" maxlength="36" v-model="form.form" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="2" colspan="1" class="background-gray">
              <label>其他设备</label>
            </td>
            <td rowspan="2" colspan="8" class="background-gray">
              <label>ATIS系统、气象显示设备、ATS系统、计划集中处理系统等</label>
            </td>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="otherOK" class="textareaSub">
                正常<el-checkbox v-model="form.otherOK" style="margin: auto"></el-checkbox>
              </el-form-item>
            </td>
          </tr>

          <tr>
            <td rowspan="1" colspan="4" class="textarea1">
              <el-form-item prop="other" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.other}}</div>
                <el-input type="textarea" maxlength="36" v-model="form.other" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>

          <tr class="textarea4">
            <td rowspan="4" colspan="3" class="background-gray">
              <label>运行信息</label>
            </td>
            <td rowspan="1" colspan="7" class="background-gray">
              <label>查看飞行计划系统,了解飞行计划及动态情况</label>
            </td>
            <td rowspan="1" colspan="4" class="inputcolor">
              <el-form-item prop="operation1" class="textareaSub">
                确认<el-checkbox v-model="form.operation1"></el-checkbox>
              </el-form-item>
            </td>
          </tr>

          <tr class="textarea4">
            <td rowspan="1" colspan="7" class="background-gray">
              <label>查看值班日志,掌握流控及相关限制要求等</label>
            </td>
            <td rowspan="1" colspan="4" class="inputcolor">
              <el-form-item prop="operation2" class="textareaSub">
                确认<el-checkbox v-model="form.operation2"></el-checkbox>
              </el-form-item>
            </td>
          </tr>

          <tr class="textarea4">
            <td rowspan="1" colspan="7" class="background-gray">
              <label>查看航行通告记录,掌握有关的航行通告</label>
            </td>
            <td rowspan="1" colspan="4" class="inputcolor">
              <el-form-item prop="operation3" class="textareaSub">
                确认<el-checkbox v-model="form.operation3"></el-checkbox>
              </el-form-item>
            </td>
          </tr>
          <tr class="textarea4">
            <td rowspan="1" colspan="7" class="background-gray">
              <label>查看气象自动观测系统,了解天气情况,有必要时向气象预报室询问天气变化趋势</label>
            </td>
            <td rowspan="1" colspan="4" class="inputcolor">
              <el-form-item prop="operation4" class="textareaSub">
                确认<el-checkbox v-model="form.operation4"></el-checkbox>
              </el-form-item>
            </td>
          </tr>
          <tr class="textarea1">
            <td rowspan="1" colspan="3" class="background-gray">
              <label>科室</label>
            </td>
            <td rowspan="1" colspan="7" class="background-gray">
              <label>前一日保障架次通报飞行服务报告室</label>
            </td>
            <td rowspan="1" colspan="4" class="inputcolor">
              <el-form-item prop="department" class="textareaSub">
                确认<el-checkbox v-model="form.department"></el-checkbox>
              </el-form-item>
            </td>
          </tr>

          <tr class="textarea1">
            <td rowspan="2" colspan="3" class="background-gray">
              <label>协同</label>
            </td>
            <td rowspan="2" colspan="2" class="background-gray">
              <label>与南昌塔台管制室核实使用跑道及进近方式</label>
            </td>
            <td rowspan="2" colspan="2" class="inputcolor">
              <el-form-item prop="cooperationILS" style="display: inline-block">
                <el-radio v-model="form.cooperationILS" label="1">ILS</el-radio>
                <el-radio v-model="form.cooperationILS" label="2">VOR</el-radio>
              </el-form-item>
            </td>
            <td rowspan="2" colspan="2" class="background-gray">
              <label>其他</label>
            </td>
            <td rowspan="2" colspan="2" class="inputcolor">

              <el-form-item prop="cooperationOther" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.cooperationOther}}</div>
                <el-input type="textarea" maxlength="9" v-model="form.cooperationOther" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
            <td rowspan="2" colspan="4">
              <el-form-item prop="cooperation03">
                <el-radio v-model="form.cooperation03" label="1">03</el-radio>
                <el-radio v-model="form.cooperation03" label="2">21</el-radio>
              </el-form-item>
            </td>
          </tr>
          
          <tr></tr>
          <tr class="textarea2">
            <td rowspan="2" colspan="2" class="background-gray">
              <label>备注</label>
            </td>
            <td rowspan="2" colspan="12" class="inputcolor">
              <el-form-item prop="remark" class="textareaSub">
                <div v-if="isPdf" class="pdf-textarea-div">{{form.remark}}</div>
                <el-input type="textarea" maxlength="100" v-model="form.remark" v-if="!isPdf"></el-input>
              </el-form-item>
            </td>
          </tr>
        </tbody>
      </table>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1040201.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

更新andriod studio版本,项目编译报could not find org.junit.jupiter:junit-jupiter

原本使用Android Studio 版本是4.1.1&#xff0c;现更新为 点击build -》 build bundle -》build apk&#xff0c;项目报 Could not determine the dependencies of task :app:compileDebugUnitTestJavaWithJavac. > Could not resolve all task dependencies for configur…

前脚收费,后脚道歉?Unity收费新规引众怒,Epic承诺虚幻引擎永久免费

&#xfeff;当你还在纠结开发游戏用Unity引擎还是UE虚幻引擎的时候&#xff0c;Unity已经给游戏开发领域重重一拳。 &#xfeff;Unity作为一款全球范围内广泛使用的游戏引擎&#xff0c;因其价格亲民且灵活而备受众多开发者的青睐。然而在9月12日&#xff0c;Unity突然宣布计…

分析大疆官网根据ip自动跳转到指定域名

如果cookie存在region且有效&#xff0c;跳转到指定域名&#xff0c; 如果cookie存在region且无效&#xff0c;跳转到默认域名&#xff0c; 如果禁用cookie或者cookie中没有region&#xff0c;根据ip自动判断所在地区&#xff0c;跳转到指定域名 1、浏览器地址栏输入dji.com&am…

2018-2022年盟浪 ESG数据

2018-2022年盟浪 ESG数据 1、时间&#xff1a;2018-2022年 2、指标&#xff1a;证券代码、证券简称、盟浪ESG评级、省份、城市、所属证监会行业名称[交易日期] 最新收盘日[行业级别] 大类行业、所属证监会行业代码[交易日期] 最新收盘日[行业级别] 大类行业 3、范围&#xf…

图像练习-计算平行线距离opencv(03)

原图 //对输入图像进行细化 cv::Mat ThinLine(const cv::Mat& matsrc, const int& iterations) {//CvSize size cvGetSize(src);cv::Mat dst matsrc.clone();//拷贝一个数组给另一个数组int _iwidth dst.cols;int _iheight dst.rows;int n 0, i 0, j 0;for (n …

【每日一题】658. 找到 K 个最接近的元素

658. 找到 K 个最接近的元素 - 力扣&#xff08;LeetCode&#xff09; 给定一个 排序好 的数组 arr &#xff0c;两个整数 k 和 x &#xff0c;从数组中找到最靠近 x&#xff08;两数之差最小&#xff09;的 k 个数。返回的结果必须要是按升序排好的。 整数 a 比整数 b 更接近 …

抖音SEO矩阵系统源码开发搭建

1. 确定需求和功能&#xff1a;明确系统的主要目标和需要实现的功能&#xff0c;包括关键词研究、短视频制作、外链建设、数据分析、账号设置优化等方面。 2. 设计系统架构&#xff1a;根据需求和功能确定系统的架构&#xff0c;包括前端、后端、数据库等部分的设计&#xff0…

计算机组成原理之硬件的内部结构,拆开单独的硬件,查看硬件组成部分的结构和功能。

大家好&#xff0c;欢迎阅读《计算机组成原理》的系列文章&#xff0c;本系列文章主要教内容是从零学习计算机组成原理&#xff0c;内容通俗易懂&#xff0c;大家好好学习吧&#xff01;&#xff01;&#xff01; 更多的优质内容&#xff0c;请点击以下链接查看哦~~ ↓ ↓ ↓ …

【加载数据--自定义自己的Dataset类】

【加载数据自定义自己的Dataset类】 1 加载数据2 数据转换3 自定义Dataset类4 划分训练集和测试集5 提取一批次数据并绘制样例图 假设有四种天气图片数据全部存放与一个文件夹中&#xff0c;如下图所示&#xff1a; ├─dataset2 │ cloudy1.jpg │ cloudy10.jpg │ …

使用matlab产生二维动态曲线视频文件具体举例

使用matlab产生二维动态曲线视频文件举例 在进行有些函数变化过程时候&#xff0c;需要用到直观的动态显示&#xff0c;本博文将举例说明利用Matlab编程进行二维动态曲线的生成视频文件。 一、问题描述 利用matlab编程实现 y 1 s i n ( t ) , y 2 c o s ( t ) , y 3 s i …

JAVA_多线程的实现方式

线程的状态 方式一&#xff1a; public class Thread1 extends Thread {Overridepublic void run() {synchronized (this) {for (int i 0; i < 100; i) {System.out.println(getName() "" i);}}} } Thread1 thread1 new Thread1(); thread1.start(); 方式二…

用flex实现grid布局

1. css代码 .flexColumn(columns, gutterSize) {display: flex;flex-flow: row wrap;margin: calc(gutterSize / -2);> div {flex: 0 0 calc(100% / columns);padding: calc(gutterSize / 2);box-sizing: border-box;} }2.用法 .grid-show-item3 {width: 100%;display: fl…

天洑软件祝贺“星耀蓉城 篮能可贵”四城邀请赛暨西北工业大学校友篮球嘉年华活动圆满举办

9月16日&#xff0c;由西北工业大学成都校友会主办&#xff0c;成都市新都区文化体育和旅游局承办&#xff0c;天洑软件、泸州老窖、陕西省篮球协会、龙湖地产、奥伦达科技、南京全信、成都鑫长源、四川银行、优仿科技、华科机电、小鱼易连、四川省篮球协会、GAME7篮球俱乐部赞…

云安全之访问控制介绍

访问控制技术背景 信息系统自身的复杂性、网络的广泛可接入性等因素&#xff0c;系统面临日益增多的安全威胁&#xff0c;安全问题日益突出&#xff0c;其中一个重要的问题是如何有效地保护系统的资源不被窃取和破坏。 访问控制技术内容包括访问控制策略、访问控制模型、访问…

virtualbox无界面打开linux虚拟机的bat脚本,以及idea(代替Xshell)连接linux虚拟机的方法

virtualbox无界面打开linux虚拟机的bat脚本&#xff0c;以及idea连接linux虚拟机的方法 命令行运行代码成功运行的效果图 idea连接linux虚拟机的方法【重要】查看虚拟机的IP地址idea中选择菜单&#xff08;该功能可代替Xshell软件&#xff09;配置设置连接成功进入idea中的命令…

MySQL数据库入门到精通9--运维篇

1. 日志 1.1 错误日志 错误日志是 MySQL 中最重要的日志之一&#xff0c;它记录了当 mysqld 启动和停止时&#xff0c;以及服务器在运行过程中发生任何严重错误时的相关信息。当数据库出现任何故障导致无法正常使用时&#xff0c;建议首先查看此日志。 该日志是默认开启的&am…

解决安装 RabbitMQ 安装不成功的问题

由于RabbitMQ是基于erlang的&#xff0c;所以&#xff0c;在正式安装RabbitMQ之前&#xff0c;需要先安装一下erlang。 1、下载mq https://www.rabbitmq.com/download.html 2、下载erlang&#xff08;点击下载路径根据下载的MQ版本对应下载erl版本&#xff09; https://www.…

客户端负载均衡_什么是负载均衡

为什么需要负载均衡 俗话说在生产队薅羊毛不能逮着一只羊薅&#xff0c;在微服务领域也是这个道理。面对一个庞大的微服务集群&#xff0c;如果你每次发起服务调用都只盯着那一两台服务器&#xff0c;在大用户访问量的情况下&#xff0c;这几台被薅羊毛的服务器一定会不堪重负…

澳大利亚新版《2023年消费品(36个月以下儿童玩具) 安全标准》发布 旨在降低危险小零件的伤害

2023年9月4日&#xff0c;澳大利亚政府发布了新的儿童玩具强制性安全标准《2023年消费品(36个月以下儿童玩具)安全标准》&#xff08;Consumer Goods (Toys for Children up to and including 36 Months of Age) Safety Standard 2023&#xff09;。该强制性标准旨在尽可能地降…