343 lines
		
	
	
		
			9.2 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			343 lines
		
	
	
		
			9.2 KiB
		
	
	
	
		
			Plaintext
		
	
	
| <template>
 | |
|   <box-content v-loading="loading">
 | |
|     <!-- 搜索框 -->
 | |
|     <div class="search">
 | |
|       <el-form
 | |
|         :inline="true"
 | |
|         size="mini"
 | |
|         class="base-search-form"
 | |
|       >
 | |
|         <!-- 审核问题 -->
 | |
|         <el-form-item
 | |
|           :label="$t('trials:qcCfg:table:questionName')"
 | |
|         >
 | |
|           <el-input
 | |
|             v-model="searchData.QuestionName"
 | |
|             clearable
 | |
|             style="width:120px;"
 | |
|           />
 | |
|         </el-form-item>
 | |
|         <!-- 类型 -->
 | |
|         <el-form-item
 | |
|           :label="$t('trials:qcCfg:table:type')"
 | |
|         >
 | |
|           <el-select
 | |
|             v-model="searchData.Type"
 | |
|             clearable
 | |
|             style="width:120px;"
 | |
|           >
 | |
|             <el-option
 | |
|               v-for="item of $d.QcType"
 | |
|               :key="item.value"
 | |
|               :value="item.value"
 | |
|               :label="item.label"
 | |
|             />
 | |
|           </el-select>
 | |
|         </el-form-item>
 | |
|         <el-form-item>
 | |
|           <el-button
 | |
|             type="primary"
 | |
|             @click="handleSearch"
 | |
|           >{{ $t('common:button:search') }}</el-button>
 | |
|           <el-button
 | |
|             type="primary"
 | |
|             @click="handleReset"
 | |
|           >{{ $t('common:button:reset') }}</el-button>
 | |
|         </el-form-item>
 | |
|       </el-form>
 | |
|       <span style="margin-left:auto">
 | |
|         <el-button
 | |
|           type="primary"
 | |
|           size="mini"
 | |
|           :disabled="selectArr.length<=0"
 | |
|           @click="handleSubmit"
 | |
|         >
 | |
|           {{ $t('common:button:submit') }}
 | |
|         </el-button>
 | |
|       </span>
 | |
|     </div>
 | |
| 
 | |
|     <el-table
 | |
|       :data="list"
 | |
|       stripe
 | |
|       size="small"
 | |
|       height="600"
 | |
|       @selection-change="handleSelectChange"
 | |
|     >
 | |
|       <el-table-column
 | |
|         type="selection"
 | |
|         align="left"
 | |
|         width="45"
 | |
|       />
 | |
|       <el-table-column type="index" width="60" />
 | |
|       <!-- 审核问题 -->
 | |
|       <el-table-column
 | |
|         prop="QuestionName"
 | |
|         :label="$t('trials:qcCfg:table:questionName')"
 | |
|         show-overflow-tooltip
 | |
|       />
 | |
|       <!-- 类型 -->
 | |
|       <el-table-column
 | |
|         prop="Type"
 | |
|         :label="$t('trials:qcCfg:table:type')"
 | |
|         show-overflow-tooltip
 | |
|       >
 | |
|         <template slot-scope="scope">
 | |
|           {{ $fd('QcType', scope.row.Type) }}
 | |
|         </template>
 | |
|       </el-table-column>
 | |
|       <!-- 选项 -->
 | |
|       <el-table-column
 | |
|         prop="TypeValue"
 | |
|         :label="$t('trials:qcCfg:table:typeValue')"
 | |
|         show-overflow-tooltip
 | |
|         min-width="110"
 | |
|       />
 | |
|       <!-- 序号 -->
 | |
|       <el-table-column
 | |
|         prop="ShowOrder"
 | |
|         :label="$t('trials:qcCfg:table:order')"
 | |
|         min-width="70"
 | |
|       />
 | |
|       <!-- 是否必填 -->
 | |
|       <el-table-column
 | |
|         prop="IsRequired"
 | |
|         :label="$t('trials:qcCfg:table:isRequired')"
 | |
|         min-width="90"
 | |
|       >
 | |
|         <template slot-scope="scope">
 | |
|           {{ $fd('YesOrNo', scope.row.IsRequired) }}
 | |
