添加参数设置静态页面

src/baseComponents/Form.vue

@@ -19,16 +19,16 @@
 
         <template v-else>
           <!-- autocomplete="off" -->
-          <template v-if="!props.formDisabled">
-            <el-input v-if="item.type=='input'" v-model="formData[item.key]"  :disabled="item.disabled" :placeholder="item.placeholder" :style="item.style"/>
-            <el-input v-else-if="item.type=='password'" type="password" v-model="formData[item.key]"  :disabled="item.disabled" :style="item.style"/>
-            <el-input v-else-if="item.type=='textarea'" :autosize="{ minRows: item.rows, maxRows: item.rows }" v-model="formData[item.key]" type="textarea" :rows="item.rows"  :disabled="item.disabled" :placeholder="item.placeholder" :style="item.style"/>
-            <el-input v-else-if="item.type=='number'" type="number"  v-model="formData[item.key]" :rows="item.rows"  :disabled="item.disabled" :placeholder="item.placeholder" :style="item.style"/>
+          <!-- <template > -->
+            <el-input v-if="item.type=='input'" v-model="formData[item.key]"  :disabled="item.disabled || props.formDisabled" :placeholder="item.placeholder" :style="item.style"/>
+            <el-input v-else-if="item.type=='password'" type="password" v-model="formData[item.key]"  :disabled="item.disabled || props.formDisabled" :style="item.style"/>
+            <el-input v-else-if="item.type=='textarea'" :autosize="{ minRows: item.rows, maxRows: item.rows }" v-model="formData[item.key]" type="textarea" :rows="item.rows"  :disabled="item.disabled || props.formDisabled" :placeholder="item.placeholder" :style="item.style"/>
+            <el-input v-else-if="item.type=='number'" type="number"  v-model="formData[item.key]" :rows="item.rows"  :disabled="item.disabled || props.formDisabled" :placeholder="item.placeholder" :style="item.style"/>
             
             <el-radio-group 
               v-else-if="item.type=='radio'"  
               v-model="formData[item.key]" 
-              :disabled="item.disabled" 
+              :disabled="item.disabled || props.formDisabled" 
               :placeholder="item.placeholder"
               @change="(val)=>handleSelectChange(item.key,val,item.type)"
             >
@@ -38,7 +38,7 @@
             <el-select 
               v-else-if="item.type=='select'"  
               @change="(val)=>handleSelectChange(item.key,val)"
-              v-model="formData[item.key]"  :style="item.style" :disabled="item.disabled" :placeholder="item.placeholder"
+              v-model="formData[item.key]"  :style="item.style" :disabled="item.disabled || props.formDisabled" :placeholder="item.placeholder"
             >
               <el-option
                 v-for="selectItem in item.selectList"
@@ -54,7 +54,7 @@
               v-model="formData[item.key]"
               multiple
               @change="(val)=>handleSelectChange(item.key,val)"
-              :disabled="item.disabled" :placeholder="item.placeholder"
+              :disabled="item.disabled || props.formDisabled" :placeholder="item.placeholder"
             >
               <el-option
                 v-for="selectItem in item.selectList"
@@ -71,7 +71,7 @@
               multiple
               filterable
               @change="(val)=>handleSelectChange(item.key,val)"
-              :disabled="item.disabled" :placeholder="item.placeholder"
+              :disabled="item.disabled || props.formDisabled" :placeholder="item.placeholder"
             >
               <el-option
                 v-for="selectItem in item.selectList"
@@ -89,7 +89,7 @@
                   :key="unionSubItem.key"
                   @change="(val)=>handleSelectChange(item.key,val,item.type,null,unionSubItem.key)"
                   :model-value="formData[item.key]?.[unionSubItem.key]"
-                  :style="unionSubItem.style" :disabled="unionSubItem.disabled" :placeholder="unionSubItem.placeholder"
+                  :style="unionSubItem.style" :disabled="unionSubItem.disabled || props.formDisabled" :placeholder="unionSubItem.placeholder"
                 >
                   <el-option
                     v-for="selectItem in unionSubItem.selectList"
@@ -104,7 +104,7 @@
             <template v-else-if="item.type=='checkbox'" >
               <el-checkbox
                 v-if="item?.checkAll"
-                :disabled="item.disabled"
+                :disabled="item.disabled || props.formDisabled"
                 :model-value="formData[item.key]?.length === item.selectList?.length"
                 :indeterminate="formData[item.key]?.length > 0 && formData[item.key]?.length < item.selectList?.length"
                 @change="(val)=>handleCheckAllOrNot(val,item.key,item.selectList)"
@@ -114,7 +114,7 @@
 
               <el-checkbox-group  
                 class="check_group_list"
-                :disabled="item.disabled"
+                :disabled="item.disabled || props.formDisabled"
                 v-model="formData[item.key] "
                 @change="(val)=>handleSelectChange(item.key,val,item.type,item.selectList)"
               >
