222

src/views/project/debit/project/components/pay/formula.vue

@@ -0,0 +1,102 @@
+<template>
+    <hc-new-dialog v-model="isShow" is-table widths="1200px" title="添加公式" @save="modalSave">
+        <div class="hc-search-form">
+            <el-select v-model="searchForm.key1" filterable class="w-40" placeholder="公式分类" @change="searchKeyClick">
+                <el-option label="xxx" value="1" />
+            </el-select>
+        </div>
+        <div class="hc-search-table">
+            <el-radio-group v-model="tableRadio" class="hc-search-table-radio-group">
+                <hc-table :column="tableColumn" :datas="tableData" :loading="tableLoading" is-new :index-style="{ width: 60 }">
+                    <template #action="{ row }">
+                        <el-radio :label="row.key1" size="large" />
+                    </template>
+                </hc-table>
+            </el-radio-group>
+        </div>
+    </hc-new-dialog>
+</template>
+
+<script setup>
+import { ref, watch } from 'vue'
+
+const props = defineProps({
+    ids: {
+        type: [String, Number],
+        default: '',
+    },
+})
+
+//事件
+const emit = defineEmits(['finish', 'close'])
+
+//双向绑定
+// eslint-disable-next-line no-undef
+const isShow = defineModel('modelValue', {
+    default: false,
+})
+
+//监听
+watch(() => [
+    props.ids,
+], ([ids]) => {
+    console.log('ids', ids)
+}, { immediate: true })
+
+//监听
+watch(isShow, (val) => {
+    if (val) {
+        console.log('处理数据')
+    }
+})
+
+//搜索表单
+const searchForm = ref({})
+const searchKeyClick = () => {
+
+}
+
+//表格数据
+const tableLoading = ref(false)
+const tableColumn = [
+    { key: 'key1', name: '公式编号' },
+    { key: 'key2', name: '公式名称' },
+    { key: 'key3', name: '备注' },
+    { key: 'action', name: '选择', width: 50, align: 'center' },
+]
+const tableData = ref([
+    { key1: '1111' },
+    { key1: '222' },
+])
+
+const tableRadio = ref('')
+
+const modalSave = () => {
+    emit('finish')
+}
+</script>
+
+<style scoped lang="scss">
+.hc-search-form {
+    position: relative;
+    margin-bottom: 10px;
+}
+.hc-search-table {
+    position: relative;
+    height: calc(100% - 42px);
+}
+.hc-search-table-radio-group {
+    display: block;
+    height: 100%;
+}
+</style>
+
+<style lang="scss">
+.hc-search-table .hc-search-table-radio-group .el-table[hc].new .cell .el-radio {
+    margin-right: 0;
+    height: 20px;
+    .el-radio__label {
+        display: none;
+    }
+}
+</style>

src/views/project/debit/project/components/pay/row-data.vue

@@ -15,7 +15,7 @@
                 </el-form-item>
                 <el-form-item class="nowrap" label="合同计算公式：">
                     <el-input v-model="formModel.key4" class="flex-1" disabled />
-                    <el-link type="primary" class="ml-2 line-height-normal">添加公式</el-link>
+                    <el-link type="primary" class="ml-2 line-height-normal" @click="formulaClick">添加公式</el-link>
                     <el-link type="danger" class="ml-2 line-height-normal">删除公式</el-link>
                 </el-form-item>
                 <el-form-item class="nowrap" label="变更计算公式：">
@@ -62,10 +62,12 @@
             </el-form>
         </el-scrollbar>
     </hc-new-dialog>
+    <HcFormula v-model="isFormulaShow" />
 </template>
 
 <script setup>
 import { ref, watch } from 'vue'
+import HcFormula from './formula.vue'
 
 const props = defineProps({
     ids: {
@@ -105,4 +107,10 @@ const formRules = ref({})
 const modalSave = () => {
     emit('finish')
 }
+
+//公式
+const isFormulaShow = ref(false)
+const formulaClick = () => {
+    isFormulaShow.value = true
+}
 </script>