From b4d6e0923d825f3a6cbb12c29b5a522d56362ff8 Mon Sep 17 00:00:00 2001 From: odc.xiaohui <xiaohui@Q1> Date: 星期六, 18 三月 2023 13:04:17 +0800 Subject: [PATCH] 用户管理导入导出 --- src/views/systemSetting/platform/externalLinks.vue | 396 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 391 insertions(+), 5 deletions(-) diff --git a/src/views/systemSetting/platform/externalLinks.vue b/src/views/systemSetting/platform/externalLinks.vue index 3a25c55..4f6e6d0 100644 --- a/src/views/systemSetting/platform/externalLinks.vue +++ b/src/views/systemSetting/platform/externalLinks.vue @@ -1,13 +1,399 @@ <template> -<div>澶栭儴閾炬帴</div> + <div class="mainContent"> + <!-- <div class="aside"> + <department-aside /> + </div> --> + <div class="grid-content"> + <header> +<!-- <div class="headerContent">--> +<!-- <div class="search">--> +<!-- <span>绛涢�夋潯浠�:</span>--> +<!-- <el-input v-model="context" placeholder="璇疯緭鍏ュ唴瀹�"></el-input>--> +<!-- <div class="findBtn">--> +<!-- <el-button type="primary" @click="getList()">鏌ヨ</el-button>--> +<!-- </div>--> +<!-- </div>--> +<!-- </div>--> + <div class="main-title"> + <el-button + class="el-icon-plus button-addition" + type="primary" + @click="handleAdd()" + >娣诲姞</el-button + > + </div> + </header> + <!-- 鏁版嵁灞曠ず --> + <el-table + border + stripe + ref="multipleTable" + :header-cell-style="{ + background: '#F5F5F5', + 'font-weight': '650', + 'line-height': '45px', + }" + :data="tableData" + style="width: 100%" + :row-class-name="tableRowClassName" + @selection-change="tableChange" + > + <el-table-column type="selection" min-width="5"> </el-table-column> + + <el-table-column prop="name" label="澶栭儴閾炬帴鍚嶇О" min-width="10"> + </el-table-column> + <el-table-column prop="url" label="url鍦板潃" min-width="8"> + </el-table-column> + <el-table-column prop="operation" label="鎿嶄綔" min-width="5"> + <template slot-scope="scope"> + <div class="operation"> + <span @click="handleEdit(scope.row)">缂栬緫</span> + <span class="line">|</span> + <span @click="handleDelete(scope.row)">鍒犻櫎</span> + </div> + </template> + </el-table-column> + </el-table> + + <el-dialog + :visible.sync="dialogUpdate" + width="45%" + v-if="dialogUpdate" + :title="linkTitle" + :before-close="handleClose" + > + <div> + <el-form :model="linkForm" :rules="linkRule" ref="linkForm" label-width="100px" class="demo-ruleForm"> + <el-form-item label="閾炬帴鍚嶇О" prop="name"> + <el-input v-model="linkForm.name"></el-input> + </el-form-item> + <el-form-item label="閾炬帴鍦板潃" prop="url"> + <el-input v-model="linkForm.url"></el-input> + </el-form-item> + <el-form-item> + <el-button type="primary" @click="submitForm('linkForm')">鎻愪氦</el-button> + <el-button @click="resetForm('linkForm')">閲嶇疆</el-button> + </el-form-item> + </el-form> + </div> +<!-- <MyView :info="handheldGrid" @closeDialog="handleCallBack"></MyView>--> + </el-dialog> + + <!-- tools --> +<!-- <div class="tools">--> +<!-- <div class="funs"></div>--> +<!-- <div class="pagination">--> +<!-- <el-pagination--> +<!-- background--> +<!-- :current-page="currentPage"--> +<!-- layout="prev, pager, next"--> +<!-- :total="totalNum"--> +<!-- :page-size="pageSize"--> +<!-- @current-change="changeCurrentPage"--> +<!-- @prev-click="handlePrev"--> +<!-- @next-click="handleNext"--> +<!-- >--> +<!-- </el-pagination>--> +<!-- </div>--> +<!-- </div>--> + </div> + </div> </template> - <script> +import helper from "@/utils/mydate"; +import { createNamespacedHelpers } from "vuex"; +import departmentAside from "@/views/operate/fivepack/threepack/components/aside"; +import { + addexternalLinks, + deletexternalLinks, + searchexternalLinks, + updateexternalLinks +} from "@/api/system/portal/externalLinks"; +// import MyView from "../components/dialogForm.vue"; +const { mapActions } = createNamespacedHelpers("orgGrid"); export default { - name: "externalLinks" -} + components: { departmentAside }, + data() { + return { + linkTitle:'娣诲姞澶栭儴閾炬帴', + linkForm:{}, + tableData: [], + context: "", + dialogUpdate: false, + dialogView: false, + updateFlag: false, + userInfo: "", + totalNum: 0, + pageSize: 10, + currentPage: 1, + renderFlag: false, + flag: { + role: false, + password: false, + depart: false, + }, + all: false, + unsame: false, + myIdx: 0, + preMyIdx: 0, + tempList: [], + handheldGrid: {}, + linkRule: { + name: [ + { required: true, message: '璇疯緭鍏ュ悕绉�', trigger: 'blur' }, + + ], + url: [ + { required: true, message: '璇疯緭鍏ラ摼鎺�', trigger: 'blur' }, + + ], + }, + + }; + }, + created() { + this.getList(); + }, + methods: { + ...mapActions(["getOrgGridList", "deleteOrgGrid"]), + submitForm(formName) { + this.$refs[formName].validate(async (valid) => { + if (valid) { + if (this.linkTitle == '娣诲姞澶栭儴閾炬帴') { + await addexternalLinks(this.linkForm).then(res => { + this.dialogUpdate = false + this.getList() + console.log(res) + }) + } else { + await updateexternalLinks(this.linkForm).then(res => { + this.dialogUpdate = false + this.getList() + console.log(res) + }) + } + + } else { + console.log('error submit!!'); + return false; + } + }); + }, + resetForm(formName) { + this.linkForm = { + name:'', + url:'' + } + this.$refs[formName].resetFields(); + }, + tableChange(list) { + this.tempList = []; + list.forEach((item) => { + this.tempList.push(item.id); + }); + this.all = list.length === this.tableData.length; + }, + changeTime({ createTime }) { + return helper(createTime); + }, + disSame(list) { + list.forEach((row) => { + this.$refs.multipleTable.toggleRowSelection(row); + }); + }, + handleCallBack({ flag }) { + this.dialogUpdate = false; + this.getList(); + }, + handleClose(done) { + if (this.updateFlag) { + this.$confirm("纭鍏抽棴锛�") + .then((_) => { + this.dialogUpdate = false; + this.updateFlag = false; + done(); + }) + .catch((_) => {}); + } else { + done(); + } + }, + // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� + changeCurrentPage(page) { + this.currentPage = page; + this.getList(); + }, + // 涓婁竴椤电偣鍑讳簨浠� + handlePrev(page) { + this.currentPage = page; + this.getList(); + }, + // 涓嬩竴椤电偣鍑讳簨浠� + handleNext(page) { + this.currentPage = page; + this.getList(); + }, + // 鑾峰彇鍒楄〃 + getList() { + const that = this; + const { currentPage, pageSize, context } = this; + searchexternalLinks({ + + }).then((res) => { + console.log(res) + // that.totalNum = res.total; + that.tableData =res; + this.renderFlag = true; + }); + }, + handleAdd() { + this.linkForm={ + name:'', + url:'' + } + this.linkTitle = '娣诲姞澶栭儴閾炬帴' + this.dialogUpdate = true; + }, + handleEdit(row) { + this.linkTitle = '淇敼澶栭儴閾炬帴' + this.linkForm = row; + this.dialogUpdate = true; + }, + handleDelete(row) { + this.$confirm("纭鍒犻櫎锛�").then((_) => { + deletexternalLinks({id:row.id}).then((res) => { + this.$message({ + type: "success", + message: "鍒犻櫎鎴愬姛锛�", + }); + this.getList(); + }); + }); + }, + // 璁剧疆琛ㄦ牸鏂戦┈绾� + tableRowClassName({ row, rowIndex }) { + if ((rowIndex + 1) % 2 === 0) { + return "warning-row"; + } else { + return "success-row"; + } + }, + }, +}; </script> +<style lang="scss" scoped> +.mainContent { + display: flex; + justify-content: flex-start; + flex-wrap: nowrap; -<style scoped> + .grid-content { + margin-left: 10px; + flex: 1; + .tools { + display: flex; + justify-content: space-between; + flex-wrap: nowrap; + .pagination { + margin-top: 55px; + } + + .el-pagination { + // &::v-deep li, + // &::v-deep .btn-prev, + // &::v-deep .btn-next { + // background-color: #071f39; + // color: #4b9bb7; + // } + + // &::v-deep .active { + // background-color: #409eff; + // color: #fff; + // } + } + } + } +} + +header { + // background-color: white; + display: flex; + .headerContent { + padding: 10px 0; + display: flex; + justify-content: space-between; + align-items: center; + + .search { + display: flex; + justify-content: flex-start; + line-height: 2; + + span { + flex: 1; + } + + .el-input { + flex: 2; + color: #1d3f57; + } + .el-select { + flex: 1; + } + .el-date-editor { + flex: 1; + } + } + + .findBtn { + line-height: 100px; + margin-left: 15px; + display: flex; + align-items: center; + margin-top: -2px; + + .el-button { + padding: 12px 25px; + //border-radius: 20px; + } + } + ::v-deep .el-form { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + + .el-form-item { + width: 30%; + } + + .el-form-item__label { + color: #4b9bb7; + } + } + } +} + +.operation { + display: flex; + color: var(--operation-color); + .line { + padding: 0 5px; + } + + span:hover { + cursor: pointer; + } +} + +.main-title { + line-height: 20px; + padding: 10px 20px; + margin-left: auto; + //border-radius: 20px; + .el-button { + padding: 12px 25px; + //border-radius: 20px; + } +} </style> -- Gitblit v1.8.0