|         </template>
 | |
|       </el-table-column>
 | |
|       <!-- 启用状态 -->
 | |
|       <el-table-column
 | |
|         prop="IsEnable"
 | |
|         :label="$t('trials:qcCfg:table:isEnable')"
 | |
|         min-width="120"
 | |
|       >
 | |
|         <template slot-scope="scope">
 | |
|           {{ $fd('IsEnable', scope.row.IsEnable) }}
 | |
|         </template>
 | |
|       </el-table-column>
 | |
|     </el-table>
 | |
| 
 | |
|     <!-- 自定义QC问题 -->
 | |
|     <el-dialog
 | |
|       v-if="customQuestionVisible"
 | |
|       :show-close="true"
 | |
|       :visible.sync="customQuestionVisible"
 | |
|       append-to-body
 | |
|     >
 | |
|       <div
 | |
|         style="border:1px solid #e0e0e0;padding:10px;"
 | |
|       >
 | |
|         <el-form
 | |
|           ref="qcQuestionForm"
 | |
|           :model="form"
 | |
|           :rules="rules"
 | |
|           label-width="100px"
 | |
|           size="small"
 | |
|         >
 | |
|           <!-- 审核问题 -->
 | |
|           <el-form-item
 | |
|             label="审核问题: "
 | |
|             prop="QuestionName"
 | |
|           >
 | |
|             <el-input v-model="form.QuestionName" />
 | |
|           </el-form-item>
 | |
|           <el-form-item
 | |
|             label="是否必填: "
 | |
|           >
 | |
|             <el-radio-group
 | |
|               v-model="form.IsRequired"
 | |
|             >
 | |
|               <el-radio
 | |
|                 :label="true"
 | |
|               >是</el-radio>
 | |
|               <el-radio :label="false">否</el-radio>
 | |
|             </el-radio-group>
 | |
|           </el-form-item>
 | |
|           <el-form-item
 | |
|             label="启用状态: "
 | |
|           >
 | |
|             <el-radio-group
 | |
|               v-model="form.IsEnable"
 | |
|             >
 | |
|               <el-radio
 | |
|                 :label="true"
 | |
|               >
 | |
|                 启用
 | |
|               </el-radio>
 | |
|               <el-radio
 | |
|                 :label="false"
 | |
|               >
 | |
|                 停用
 | |
|               </el-radio>
 | |
|             </el-radio-group>
 | |
|           </el-form-item>
 | |
|           <el-form-item
 | |
|             label="类型: "
 | |
|           >
 | |
|             <el-select
 | |
|               v-model="form.Type"
 | |
|             >
 | |
|               <el-option
 | |
|                 value="select"
 | |
|                 label="下拉框"
 | |
|               />
 | |
|               <el-option
 | |
|                 value="input"
 | |
|                 label="单行文本框"
 | |
|               />
 | |
|               <el-option
 | |
|                 value="textarea"
 | |
|                 label="多行文本框"
 | |
|               />
 | |
|               <el-option
 | |
|                 value="radio"
 | |
|                 label="单选框"
 | |
|               />
 | |
|             </el-select>
 | |
|           </el-form-item>
 | |
|           <el-form-item
 | |
|             v-if="form.Type === 'textarea' || form.Type === 'input'"
 | |
|             label="选项: "
 | |
|           >
 | |
|             <el-input-number
 | |
|               v-model="form.TypeValue"
 | |
|               placeholder="输入文本框最大长度限制"
 | |
|               controls-position="right"
 | |
|               :min="0"
 | |
|             />
 | |
|           </el-form-item>
 | |
|           <el-form-item
 | |
|             v-else
 | |
|             label="选项: "
 | |
|             prop="TypeValue"
 | |
|           >
 | |
|             <el-input
 | |
|               v-model="form.TypeValue"
 | |
|               placeholder="选项请用‘|’分割多个选项"
 | |
|             />
 | |
|           </el-form-item>
 | |
|           <el-form-item
 | |
|             label="序号: "
 | |
|             prop="ShowOrder"
 | |
|           >
 | |
|             <el-input-number
 | |
|               v-model="form.ShowOrder"
 | |
|               controls-position="right"
 | |
|               :min="0"
 | |
|             />
 | |
