123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135 |
- <template>
- <div class="all">
- <div class="initialPoint">
- <div class="initia_title">{{initia_head.initial_suername}}</div>
- <div class="initia_title_1">{{initia_head.initial_suertext}}</div>
- <div v-for="(v,i) in initia_arr" :key="i">
- <el-form :model="v.initia_input" ref="v.initia_input" :label-width="initia_head.initial_width" class="demo-ruleForm">
- <el-form-item style="margin: 20px 0 0 0" v-if="v.type=='switch'">
- <template slot="label">
- <span :style="'width:'+initia_head.initial_left">{{v.initialName}}</span>
- <el-tooltip placement="top">
- <div slot="content" v-html="v.initial_text"></div>
- <span class="initia_mark" v-show="v.initia_mark">?</span>
- </el-tooltip>
- </template>
- <el-switch v-model="v.initia_input.age" :active-value="is" :inactive-value="no" @change="changeAge"></el-switch>
- </el-form-item>
- <el-form-item style="margin: 20px 0 0 0 " v-else>
- <template slot="label">
- <span :style="'width:'+initia_head.initial_left">{{v.initialName}}</span>
- <el-tooltip placement="top">
- <div slot="content" v-html="v.initial_text"></div>
- <span class="initia_mark" v-show="v.initia_mark">?</span>
- </el-tooltip>
- </template>
- <el-input type="age" v-model="v.initia_input.age" :disabled="disabled" autocomplete="off" class="nitia_list_input" placeholder="请输入分值" oninput="if(this.value=='00'){this.value='0';}else{this.value=this.value.replace(/[^0-9]/g,'')}"></el-input>
- </el-form-item>
- </el-form>
- </div>
- <el-button
- type="primary"
- class="initia_button"
- @click="save()"
- :style="'margin: 20px 0 20px '+initia_head.initial_left"
- >保存</el-button>
- </div>
- </div>
- </template>
- <script>
- export default {
- props: {
- initia_arr: Array,
- initia_head: Object,
- },
- data() {
- return {
- is: 1,
- no: 0,
- disabled:false
- };
- },
- created() {
- },
- mounted() {;
- if(this.initia_arr[0].type=="switch"){
- this.disabled=this.initia_arr[0].initia_input.age==1? false:true;
- }
- },
- methods: {
- changeAge(e){
- this.disabled=e==1? false:true
- },
- save() {
- let arr = [];
- // 正则判断代码
- // for (var i = 0; i < this.initia_arr.length; i++) {
- // if (this.initia_arr[i].initia_input.age !== "") {
- // arr.push({
- // sj: this.initia_arr[i].initia_input.age,
- // });
- // if (arr.length == this.initia_arr.length) {
- // this.$emit("initia", arr);
- // this.disableds = false;
- // }
- // } else {
- // this.$message({
- // message: "请输入分值",
- // type: "warning",
- // });
- // return;
- // }
- // }
- // 无正则代码
- for (var i = 0; i < this.initia_arr.length; i++) {
- arr.push({
- sj: this.initia_arr[i].initia_input.age,
- });
- if (arr.length == this.initia_arr.length) {
- this.$emit("initia", arr);
- }
- }
- },
- },
- };
- </script>
- <style>
- .el-form-item__label {
- text-align: left;
- }
- .initialPoint {
- margin-left: 30px;
- }
- .initia_mark {
- background: #409eff;
- border-radius: 50%;
- width: 14px;
- height: 14px;
- color: #fff;
- display: inline-block;
- font-size: 12px;
- line-height: 14px;
- text-align: center;
- margin-left: 4px;
- cursor: default;
- }
- .initia_title {
- font-size: 20px;
- color: rgba(48, 49, 51, 1);
- padding-top: 30px;
- font-family: PingFangSC-Regular;
- }
- .initia_title_1 {
- color: #606266;
- font-size: 14px;
- margin-top: 10px;
- }
- .nitia_list_input {
- width: 160px;
- height: 40px;
- border-radius: 4px;
- background-color: rgba(255, 255, 255, 1);
- }
- </style>
|