From 9ff66017debadfc89bc0c1b796684a4d1dbe2bc3 Mon Sep 17 00:00:00 2001 From: fangyuan <527392886@qq.com> Date: 星期五, 16 十二月 2022 10:00:02 +0800 Subject: [PATCH] 已上报到市批量操作按钮隐藏 --- src/views/systemSetting/platform/mySetting/index.vue | 267 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 264 insertions(+), 3 deletions(-) diff --git a/src/views/systemSetting/platform/mySetting/index.vue b/src/views/systemSetting/platform/mySetting/index.vue index 8b407a0..93ceaed 100644 --- a/src/views/systemSetting/platform/mySetting/index.vue +++ b/src/views/systemSetting/platform/mySetting/index.vue @@ -1,5 +1,266 @@ <template> - <div> - + <div class="mySetting"> + <!-- header 椤甸潰鏍囬鎻愮ず --> + <header> + <div class="header-title">绯荤粺璁剧疆 >> 闂ㄦ埛绠$悊 > 鑷畾涔夎彍鍗曡缃�</div> + </header> + <main> + <div class="main-content"> + <!-- 鏁版嵁灞曠ず --> + <el-row class="my-container"> + <el-col :span="6" class="my-aside"> + <el-tree draggable :data="menuList" @node-click="handleNodeClick" :props="defaultProps" + accordion node-key="id" @node-drop="handleDrop" :allow-drop="allowDrop"> + <span class="custom-tree-node" slot-scope="{ node, data }"> + <span>{{ node.label }}</span> + </span> + </el-tree> + </el-col> + <el-col :span="18" class="my-content" v-if="article.title"> + <div class="my-header">鑿滃崟绠$悊-{{article.title}} + </div> + <div class="my-name"> + <div class="my-show__left">鍚嶇О:</div> + <div class="my-show__right">{{article.title}}</div> + </div> + <div class="my-desc"> + <div class="my-show__left">鎻忚堪:</div> + <div class="my-show__right">{{article.title}}</div> + </div> + <div class="my-show"> + <div class="my-show__left">鏄惁鏄剧ず鑿滃崟:</div> + <div class="my-show__right"> + <el-switch class="switchStyle" v-model="article.isStart" active-color="#3fef9a" + inactive-color="#000212" @change="handleChangeStatus(article)"> + </el-switch> + </div> + </div> + </el-col> + </el-row> + </div> + </main> + <footer> + <!-- 鏂板寮圭獥 --> + <el-dialog title="鎻愮ず" :visible.sync="dialogAdd" v-if="dialogAdd" width="45%" :before-close="handleClose"> + <MyAdd></MyAdd> + </el-dialog> + </footer> </div> -</template> \ No newline at end of file +</template> +<script> +import MyAdd from './create' +export default { + components: { + MyAdd + }, + data() { + return { + menuList: [], + article: {}, + defaultProps: { + children: 'menuVoArrayList', + label: 'title' + }, + dialogAdd: false, + } + }, + created() { + this.getMenuList(); + }, + methods: { + // 鐐瑰嚮鑺傜偣 + handleNodeClick(data) { + this.article = { ...data }; + this.article.isStart === 0 ? this.article.isStart = false : this.article.isStart = true + }, + // 淇敼鐘舵�� + handleChangeStatus(data) { + let { isStart, relationId } = data; + isStart ? isStart = 1 : isStart = 0; + this.$axios({ + method: 'put', + url: `sccg/system/portal/menu/modification_myself?relationId=${relationId}&status=${isStart}` + }) + .then(res => { + this.$message({ + type: res.code === 200 ? 'success' : 'error', + message: res.message + }) + this.getMenuList(); + this.article = {}; + }) + }, + handleDelete(data) { + this.$confirm('鎮ㄧ‘璁よ鍒犻櫎璁㈠崟鍚�?') + .then(_ => { + this.$axios({ + method: 'post', + url: `sccg/menu/delete/${data.id}` + }) + .then(res => { + this.$message({ + type: res.code === 200 ? 'success' : 'error', + message: res.code === 200 ? '鍒犻櫎鑿滃崟鎴愬姛' : res.message + }) + if (res.code === 200) { + this.getMenuList(); + } + }) + }) + .catch(err => { + }) + }, + // 鑾峰彇鑿滃崟鍒楄〃 + getMenuList() { + this.$axios({ + method: 'get', + url: 'sccg/system/portal/menu/search_myself', + }).then(res => { + this.menuList = res.data.menu; + }) + }, + // 鎷栨嫿 + handleDrop(before, after, inner, event) { + }, + // 鑾峰彇鏄惁鍙互鏀剧疆 + allowDrop(before, inner, next) { + if (before.data.level === inner.data.level) { + if (before.data.parentId === inner.data.parentId) { + return next === "prev" || next === "next"; + } else { + return false; + } + } else { + // 涓嶅悓绾ц繘琛屽鐞� + return false; + } + } + } + +} +</script> +<style lang="scss" scoped> +.mySetting { + margin: 10px 20px; + text-align: left; + color: #4b9bb7; + + header { + line-height: 60px; + padding: 0 20px; + display: flex; + justify-content: space-between; + align-items: center; + + .header-add { + .el-button { + background-color: #eb5d01; + border: none; + } + } + } + + main { + background-color: #09152f; + margin-top: 20px; + padding-bottom: 50px; + + .main-content { + .my-container { + ::v-deep .el-tree-node__content { + height: 36px; + } + + ::v-deep .el-tree-node__label { + line-height: 20px; + } + } + + .my-header { + line-height: 60px; + display: flex; + justify-content: center; + } + + .my-name, + .my-desc, + .my-show { + line-height: 40px; + display: flex; + justify-content: center; + align-items: center; + } + + .my-show__right { + margin-left: 10px; + } + + .custom-tree-node { + flex: 1; + display: flex; + align-items: center; + justify-content: space-between; + font-size: 14px; + line-height: 20px; + padding-right: 8px; + } + } + + &::v-deep .switchStyle .el-switch__label { + position: absolute; + display: none; + color: #fff; + } + + &::v-deep .el-switch__core { + background-color: rgba(166, 166, 166, 1); + } + + &::v-deep .switchStyle .el-switch__label--left { + z-index: 9; + left: 20px; + } + + &::v-deep .switchStyle .el-switch__label--right { + z-index: 9; + left: 4px; + } + + &::v-deep .switchStyle .el-switch__label.is-active { + display: block; + } + + &::v-deep .switchStyle.el-switch .el-switch__core, + &::v-deep .el-switch .el-switch__label { + width: 50px !important; + } + } + + &::v-deep .el-dialog__header, + &::v-deep .el-dialog__body { + background-color: #06122c; + } + + &::v-deep .el-dialog__header { + display: flex; + align-items: center; + background-color: #fff; + padding: 20px; + line-height: 60px; + } + + &::v-deep .el-dialog__title { + color: #4b9bb7; + } + + &::v-deep .el-dialog__close { + width: 20px; + height: 20px; + // color: #fff; + } + + &::v-deep .el-dialog__body { + padding: 0; + } +} +</style> \ No newline at end of file -- Gitblit v1.8.0