|           </el-form-item>
 | |
|         </el-form>
 | |
|       </div>
 | |
|       <div
 | |
|         slot="footer"
 | |
|         class="base-modal-footer"
 | |
|       >
 | |
|         <el-button
 | |
|           size="small"
 | |
|           type="primary"
 | |
|           @click="customQuestionVisible = false"
 | |
|         >Cancel</el-button>
 | |
|         <el-button
 | |
|           size="small"
 | |
|           type="primary"
 | |
|           @click="handleSaveCustomQuestion"
 | |
|         >Save</el-button>
 | |
|       </div>
 | |
|     </el-dialog>
 | |
|   </box-content>
 | |
| </template>
 | |
| <script>
 | |
| import { getQCQuestionConfigureList } from '@/api/dictionary'
 | |
| import { batchAddTrialQCQuestionConfigure } from '@/api/trials'
 | |
| import BoxContent from '@/components/BoxContent'
 | |
| const searchDataDefault = () => {
 | |
|   return {
 | |
|     QuestionName: '',
 | |
|     Type: ''
 | |
|   }
 | |
| }
 | |
| export default {
 | |
|   name: 'QcQuestions',
 | |
|   components: { BoxContent },
 | |
|   data() {
 | |
|     return {
 | |
|       trialId: '',
 | |
|       searchData: searchDataDefault(),
 | |
|       list: [],
 | |
|       loading: false,
 | |
|       selectArr: [],
 | |
|       customQuestionVisible: false,
 | |
|       form: {
 | |
|         Id: '',
 | |
|         QuestionName: '',
 | |
|         IsRequired: true,
 | |
|         IsEnable: true,
 | |
|         Type: 'select',
 | |
|         TypeValue: '',
 | |
|         ParentTriggerValue: '',
 | |
|         ParentId: '',
 | |
|         ShowOrder: 0
 | |
|       },
 | |
|       rules: {
 | |
|         QuestionName: [{ required: true, message: 'Please specify', trigger: 'blur' },
 | |
|           { max: 50, message: 'The maximum length is 50' }],
 | |
|         TypeValue: [{ required: true, message: 'Please specify', trigger: 'blur' },
 | |
|           { max: 200, message: 'The maximum length is 200' }]
 | |
|       }
 | |
|     }
 | |
|   },
 | |
|   mounted() {
 | |
|     this.trialId = this.$route.query.trialId
 | |
|     this.getList()
 | |
|   },
 | |
|   methods: {
 | |
|     // 获取受试者列表信息
 | |
|     getList() {
 | |
|       this.loading = true
 | |
|       this.searchData.TrialId = this.trialId
 | |
|       getQCQuestionConfigureList(this.searchData).then(res => {
 | |
|         this.loading = false
 | |
|         this.list = res.Result
 | |
|       }).catch(() => { this.loading = false })
 | |
|     },
 | |
|     handleSelectChange(val) {
 | |
|       this.selectArr = val
 | |
|     },
 | |
|     handleSubmit() {
 | |
|       this.loading = true
 | |
|       batchAddTrialQCQuestionConfigure(this.trialId, this.selectArr).then(res => {
 | |
|         this.loading = false
 | |
|         if (res.IsSuccess) {
 | |
|           this.$message.success(this.$t('common:message:savedSuccessfully'))
 | |
|           this.$emit('getList')
 | |
|           this.$emit('closeDialog')
 | |
|         }
 | |
|       }).catch(() => { this.loading = false })
 | |
|     },
 | |
|     handleNewQuestion() {
 | |
|       this.customQuestionVisible = true
 | |
|     },
 | |
|     handleSaveCustomQuestion() {
 | |
|       this.$refs.qcQuestionForm.validate(valid => {
 | |
|         if (!valid) return
 | |
|         this.list.unshift(this.form)
 | |
|         this.customQuestionVisible = false
 | |
|       })
 | |
|     },
 | |
|     // 查询
 | |
|     handleSearch() {
 | |
|       this.getList()
 | |
|     },
 | |
|     // 重置
 | |
|     handleReset() {
 | |
|       this.searchData = searchDataDefault()
 | |
|       this.getList()
 | |
|     }
 | |
|   }
 | |
| }
 | |
| </script>
 |