@@ -148,7 +148,7 @@
               :start-placeholder="item.placeholder.startPlaceholder"
               :end-placeholder="item.placeholder.endPlaceholder"
               size="default"
-              :disabled="item.disabled"
+              :disabled="item.disabled || props.formDisabled"
               @change="(val)=>handleSelectChange(item.key,val,item.type)"
             />
             
@@ -164,7 +164,7 @@
               :range-separator="item.placeholder.rangeSeparator"
               size="default"
               @change="(val)=>handleSelectChange(item.key,val,item.type)"
-              :disabled="item.disabled"
+              :disabled="item.disabled || props.formDisabled"
             />
 
 
@@ -173,7 +173,7 @@
               v-model="formData[item.key]"
               type="datetime"
               :placeholder="item.placeholder"
-              :disabled="item.disabled"
+              :disabled="item.disabled || props.formDisabled"
               style="width: 100%;"
               @change="(val)=>handleSelectChange(item.key,val,item.type)"
             />
@@ -276,25 +276,9 @@
             
 
             <a v-else-if="item.type=='url'"  @click="HandlePreviewFile(formData[item.key])" >{{ formData[item.key]?.name }}</a>
-          </template>
+          <!-- </template> -->
 
-          <template v-else>
-            
-            <el-date-picker
-              v-if="item.type=='dateTimePicker'"
-              v-model="formData[item.key]"
-              :start-placeholder="item.placeholder.startPlaceholder"
-              :end-placeholder="item.placeholder.endPlaceholder"
-              type="datetimerange"
-              format="YYYY-MM-DD HH:mm:ss"
-              date-format="YYYY/MM/DD ddd"
-              time-format="A hh:mm:ss"
-              :range-separator="item.placeholder.rangeSeparator"
-              size="default"
-              :disabled="true"
-            />
-            <img v-else-if="item.type=='img'" :src="formData[item.key]?.url">
-          </template>
+         
 
         </template>
       </el-form-item>

src/views/reviewManagement/stepComponent/step5Component/Step5Component.vue

