From 2daa54cc53396fb5f5b64a6b0a5b5c814b2bae2d Mon Sep 17 00:00:00 2001 From: WXL <1785969728@qq.com> Date: 星期四, 27 三月 2025 17:56:02 +0800 Subject: [PATCH] 测试完成 --- src/views/knowledge/questionnaire/examine/index.vue | 301 +++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 295 insertions(+), 6 deletions(-) diff --git a/src/views/knowledge/questionnaire/examine/index.vue b/src/views/knowledge/questionnaire/examine/index.vue index 3e0c8c8..4c840fc 100644 --- a/src/views/knowledge/questionnaire/examine/index.vue +++ b/src/views/knowledge/questionnaire/examine/index.vue @@ -1,21 +1,310 @@ <template> <div class="examineemanagement"> - <div>鏌ョ湅璇︽儏W</div> - <div></div> - <div></div> + <!-- 宸︿晶鏍� --> + + <div class="sidecolumn"> + <div class="sidecolumn-top"> + <div class="top-wj">鍘嗗彶鐗堟湰</div> + <!-- <div class="top-tj" @click="dialogFormVisible = true">+娣诲姞</div> --> + </div> + <div class="bottom-fl"> + <el-tabs tab-position="right" v-model="activeName"> + <el-tab-pane + class="tab-paness" + :key="index" + v-for="(item, index) in editableTabs" + > + <div class="mulsz" slot="label"> + {{ item.versionsac + }}<span style="margin-left: 30px">{{ + item.startUsing ? "鍚敤" : "绂佺敤" + }}</span> + </div> + </el-tab-pane> + </el-tabs> + </div> + </div> + <!-- 鍙充晶鏁版嵁 --> + + <div class="leftvlue"> + <div v-if="activeName == '0'"> + <div class="examine-top"> + <span>缂栬緫浜猴細{{ basicInformation.name }}</span> + <span>缂栬緫鏃堕棿锛歿{ basicInformation.day }}</span> + <span class="ewmyl">浜岀淮鐮侀瑙�</span> + </div> + <!-- 鍩虹淇℃伅 --> + <div class="examine-jic"> + <div class="headline">鍩虹淇℃伅</div> + <div class="jic-value"> + <div> + 闂嵎鍚嶇О锛歿{ basicInformation.wname + }}<span>閫傜敤鐤剧梾锛歿{ basicInformation.jbname }}</span> + </div> + <div>琛ㄥ崟鎻忚堪锛歿{ basicInformation.miaosname }}</div> + </div> + </div> + <!-- 闂嵎棰勮 --> + <div class="examine-jic"> + <div class="headline">闂嵎棰勮</div> + <div class="jic-value"> + <div> + 闂嵎浠嬬粛锛�<span class="wenjuanjs" + >闈炲父濂介潪甯稿ソ闈炲父濂介潪甯稿ソ闈炲父濂介潪甯稿ソ闈炲父濂介潪甯稿ソ</span + > + </div> + <div> + 闂嵎浠嬬粛锛�<span class="wenjuanjs" + >闈炲父濂介潪甯稿ソ闈炲父濂介潪甯稿ソ闈炲父濂介潪甯稿ソ</span + > + </div> + </div> + <div class="preview-left"> + <!-- 鍗曢�� --> + <div class="topic-dev" v-for="item in valssu" :key="item.aaa"> + <div class="dev-text"> + {{ item.idd }}銆乕鍗曢�塢  <span>{{ item.wssd }}</span> + </div> + <div class="dev-xx"> + <el-radio-group v-model="radio"> + <el-radio + v-for="(items, index) in item.sdadd" + :key="index" + :label="index" + >{{ items }}</el-radio + > + </el-radio-group> + </div> + </div> + <!-- 澶氶�� --> + <div class="topic-dev" v-for="item in valssu" :key="item.aaa"> + <div class="dev-text"> + {{ item.idd }}銆乕澶氶�塢  <span>{{ item.wssd }}</span> + </div> + <div class="dev-xx"> + <el-checkbox-group v-model="radios"> + <el-checkbox + v-for="(items, index) in item.sdadd" + :key="index" + :label="index" + > + {{ items }} + </el-checkbox> + </el-checkbox-group> + </div> + </div> + <!-- 濉┖ --> + <div class="topic-dev" v-for="item in valssu" :key="item.aaa"> + <div class="dev-text"> + {{ item.idd }}銆乕濉┖]  <span>{{ item.wssd }}</span> + </div> + <div class="dev-xx"> + <el-input placeholder="璇疯緭鍏ョ瓟妗�" v-model="radioas" clearable> + </el-input> + </div> + </div> + </div> + </div> + <div class="examine-jieg"> + <div class="headline">缁撴灉鍙嶉</div> + <div></div> + <div></div> + </div> + </div> + <div v-else-if="activeName == '1'">bbb</div> + <div v-else-if="activeName == '2'">ccc</div> + </div> </div> </template> <script> export default { data() { - return {}; + return { + activeName: "0", + radios: [], //澶氶�夐閫変腑 + + basicInformation: { + name: "鑰佸惔", + day: "2023骞�12鏈�11鏃�16鏃�12鍒�11绉�", + wname: "澶уぇ澶�", + jbname: "灏忓皬灏�", + miaosname: "闈炲父濂藉ぇ澶уぇ", + }, + valssu: [ + { + idd: 1, + wssd: "浣犳渶杩戞�庝箞鏍�", + sdadd: ["sss", "ssccss", "ssaas", "ss"], + }, + ], + editableTabs: [ + { + versionsac: "1.0.3", + startUsing: true, + }, + { + versionsac: "1.0.2", + startUsing: false, + }, + { + versionsac: "1.0.1", + startUsing: false, + }, + ], + }; }, created() {}, - methods: {}, + methods: { + handleClick() {}, + }, }; </script> -<style lang="scss" scoped></style> +<style lang="scss" scoped> +.examineemanagement { + display: flex; + .sidecolumn { + width: 300px; + min-height: 100vh; + text-align: center; + // display: flex; + margin-top: 20px; + margin: 20px; + padding: 30px; + background: #edf1f7; + border: 1px solid #dcdfe6; + -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), + 0 0 6px 0 rgba(0, 0, 0, 0.04); + .sidecolumn-top { + display: flex; + justify-content: space-between; + .top-wj { + font-size: 20px; + } + .top-tj { + font-size: 18px; + + color: rgb(0, 89, 255); + cursor: pointer; + } + } + .center-ss { + margin-top: 30px; + .input-with-select { + height: 40px !important; + } + } + .bottom-fl { + margin-top: 30px; + display: center !important; + } + } + .leftvlue { + width: 80%; + margin-top: 20px; + // margin: 20px; + padding: 30px; + background: #ffff; + border: 1px solid #dcdfe6; + -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), + 0 0 6px 0 rgba(0, 0, 0, 0.04); + .mulsz { + font-size: 20px; + span { + margin-left: 30px; + } + } + .examine-top { + font-size: 20px; + margin-bottom: 40px; + span { + margin-right: 30px; + } + .ewmyl { + color: rgb(0, 81, 255); + cursor: pointer; + } + } + .examine-jic { + .headline { + font-size: 28px; + border-left: 8px solid #41a1be; + padding-left: 5px; + margin-bottom: 15px; + } + .jic-value { + font-size: 20px; + border-top: 1px solid #a7abac; + padding: 20px; + div { + margin-bottom: 15px; + span { + margin-left: 180px; + } + } + .wenjuanjs { + margin-left: 15px; + padding-bottom: 5px; + border-bottom: 1px solid #a7abac; + } + } + .preview-left { + margin: 20px; + // margin: 20px; + padding: 30px; + background: #ffff; + border: 1px solid #dcdfe6; + -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), + 0 0 6px 0 rgba(0, 0, 0, 0.04); + .topic-dev { + margin-bottom: 25px; + font-size: 20px !important; + .dev-text { + margin-bottom: 10px; + } + } + } + } + .examine-jieg { + .headline { + font-size: 28px; + padding-left: 5px; + border-left: 8px solid #41a1be; + // border-bottom: 1px solid #41a1be; + margin-bottom: 15px; + } + } + } +} +::v-deep.el-tabs--left, +.el-tabs--right { + overflow: hidden; + align-items: center; + display: flex; +} +::v-deep.el-input--medium .el-input__inner { + height: 40px !important; +} +::v-deep.el-tabs--right .el-tabs__active-bar.is-right { + height: 40px; + width: 5px; + left: 0; +} +::v-deep.el-tabs--right .el-tabs__item.is-right { + display: block; + font-size: 20px; +} +::v-deep.el-radio-group { + span { + font-size: 24px; + } +} +::v-deep.el-checkbox-group { + span { + font-size: 24px; + } +} +</style> -- Gitblit v1.9.3