合同材料

src/views/debit-pay/material/components/material/dataModal.vue

@@ -55,7 +55,7 @@
                                 <el-input v-model="formModel.key6" disabled>
                                     <template #suffix>元</template>
                                     <template #append>
-                                        <el-button type="primary" color="#C99AD7">
+                                        <el-button type="primary" @click="realTimePriceClick">
                                             <hc-icon name="add" />
                                             <span>选择实时价格</span>
                                         </el-button>
@@ -112,12 +112,17 @@
                 </hc-table>
             </div>
             <div v-if="tab_key === '上传附件'" class="table-body">
-                <hc-table :column="tableColumn2" :datas="tableData2" :index-style="{ width: 60 }" :loading="tableLoading2">
-                    <template #action="{ row }">
-                        <el-link type="primary">预览</el-link>
-                        <el-link type="danger">删除</el-link>
-                    </template>
-                </hc-table>
+                <div class="table-upload-attachment">
+                    <el-button @click="uploadAttachmentClick">点击上传附件</el-button>
+                </div>
+                <div class="table-upload">
+                    <hc-table :column="tableColumn2" :datas="tableData2" :index-style="{ width: 60 }" :loading="tableLoading2">
+                        <template #action="{ row }">
+                            <el-link type="primary">预览</el-link>
+                            <el-link type="danger">删除</el-link>
+                        </template>
+                    </hc-table>
+                </div>
             </div>
         </div>
         <template #footer>
@@ -126,6 +131,33 @@
             <el-button v-if="!dataId" :loading="saveLoaing" hc-btn type="primary" @click="modalSaveClose">提交并关闭</el-button>
         </template>
     </hc-new-dialog>
+    <!-- 材料实时发布价格 -->
+    <hc-new-dialog v-model="isRealTimePrice" ui="hc-realTime-price" title="材料实时发布价格" is-table :footer="false" widths="70rem" @close="realTimePriceClose">
+        <hc-table :column="tableColumn3" :datas="tableData3" :index-style="{ width: 60 }" :loading="tableLoading3">
+            <template #action="{ row }">
+                <el-link type="primary">选择</el-link>
+                <el-link type="danger">取消选择</el-link>
+            </template>
+        </hc-table>
+    </hc-new-dialog>
+    <!-- 上传附件 -->
+    <hc-new-dialog v-model="isAttachment" title="上传文件" is-footer-center widths="30rem" @close="attachmentClose">
+        <el-form ref="formUploadRef" :model="formUploadModel" :rules="formUploadRules" label-position="top" label-width="auto">
+            <el-form-item label="选择附件类型" prop="key1">
+                <el-select v-model="formUploadModel.key1" placeholder="选择附件类型" filterable block>
+                    <el-option label="第一期" value="1" />
+                    <el-option label="第二期" value="2" />
+                </el-select>
+            </el-form-item>
+            <el-form-item label="选择文件" prop="key2">
+                <hc-form-upload v-model="formModel.key2" :options="{ num: 0, type: 'list', drop: true }" />
+            </el-form-item>
+        </el-form>
+        <template #footer>
+            <el-button hc-btn @click="attachmentClose">取消</el-button>
+            <el-button hc-btn type="primary" @click="attachmentSave">确认</el-button>
+        </template>
+    </hc-new-dialog>
 </template>
 
 <script setup>
@@ -173,15 +205,37 @@ const tab_key = ref('材料明细')
 //表单数据
 const formRef = ref(null)
 const formModel = ref({})
-const formRules = {
-
-}
+const formRules = {}
 
 //处理数据
 const detailsModalShow = () => {
     console.log(dataId.value)
 }
 
+//材料实时发布价格表格
+const tableColumn3 = [
+    { key: 'key1', name: '有效时间' },
+    { key: 'key2', name: '材料编号', width: 100, align: 'center' },
+    { key: 'key3', name: '材料名称' },
+    { key: 'key4', name: '材料单位', width: 100, align: 'center' },
+    { key: 'key5', name: '单价（元）', width: 100, align: 'center' },
+    { key: 'action', name: '操作', width: 100, align: 'center' },
+]
+const tableData3 = ref([
+    {},
+])
+const tableLoading3 = ref(false)
+
+//材料实时发布价格
+const isRealTimePrice = ref(false)
+const realTimePriceClick = () => {
+    isRealTimePrice.value = true
+}
+
+//关闭材料实时发布价格
+const realTimePriceClose = () => {
+    isRealTimePrice.value = false
+}
 
 //材料明细表格
 const tableColumn1 = [
@@ -213,6 +267,26 @@ const tableData2 = ref([
 ])
 const tableLoading2 = ref(false)
 
+//上传表单
+const formUploadRef = ref(null)
+const formUploadModel = ref({})
+const formUploadRules = {}
+
+//点击上传附件
+const isAttachment = ref(false)
+const uploadAttachmentClick = () => {
+    isAttachment.value = true
+}
+
+//提交确定
+const attachmentSave = () => {
+    attachmentClose()
+}
+
+//关闭上传附件
+const attachmentClose = () => {
+    isAttachment.value = false
+}
 
 //保存数据
 const saveLoaing = ref(false)
@@ -299,6 +373,21 @@ const modalClose = () => {
     .table-body {
         position: relative;
         height: calc(100% - 25px);
+        .table-upload-attachment {
+            position: relative;
+            margin-bottom: 10px;
+            .el-button {
+                width: 100%;
+            }
+        }
+        .table-upload {
+            position: relative;
+            height: calc(100% - 42px);
+        }
     }
 }
+.el-overlay-dialog .el-dialog.hc-new-dialog.hc-modal-table.hc-realTime-price {
+    --el-dialog-margin-top: 100px;
+    height: calc(100% - 200px);
+}
 </style>