@@ -0,0 +1,191 @@
+<template>
+    <div class="page_item  end_item">
+        <div class="page_search">
+            <div class="search_content">
+                <div class="content_left">
+                    <div class="grade_title">参数设置</div>
+                </div>
+                <div class="content_right">
+                    <template v-if="!isEdit">
+                        <el-button  class="button_border" @click="StartEdit">开始编辑</el-button>
+                        <el-button  class="button_background" @click="">设置完成</el-button>
+                    </template>
+                    <template v-else>
+                        <el-button  class="button_refresh" @click="SaveEdit">
+                            <img :src="cancelIcon" alt=""> 
+                            取消</el-button>
+                        <el-button  class="button_background" @click="SaveEdit">
+                            <img :src="saveIcon" alt=""> 
+                            保存</el-button>
+                    </template>
+
+                </div>
+            </div>
+        </div>
+        <div class="page_jg_20"></div>
+
+        <Form :inlineLayout="false" 
+            :formItemList="paramsConfigFormItemList" 
+            :defaultFormData="{}"
+            :formDisabled="!isEdit"
+        >
+            <template #lowScoreDeleteRatio="{}">
+                <el-radio-group :disabled="!isEdit"
+                    v-model="defaultParamsConfigFormData.lowScoreDeleteRatio">
+                    <el-radio v-for="radioItem in lowScoreDeleteRatioList" :key="radioItem.value" 
+                        :value="radioItem.value">
+                        {{ radioItem.label }}
+                    </el-radio>
+                </el-radio-group>
+            </template>
+        </Form>
+
+        <Table 
+            :currentPage="1" :pageSize="200"
+            :tableColumns="tableColumns" 
+            :tableData="tableData"
+            :totalNum="0"
+            :hidePagination="true">
+            <template #subject="{row}">
+                <div class="subject_tag">
+                    <el-tag
+                        v-for="item in row.subject.split('、')"
+                        :key="item"
+                        type="info"
+                        effect="plain"
+                    >
+                    {{ item }}
+                    </el-tag>
+                </div>
+            </template>
+            <template #operation="{row}">
+                <div class="table_row_option">
+                    <span :class="[isEdit ?  'el_button_editor' : 'editor_disable']">编辑</span>
+                    <span :class="[isEdit ?  'el_button_delete' : 'editor_disable']">删除</span>
+                </div>
+            </template>
+        </Table>
+        <div class="page_jg_20"></div>
+        <div v-if="isEdit" class="add_subject_option" @click="OpenSubjectCompositionForm"> + 增加科目组合</div>
+    </div>
+
+    <FormDialog 
+        width="640px"
+        :visible="compositionSubjectFormVisible" 
+        :defaultFormData="{}" 
+        title="科目组合" 
+        :submitLoading="compositionSubjectFormLoading" 
+        :formItemList="formItemList" 
+        @close="CloseSubjectCompositionForm" 
+        @confirm="">
+    </FormDialog>
+
+</template>
+
+
+
+<script setup lang="ts">
+import { onMounted, ref } from 'vue';
+import Table from '@/baseComponents/Table.vue';
+import Form from '@/baseComponents/Form.vue';
+import FormDialog from '@/baseComponents/FormDialog.vue';
+
+import {paramsConfigFormItemList} from './form'
+import { tableColumns } from './table';
+import {formItemList} from './formDialog'
+
+import cancelIcon from '@/assets/icon/cancel.svg'
+import saveIcon from '@/assets/icon/save_icon.png'
+
+
+// 参数设置 表单
+const defaultParamsConfigFormData = ref({})
+
+const lowScoreDeleteRatioList = ref([
+    {
+        label:'3%',
+        value:'3'
+    },
+    {
+        label:'5%',
+        value:'5'
+    },
+    {
+        label:'10%',
+        value:'10'
+    },
+    {
+        label:'自定义',
+        value:'custom'
+    },
+])
+
+const tableData = ref([
+    {
+        id:'1',
+        compositionName:'语数英',
+        subject:'语文、数学、英语',
+    },
+    {
+        id:'2',
+        compositionName:'物化生',
+        subject:'物理、化学、生物',
+    },
+
+])
+
+// 参数设置 操作
+const isEdit = ref(false)
+// 开始编辑
+const StartEdit = ()=>{
+    isEdit.value = true
+}
+// 保存编辑
+const SaveEdit = ()=>{
+    isEdit.value = false
+}
+
+
+// 新增科目组合表单 及 操作
+const compositionSubjectFormVisible = ref(false)
+const compositionSubjectFormLoading = ref(false)
+const OpenSubjectCompositionForm = ()=>{
+    compositionSubjectFormVisible.value = true
+}
+
+const CloseSubjectCompositionForm = ()=>{
+    compositionSubjectFormVisible.value = false
+}
+
+
+onMounted(async ()=>{
+    
+  
+})
+</script>
+
+
+
+<style lang="scss" scoped>
+
+.questionnaire_cell{
+    gap:16px;
+    word-break: keep-all;
+}
+
+.subject_tag{
+    display: flex;
+    gap:10px;
+}
+
+.add_subject_option{
+    flex-grow: 0 !important;
+    background: rgba(46,100,250,0.1);
+    border-radius: 6px 6px 6px 6px;
+    text-align: center;
+    padding:4px 0;
+    color:#2e64fa;
+    font-size: 14px;
+
+}
+</style>

src/views/reviewManagement/stepComponent/step5Component/form.ts

@@ -0,0 +1,35 @@
+import { ref } from "vue";
+
+
+export const paramsConfigFormItemList = ref([
+    {
+
+        key: 'isDeleteFullScore',
+        label: '是否删除满分',
+        type:'radio',
+        rules: [],
+        disabled: false,
+        style:{},
+        selectList: [
+            {
+                label:'是',
+                value:1
+            },
+            {
+                label:'否',
+                value:0
+            },
+        ],
+    },
+    {
+
+        key: 'lowScoreDeleteRatio',
+        label: '低分删除比例',
+        type:'radio',
+        rules: [],
+        disabled: false,
+        style:{},
+        custom:true,
+        selectList: [],
+    },
+])

src/views/reviewManagement/stepComponent/step5Component/formDialog.ts

@@ -0,0 +1,26 @@
+
+import { ref } from "vue";
+
+export const formItemList = ref([
+    {
+        key: 'compositionName',
+        label: '组合名称',
+        type:'input',
+        placeholder:'请输入',
+        rules: [],
+        custom:false,
+        style: {},
+    },
+  
+    {
+        key: 'subjectList',
+        label: '选择科目',
+        type:'checkbox',
+        checkAll:true,
+        placeholder:'',
+        rules: [],
+        selectList:[],
+        custom:false,
+        style: {},
+    },
+])

src/views/reviewManagement/stepComponent/step5Component/table.ts

@@ -0,0 +1,31 @@
+import {ref} from 'vue'
+
+export const tableColumns = ref([
+    {
+        name:'compositionName',
+        label:'组合名称',
+        width:100,
+        fixed:'',
+        align:'center',
+        minWdth:'',
+        custom:false,
+    },
+    {
+        name:'subject',
+        label:'科目',
+        width:300,
+        fixed:'',
+        align:'center',
+        minWdth:'',
+        custom:true,
+    },
+    {
+        name:'operation',
+        label:'操作',
+        width:100,
+        fixed:'right',
+        align:'center',
+        minWdth:'',
+        custom:true,
+    },
+])