|
|
@@ -1,16 +1,259 @@
|
|
|
<template>
|
|
|
<hc-drawer v-model="isShow" to-id="node-card-target" is-close>
|
|
|
<div class="relative bg-white" style="height: 100%">
|
|
|
- 测试抽屉弹窗
|
|
|
- <el-button @click="isDrawer = false">关闭抽屉</el-button>
|
|
|
+ <hc-card title="基础信息" scrollbar>
|
|
|
+ <template #header>
|
|
|
+ <div class="text-bold">基础信息</div>
|
|
|
+ </template>
|
|
|
+ <template #extra>
|
|
|
+ <el-button hc-btn type="success" @click="handleSave">保存</el-button>
|
|
|
+ <el-button hc-btn type="warning" @click="handleRefresh">重新获取数据</el-button>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <div class="header_title">
|
|
|
+ <div class="text-bold">项目信息</div>
|
|
|
+ <el-link type="primary">关联委托单</el-link>
|
|
|
+ </div>
|
|
|
+ <div class="form-box">
|
|
|
+ <el-form :model="formModal" label-width="auto">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="项目名称">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="工程名称">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="施工单位">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="监理单位">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="实验室名称">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="合同段/工区">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="工程部位/用途">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="委托单编号">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="记录编号">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="报告编号">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="判断依据">
|
|
|
+ <el-select
|
|
|
+ v-model="value"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 100%"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in checkOptions"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="header_title">
|
|
|
+ <div class="text-bold">样品信息</div>
|
|
|
+ <el-link type="primary">关联样品</el-link>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="form-box">
|
|
|
+ <el-form :model="formModal" label-width="auto">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="样品名称">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="样品编号">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="样品描述">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="来样/取样时间">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="样品数量">
|
|
|
+ <el-input v-model="formModal.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="样品品种">
|
|
|
+ <el-select
|
|
|
+ v-model="value"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 100%"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in checkOptions"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="代号">
|
|
|
+ <el-select
|
|
|
+ v-model="value"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 100%"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in checkOptions"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="强度等级">
|
|
|
+ <el-select
|
|
|
+ v-model="value"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 100%"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in checkOptions"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div class="header_title">
|
|
|
+ <div class="text-bold">设备信息</div>
|
|
|
+ <div>
|
|
|
+ <el-link type="primary">关联设备</el-link>
|
|
|
+ <el-link type="primary" class="ml-2">关联上次设备</el-link>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <hc-table :column="tableColumn" :datas="tableData">
|
|
|
+ <template #action="{ row, index }">
|
|
|
+ <el-link size="small" type="warning">删除</el-link>
|
|
|
+ </template>
|
|
|
+ </hc-table>
|
|
|
+ </div>
|
|
|
+ </hc-card>
|
|
|
</div>
|
|
|
</hc-drawer>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
import { ref } from 'vue'
|
|
|
-
|
|
|
+const handleSave = () => {}
|
|
|
+const handleRefresh = () => {}
|
|
|
const isShow = defineModel('modelValue', {
|
|
|
default: false,
|
|
|
})
|
|
|
-</script>
|
|
|
+const formModal = ref({})
|
|
|
+const checkOptions = ref([])
|
|
|
+const tableColumn = [
|
|
|
+ { key: 'name', name: '设备名称' },
|
|
|
+ { key: 'text', name: '设备型号' },
|
|
|
+ { key: 'color', name: '设备编号' },
|
|
|
+ { key: 'color', name: '测量范围' },
|
|
|
+ { key: 'color', name: '精准度' },
|
|
|
+ { key: 'color', name: '使用日期' },
|
|
|
+ { key: 'color', name: '使用开始时间(h:min)' },
|
|
|
+ { key: 'color', name: '使用结束时间(h:min)' },
|
|
|
+ { key: 'color', name: '使用时间(min)' },
|
|
|
+ { key: 'color', name: '运转前检查情况' },
|
|
|
+ { key: 'color', name: '运转后检查情况' },
|
|
|
+ { key: 'color', name: '操作人' },
|
|
|
+ { key: 'color', name: '备注' },
|
|
|
+ { key: 'action', name: '操作' },
|
|
|
+]
|
|
|
+const tableData = ref([
|
|
|
+ { name: '名称1', text: '文本1', color: 'red' },
|
|
|
+ { name: '名称2', text: '文本2', color: 'blue' },
|
|
|
+ { name: '名称3', text: '文本3', color: '无' },
|
|
|
+
|
|
|
+])
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+ .text-bold{
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+.header_title{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ background-color: rgb(240, 240, 240);
|
|
|
+ padding: 10px;
|
|
|
+ .el-link {
|
|
|
+ text-decoration: underline;
|
|
|
+ }
|
|
|
+
|
|
|
+}
|
|
|
+.form-box{
|
|
|
+ margin-top: 10px;
|
|
|
+ padding-left:30px ;
|
|
|
+ padding-right:30px ;
|
|
|
+}
|
|
|
+</style>
|
