From d3059a6205121ce357acef995dfdd16211a43202 Mon Sep 17 00:00:00 2001
From: wangyuhang <139@qq.com>
Date: 星期二, 18 十一月 2025 10:14:02 +0800
Subject: [PATCH] 增加字段 修改字段
---
src/views/infomanger/banner/index.vue | 255 +++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 249 insertions(+), 6 deletions(-)
diff --git a/src/views/infomanger/banner/index.vue b/src/views/infomanger/banner/index.vue
index a8f2bbc..fe055a4 100644
--- a/src/views/infomanger/banner/index.vue
+++ b/src/views/infomanger/banner/index.vue
@@ -1,9 +1,252 @@
<template>
<div class="app-container">
- <el-row>
- <el-col :span="24">
- <el-button></el-button>
- </el-col>
- </el-row>
+ <div class="form-content">
+ <el-form inline :model="form.questionList" ref="formRef" label-width="75px" :rules="rules">
+ <div
+ class="border"
+ v-for="(item, index) in form.questionList"
+ :key="index"
+ >
+ <!-- <div class="title-project">
+ 璇勪环椤箋{ index + 1 }}
+ </div> -->
+ <div class="close-icon" @click="removeList(index)">
+ <el-tooltip content="绉婚櫎璇勪环椤�">
+ <el-icon><Close color="red"/></el-icon>
+ </el-tooltip>
+ </div>
+ <el-row>
+ <el-col :span="12">
+ <el-form-item :label="`璇勪环椤�${index + 1}`" :prop="`${index}`" style="width: 100%" :rules="[
+ {
+ validator: validateSubField,
+ trigger: 'blur'
+ }
+ ]">
+ <el-input
+ placeholder="璇疯緭鍏�"
+ v-model="item.questionName"
+ ></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="6">
+ <el-form-item label="寰楀垎" :prop="item.questionScore">
+ <el-input-number
+ placeholder="璇疯緭鍏�"
+ v-model="item.questionScore"
+ :min="1"
+ :max="10"
+ controls-position="right"
+ ></el-input-number>
+ </el-form-item>
+ </el-col>
+ <el-col :span="6">
+ <el-form-item label="璇勪环绫诲瀷" :prop="item.questionType">
+ <el-radio-group
+ placeholder="璇疯緭鍏�"
+ v-model="item.questionType"
+ >
+ <el-radio :value="2">鎵撳垎</el-radio>
+ <el-radio :value="1">閫夋嫨</el-radio>
+ </el-radio-group>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row v-if="item.questionType === 2">
+ <el-form-item>
+ <el-rate disabled :max="item.questionScore" v-model="item.questionScore"></el-rate>
+ </el-form-item>
+ </el-row>
+ <el-row v-if="item.questionType === 1">
+ <el-col :span="24">
+ <el-form-item label="閫夐」" style="width: 100%;" :prop="`${index}`" :rules="[
+ {
+ validator: answerListField,
+ }
+ ]">
+ <div
+ v-for="(ele, childIndex) in item.answerList"
+ :key="index"
+ style="width: 100%;"
+ class="set-flex"
+ >
+ <div style="font-size: 14px;margin-right: 10px">{{ childIndex + 1 }}</div>
+ <el-input
+ v-model="ele.answerName"
+ placeholder="璇疯緭鍏�"
+ style="width: 65%; margin-right: 10px"
+ ></el-input>
+ <el-checkbox v-model="ele.isScore" @change="changeValue($event, index, childIndex)" :true-value="1" :false-value="0" :label="'鏄惁璁″垎'"/>
+ <el-button type="danger" size="small" @click="removeArrlist(index, childIndex)" style="margin-left: 10px;">绉婚櫎</el-button>
+ </div>
+
+ <!-- </el-radio-group> -->
+
+ <div class="mt10">
+ <el-button type="primary" plain @click="addOptions(index, item.questionName)">娣诲姞閫夐」</el-button>
+ </div>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </div>
+ </el-form>
+ <div class="center mt20 fixed">
+ <el-button type="primary" @click="addContent">娣诲姞璇勪环椤�</el-button>
+ <el-button @click="save()" type="primary" >淇濆瓨鍐呭</el-button>
+ </div>
+ </div>
</div>
-</template>
\ No newline at end of file
+</template>
+
+<script lang="ts" setup>
+import { listEvaluate, saveEvaluate } from '@/api/system/company/company'
+import { ElMessage, ElMessageBox} from 'element-plus'
+const tableData = ref([])
+const addNewRef = ref()
+const formRef = ref()
+const form: any = ref({
+ questionList: []
+})
+const rules = ref({
+ questionName: [
+ {
+ required: true,
+ message: '璇疯緭鍏ラ棶棰�',
+ trigger: 'blur'
+ }
+ ]
+})
+const instance = getCurrentInstance()
+
+function getListEvaluate() {
+ listEvaluate().then((val) => {
+ form.value.questionList = val.data.questionList
+ })
+}
+function addContent() {
+ form.value.questionList.push({
+ questionStatus: 0,
+ questionType: 2,
+ questionScore: 5,
+ questionName: '',
+ answerList: []
+ })
+}
+function addOptions(index: number, name: any){
+ if(!form.value.questionList[index].answerList) {
+ form.value.questionList[index].answerList = []
+ }
+ form.value.questionList[index].answerList.push({
+ questionName: name
+ })
+}
+function save(item?: string) {
+ formRef.value.validate((valid) => {
+ console.log(valid)
+ if(valid) {
+ saveEvaluate({questionList: form.value.questionList}).then(val => {
+ ElMessage.success(item||'淇濆瓨鎴愬姛')
+ })
+ }
+ })
+
+}
+function validateSubField(rule: any, value: any, callback: any) {
+ // console.log(rule, value)
+// console.log(proxy['form'])
+ if(!form.value.questionList[rule.field].questionName) {
+ callback(new Error('璇峰叆璇勪环椤�'))
+ } else {
+ callback()
+ }
+}
+function answerListField(rule: { field: string | number }, value: any, callback: any) {
+ if(form.value.questionList[rule.field].answerList.length < 2) {
+ callback(new Error('璇疯嚦灏戞坊鍔犱袱椤�'))
+ } else if(form.value.questionList[rule.field].answerList) {
+ const value = form.value.questionList[rule.field].answerList.every(item => item.answerName)
+ if(!value) {
+ callback(new Error('璇峰畬鍠勯�夐」鍐呭'))
+ } else {
+ callback()
+ }
+ } else {
+ callback()
+ }
+}
+function changeValue(event, index, childIndex) {
+ // form.value.questionList[index].isScore = event.target.
+ form.value.questionList[index].answerList.forEach((item: { isScore: number }) => {
+ item.isScore = 0
+ })
+ form.value.questionList[index].answerList[childIndex].isScore = 1
+}
+function removeList(index) {
+ ElMessageBox.confirm('纭绉婚櫎璇ヨ瘎浠烽」锛�', '鎻愮ず', {
+ confirmButtonText: '纭',
+ cancelButtonText: '鍙栨秷',
+ type: 'danger',
+ }).then(val => {
+ form.value.questionList.splice(index, 1)
+ save('鍒犻櫎鎴愬姛')
+ })
+
+}
+function removeArrlist(index: string | number, childIndex: any) {
+ form.value.questionList[index].answerList.splice(childIndex, 1)
+}
+getListEvaluate()
+</script>
+
+<style scoped lang="scss">
+.form-content {
+ width: 80%;
+ padding-bottom: 150px;
+ margin: 0 auto;
+ // border: 1px solid #e2e2e2;
+}
+
+.border {
+ // border: 1px solid #e2e2e2;
+ margin-bottom: 10px;
+ padding: 20px 30px 0;
+ position: relative;
+ :deep() {
+ .el-form-item__label{
+ font-weight: 500
+ }
+ }
+}
+.close-icon {
+ position: absolute;
+ right: 10px;
+ top: 10px;
+ cursor: pointer;
+}
+
+.add-button {
+ text-align: center;
+ border: 1px dotted #979797;
+ line-height: 40px;
+ cursor: pointer;
+ border-radius: 5px;
+}
+.set-flex{
+ display: flex;
+ justify-content: flex-start;
+ margin-top: 10px
+}
+.center{
+ text-align: center;
+}
+.fixed{
+ background-color: white;
+ position: sticky;
+ bottom: 0;
+}
+.title-project{
+ font-weight: 700;
+ color: #606266;
+ margin-bottom: 10px
+}
+</style>
--
Gitblit v1.9.1