From b73b5dd97cbda40d0584f579ed9f65f4fcffe23f Mon Sep 17 00:00:00 2001 From: WXL <1785969728@qq.com> Date: 星期一, 31 三月 2025 15:33:02 +0800 Subject: [PATCH] 测试完成 --- src/views/Intelligentcenter/centercontrol/index.vue | 250 ++++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 214 insertions(+), 36 deletions(-) diff --git a/src/views/Intelligentcenter/centercontrol/index.vue b/src/views/Intelligentcenter/centercontrol/index.vue index 221339b..baca6b5 100644 --- a/src/views/Intelligentcenter/centercontrol/index.vue +++ b/src/views/Intelligentcenter/centercontrol/index.vue @@ -7,6 +7,7 @@ class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" + @select="handleSelect" background-color="#545c64" text-color="#fff" active-text-color="#ffd04b" @@ -14,33 +15,46 @@ <el-submenu index="1"> <template slot="title"> <i class="el-icon-location"></i> - <span>瀵艰埅涓�</span> + <span>鎮h�呯鐞�</span> </template> <el-menu-item-group> - <template slot="title">鍒嗙粍涓�</template> <el-menu-item index="1-1">閫夐」1</el-menu-item> - <el-menu-item index="1-2">閫夐」2</el-menu-item> </el-menu-item-group> - <el-menu-item-group title="鍒嗙粍2"> - <el-menu-item index="1-3">閫夐」3</el-menu-item> - </el-menu-item-group> - <el-submenu index="1-4"> + <!-- <el-submenu index="1-4"> <template slot="title">閫夐」4</template> <el-menu-item index="1-4-1">閫夐」1</el-menu-item> - </el-submenu> + </el-submenu> --> </el-submenu> - <el-menu-item index="2"> - <i class="el-icon-menu"></i> - <span slot="title">瀵艰埅浜�</span> - </el-menu-item> - <el-menu-item index="3" disabled> - <i class="el-icon-document"></i> - <span slot="title">瀵艰埅涓�</span> - </el-menu-item> - <el-menu-item index="4"> - <i class="el-icon-setting"></i> - <span slot="title">瀵艰埅鍥�</span> - </el-menu-item> + <el-submenu index="2"> + <template slot="title"> + <i class="el-icon-location"></i> + <span>鐭ヨ瘑搴�</span> + </template> + <el-menu-item-group> + <el-menu-item index="2-1">瀹f暀绠$悊</el-menu-item> + <el-menu-item index="2-2">闂嵎绠$悊</el-menu-item> + <el-menu-item index="2-3">棰樺簱绠$悊</el-menu-item> + </el-menu-item-group> + <!-- <el-submenu index="1-4"> + <template slot="title">閫夐」4</template> + <el-menu-item index="1-4-1">閫夐」1</el-menu-item> + </el-submenu> --> + </el-submenu> + <el-submenu index="3"> + <template slot="title"> + <i class="el-icon-location"></i> + <span>鎮h�呯鐞�</span> + </template> + <el-menu-item-group> + <el-menu-item index="3-1">璇濇湳搴�</el-menu-item> + <el-menu-item index="3-2">鎰忓浘绠$悊</el-menu-item> + <el-menu-item index="3-3">妯℃澘搴�</el-menu-item> + </el-menu-item-group> + <!-- <el-submenu index="1-4"> + <template slot="title">閫夐」4</template> + <el-menu-item index="1-4-1">閫夐」1</el-menu-item> + </el-submenu> --> + </el-submenu> </el-menu> </div> <!-- 鍙充晶鏁版嵁 --> @@ -58,7 +72,37 @@ :label="item.title" :name="item.name" > - {{ item.content }} + <!-- {{ item.content }} --> + <div class="leftvalu-code" v-if="editableTabs.length"> + <el-tabs + v-model="fiactiveName" + type="card" + @tab-click="handleClick" + > + <el-tab-pane + v-if="item.content == 0 || item.content == 3" + label="浠g爜灞曠ず" + name="first" + ><codemirror + v-model="item.value" + :options="options" + ></codemirror + ></el-tab-pane> + <el-tab-pane + v-if="item.content == 1 || item.content == 3" + label="琛ㄦ牸灞曠ず" + name="second" + ><el-table :data="tableData" style="width: 100%"> + <el-table-column prop="date" label="鏃ユ湡" width="180"> + </el-table-column> + <el-table-column prop="name" label="濮撳悕" + width="100" > + </el-table-column> + <el-table-column prop="address" label="鍦板潃"> + </el-table-column> </el-table + ></el-tab-pane> + </el-tabs> + </div> </el-tab-pane> </el-tabs> </div> @@ -67,24 +111,135 @@ </template> <script> +// import { codemirror } from "vue-codemirror"; export default { name: "education", data() { return { - editableTabsValue: "2", - editableTabs: [ + code: "", + fiactiveName: "first", + options: { + line: true, + theme: "rubyblue", // 涓婚 + tabSize: 4, // 鍒惰〃绗︾殑瀹藉害 + indentUnit: 2, // 涓�涓潡搴旇缂╄繘澶氬皯涓┖鏍硷紙鏃犺杩欏湪缂栬緫璇█涓剰鍛崇潃浠�涔堬級銆傞粯璁ゅ�间负 2銆� + firstLineNumber: 1, // 浠庡摢涓暟瀛楀紑濮嬭绠楄鏁般�傞粯璁ゅ�间负 1銆� + readOnly: false, // 鍙 + autorefresh: true, + smartIndent: true, // 涓婁笅鏂囩缉杩� + lineNumbers: true, // 鏄惁鏄剧ず琛屽彿 + styleActiveLine: true, // 楂樹寒閫変腑琛� + viewportMargin: Infinity, //澶勭悊楂樺害鑷�傚簲鏃舵惌閰嶄娇鐢� + showCursorWhenSelecting: true, // 褰撻�夋嫨澶勪簬娲诲姩鐘舵�佹椂鏄惁搴旂粯鍒舵父鏍� + mode: "javascript", + }, + tableData: [ { - title: "Tab 1", - name: "1", - content: "Tab 1 content", + date: "2016-05-02", + name: "鐜嬪皬铏�", + address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�", }, { - title: "Tab 2", - name: "2", - content: "Tab 2 content", + date: "2016-05-04", + name: "鐜嬪皬铏�", + address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1517 寮�", + }, + { + date: "2016-05-01", + name: "鐜嬪皬铏�", + address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1519 寮�", + }, + { + date: "2016-05-03", + name: "鐜嬪皬铏�", + address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�", }, ], + + editableTabsValue: "2-2-3", + editableTabslist: [ + { + title: "鎮h�呯鐞�", + name: "1-1", + content: 0, + value: "<el-tab-pane>", + }, + { + title: "瀹f暀绠$悊", + name: "2-1", + content: 1, + value: + "<el-table-column prop='address' label='鍦板潃'></el-table-column>", + }, + { + title: "闂嵎绠$悊", + name: "2-2", + content: 3, + value: + "<el-table-column prop='address' label='鍦板潃'></el-table-column>", + }, + { + title: "棰樺簱绠$悊", + name: "2-3", + content: "", + }, + { + title: "璇濇湳搴�", + name: "3-1", + content: "", + }, + { + title: "鎰忓浘绠$悊", + name: "3-2", + content: "", + }, + { + title: "妯℃澘搴�", + name: "3-3", + content: "", + }, + ], + // 闇�瑕佺殑鏍戠殑鏍煎紡 + editableTabslisat: [ + { + title: "鎮h�呯鐞�", + name: "1", + son: [ + { + title: "鎮h�呯鐞�", + name: "1-1", + content: "", + }, + ], + }, + { + title: "鐭ヨ瘑搴�", + name: "2", + son: [ + { + title: "瀹f暀绠$悊", + name: "2-1", + content: "", + }, + { + title: "闂嵎绠$悊", + name: "2-2", + content: "", + }, + { + title: "棰樺簱绠$悊", + name: "2-3", + content: "", + son: [ + { title: "鏀跨瓥绠$悊", name: "2-3-1", content: "" }, + { title: "娌诲畨绠$悊", name: "2-3-2", content: "" }, + ], + }, + ], + }, + ], + editableTabs: [], tabIndex: 2, }; }, @@ -96,15 +251,26 @@ handleOpen(key, keyPath) { console.log(key, keyPath); }, + handleSelect(key, keyPath) { + console.log(key, keyPath, "ss"); + var result = this.editableTabslist.find((v) => { + return v.name === key; // return v.value === '9' 杩斿洖undefined + }); + + var results = this.editableTabs.some(function (item) { + if (item.name == key) { + //item.name == "鐜嬮夯瀛�" + return true; //杩斿洖false + } + }); + if (!results) { + this.editableTabs.push(result); + } + this.editableTabsValue = key; + console.log(result); + }, handleTabsEdit(targetName, action) { if (action === "add") { - let newTabName = ++this.tabIndex + ""; - this.editableTabs.push({ - title: "New Tab", - name: newTabName, - content: "New Tab content", - }); - this.editableTabsValue = newTabName; } if (action === "remove") { let tabs = this.editableTabs; @@ -131,6 +297,17 @@ <style lang="scss" scoped> .educationmanagement { display: flex; +} +.leftvalu-code { + // background: #3a3d42; + height: 300px; + ::v-deep.CodeMirror { + position: relative; + overflow: hidden; + // background: #3a3d42; + color: #3a92ef; + font-size: 20px; + } } .sidecolumn { width: 300px; @@ -168,6 +345,7 @@ display: center !important; } } + .qrcode-dialo { text-align: center; // display: flex; -- Gitblit v1.9.3