From 15079a363658567a62db46ccfe489f04af79a687 Mon Sep 17 00:00:00 2001 From: “dzb” <2632970487@qq.com> Date: 星期三, 28 九月 2022 18:41:45 +0800 Subject: [PATCH] 运营管理的基础设置和案件池首页 --- src/views/operate/baseSetting/violation/updateUser/index.vue | 195 ++ src/views/operate/baseSetting/illegalBuild/index.vue | 572 +++++-- src/views/login/index.vue | 10 src/views/operate/baseSetting/violation/index.vue | 607 +++++-- src/views/systemSetting/platform/portalSetting/index.vue | 22 src/views/layout/components/Menu/index.vue | 6 src/views/operate/disposal/casepool/pool/index.vue | 676 ++++++-- src/views/systemSetting/baseSetting/user/components/header/index.vue | 2 src/views/operate/baseSetting/illegalBuild/createUser/index.vue | 195 ++ src/views/systemSetting/baseSetting/department/index.vue | 175 + src/views/systemSetting/baseSetting/user/components/updateUser/index.vue | 17 src/views/systemSetting/baseSetting/user/components/createUser/index.vue | 27 src/assets/imgs/login/login.png | 0 src/views/operate/baseSetting/illegalBuild/updateUser/index.vue | 131 + src/views/systemSetting/baseSetting/user/components/main/index.vue | 132 + src/views/operate/disposal/casepool/pool/createUser/vio/index.vue | 3 src/views/operate/baseSetting/threepack/updateUser/index.vue | 195 ++ src/views/operate/baseSetting/threepack/createUser/index.vue | 195 ++ /dev/null | 173 -- src/views/operate/disposal/casepool/pool/createUser/ill/index.vue | 3 src/views/systemSetting/baseSetting/department/createUser/index.vue | 172 + src/views/operate/baseSetting/violation/createUser/index.vue | 195 ++ src/components/Upload/index.vue | 4 src/views/operate/disposal/casepool/pool/updateUser/index.vue | 195 ++ src/App.vue | 17 src/views/operate/disposal/casepool/pool/createUser/index.vue | 61 src/views/systemSetting/baseSetting/role/index.vue | 165 + src/views/operate/baseSetting/threepack/index.vue | 607 +++++-- 28 files changed, 3,777 insertions(+), 975 deletions(-) diff --git a/src/App.vue b/src/App.vue index 9879ab9..f77c534 100644 --- a/src/App.vue +++ b/src/App.vue @@ -49,23 +49,24 @@ }; </script> <style> - .el-select-dropdown__item{ - height: 100%; + +.el-select-dropdown__item{ + height: 100% !important; } .el-select-dropdown,.popper-class{ - background-color: #17324c; + background-color: #17324c !important; } .el-select-dropdown__item.hover, .el-select-dropdown__item:hover{ - background-color: #17324c; + background-color: #17324c !important; } .el-tree{ - background-color: #17324c; + background-color: #17324c !important; } .el-tree-node__content:hover, .el-upload-list__item:hover{ - background-color: #09152f; - color: #4b9bb7; + background-color: #09152f !important; + color: #4b9bb7 !important; } .el-tree-node:focus>.el-tree-node__content{ - background-color: #09152f; + background-color: #09152f !important; } </style> \ No newline at end of file diff --git a/src/assets/imgs/login/login.png b/src/assets/imgs/login/login.png new file mode 100644 index 0000000..e98c0a9 --- /dev/null +++ b/src/assets/imgs/login/login.png Binary files differ diff --git a/src/assets/imgs/login/login_bg.jpg b/src/assets/imgs/login/login_bg.jpg deleted file mode 100644 index 102df77..0000000 --- a/src/assets/imgs/login/login_bg.jpg +++ /dev/null Binary files differ diff --git a/src/components/Upload/index.vue b/src/components/Upload/index.vue index 827e39b..aa2ddd2 100644 --- a/src/components/Upload/index.vue +++ b/src/components/Upload/index.vue @@ -38,8 +38,8 @@ this.$emit('getPicUrl', { obj: res.data, value: this.mykey }); }, getToken() { - const token = localStorage.getItem('token'); - const tokenHead = localStorage.getItem('tokenHead'); + const token = sessionStorage.getItem('token'); + const tokenHead = sessionStorage.getItem('tokenHead'); if (token && tokenHead) { return { Authorization: tokenHead + token } } diff --git a/src/views/layout/components/Menu/index.vue b/src/views/layout/components/Menu/index.vue index 06a2df9..7638b0d 100644 --- a/src/views/layout/components/Menu/index.vue +++ b/src/views/layout/components/Menu/index.vue @@ -84,10 +84,10 @@ <span class="secondSpan">浜嬮」澶勭悊绠$悊</span> </template> <el-menu-item index="/home/operate/casepool/pool">妗堜欢姹�</el-menu-item> - <el-menu-item index="/home/operate/casepool/escalation">涓婃姤绠$悊</el-menu-item> - <el-menu-item index="/home/operate/casepool/dispatch">璋冨害绠$悊</el-menu-item> + <!-- <el-menu-item index="/home/operate/casepool/escalation">涓婃姤绠$悊</el-menu-item> + <el-menu-item index="/home/operate/casepool/dispatch">璋冨害绠$悊</el-menu-item> --> <!-- <el-menu-item index="/home/operate/casepool">鍐嶅涔犵鐞�</el-menu-item> --> - <el-menu-item index="/home/operate/casepool/notDeal">鏆備笉澶勭悊</el-menu-item> + <!-- <el-menu-item index="/home/operate/casepool/notDeal">鏆備笉澶勭悊</el-menu-item> --> </el-submenu> <el-menu-item index="/home/operate/myWait">鎴戠殑寰呭姙</el-menu-item> <el-submenu index="/home/operate/rectification" class="secondMenu"> diff --git a/src/views/login/index.vue b/src/views/login/index.vue index a13548a..bfd8c3e 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -94,9 +94,16 @@ }; }, created() { - const pic = JSON.parse(localStorage.getItem('pic')); + const pic = JSON.parse(sessionStorage.getItem('pic')); if(pic){ this.imgUrl = pic.loginPageIconUrl + }else{ + this.$axios({ + method: 'get', + url: 'sccg/system/portal/logo/search', + }).then(res => { + this.imgUrl = res.data.loginPageIconUrl + }) } }, methods: { @@ -176,6 +183,7 @@ .logo>img { width: 75px; height: 75px; + border-radius: 4px; } .text-r { diff --git a/src/views/operate/baseSetting/illegalBuild/components/createInterface/index.vue b/src/views/operate/baseSetting/illegalBuild/components/createInterface/index.vue deleted file mode 100644 index 1be774b..0000000 --- a/src/views/operate/baseSetting/illegalBuild/components/createInterface/index.vue +++ /dev/null @@ -1,260 +0,0 @@ -<template> - <div class="createmyInterface"> - <main> - <div class="mainContent"> - <el-form ref="user" label-width="140px" autoComplete="on" :model="myInterface" - :rules="createmyInterfaceRules" label-position="right"> - <!-- 搴旂敤鍚嶇О --> - <el-form-item label="搴旂敤鍚嶇О:" prop="applicationName"> - <el-input v-model="myInterface.applicationName" placeholder="濉啓搴旂敤鍚嶇О"></el-input> - </el-form-item> - <!-- 搴旂敤鍥炬爣 --> - <el-form-item label="搴旂敤鍥炬爣:" prop="applicationIconUrl"> - <div class="iconBox"> - <div class="upload"> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="iconView"> - <span>绀烘剰鍥�</span> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="tip"> - <span>鍙厑璁镐笂浼爅pg,jpeg,png,svg鏍煎紡鐨勫浘鐗囷紝寤鸿灏哄涓�105px*105px</span> - </div> - </div> - </el-form-item> - <!-- 搴旂敤绫诲瀷 --> - <el-form-item label="搴旂敤绫诲瀷:" prop="applicationType"> - <div class="optionItem"> - <el-radio-group v-model="myInterface.applicationType"> - <el-radio :label="1">缃戦〉搴旂敤</el-radio> - </el-radio-group> - </div> - </el-form-item> - <!--缃戠珯url --> - <el-form-item label="缃戠珯url:" prop="websiteUrl"> - <el-input v-model="myInterface.websiteUrl"></el-input> - </el-form-item> - <!-- 搴旂敤鎻忚堪 --> - <el-form-item label="搴旂敤鎻忚堪:" prop="description"> - <el-input v-model="myInterface.description" placeholder="璇峰~鍐欐弿杩�"></el-input> - </el-form-item> - <!-- 鎸夐挳 --> - <el-form-item> - <div class="optionBtn"> - <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">鎻愪氦 - </el-button> - <el-button class="btn reset">閲嶇疆</el-button> - </div> - </el-form-item> - </el-form> - </div> - </main> - </div> -</template> -<script> -export default { - data() { - const validateApplicationName = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰悕绉�")); - } - }; - const validateApplicationIconUrl = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�")); - } else { - const rep = /^\w+$/; - if (!rep.test(value)) { - callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆")); - } - } - }; - const validateApplicationType = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰鍚�")); - } else { - const rep = /^[\u4E00-\u9FA5]{2,4}$/; - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕"); - } - } - }; - const validatePhone = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欐墜鏈哄彿鐮�")); - } else { - const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/ - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜"); - } - } - }; - return { - myInterface: { - }, - createmyInterfaceRules: { - applicationName: [ - { required: true, trigger: "blur", validator: validateApplicationName}, - ], - applicationIconUrl: [ - { required: true, trigger: "blur", validator: validateApplicationIconUrl }, - ], - applicationType: [ - { required: true, trigger: "blur", validator: validateApplicationType }, - ], - websiteUrl: [ - { required: true, trigger: "blur" }, - ], - description: [ - { required: false, trigger: "blur" }, - ], - }, - } - }, - created() { - const that = this; - }, - methods: { - handleUser() { - const { myInterface } = this; - this.$axios.post('sccg/system/portal/thirdApp/add', { - websiteUrl:myInterface.websiteUrl, - applicationIconUrl:myInterface.applicationIconUrl, - applicationType:0, - description:myInterface.description, - applicationName:myInterface.applicationName - }).then(res => { - console.log(res); - // if (res.code === 200) { - // this.refresh(); - // } - }) - }, - }, - props: ['refresh'] -} -</script> -<style lang="scss" scoped> -.createmyInterface { - border-radius: 1px; - background-color: #09152f; - - main { - text-align: left; - padding: 0 55px; - background-color: #09152f; - padding-bottom: 50px; - .mainContent { - display: flex; - justify-content: center; - padding-top: 50px; - - .iconBox { - display: flex; - - .upload { - display: flex; - align-items: flex-end; - - img { - width: 120px; - height: 120px; - border-radius: 4px; - } - } - - .iconView { - display: flex; - flex-direction: column; - margin-left: 30px; - justify-content: flex-end; - - img { - width: 70px; - height: 70px; - border-radius: 4px; - } - } - - .tip { - display: flex; - align-items: flex-end; - margin-left: 30px; - font-size: 12px; - - span { - line-height: 20px; - } - } - } - .optionBtn{ - margin-top: 30px; - &::v-deep .el-button{ - padding: 12px 40px; - } - .reset{ - border: 1px solid #0079fe; - color: #0079fe; - } - } - &::v-deep .el-form-item__label { - color: #4b9bb7; - } - - &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; - } - - .addPerson { - display: flex; - list-style: none; - padding: 0; - - li { - background-color: #cccccc; - width: 36px; - height: 36px; - border-radius: 50%; - color: #fff; - text-align: center; - font-size: 30px; - margin-left: 10px; - } - } - - .el-form-item__content { - width: 400px; - - .el-select { - width: 100%; - } - } - - .optionHandleSp { - display: flex; - - .areaNumber, - .moreNumber { - flex: 1; - } - - .telNumber { - flex: 2; - } - } - - } - } - - footer { - border-top: 1px solid #fff; - height: 80px; - display: flex; - align-items: center; - justify-content: flex-end; - padding-right: 20px; - } -} -</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/illegalBuild/components/viewInterface/index.vue b/src/views/operate/baseSetting/illegalBuild/components/viewInterface/index.vue deleted file mode 100644 index 6b28ebb..0000000 --- a/src/views/operate/baseSetting/illegalBuild/components/viewInterface/index.vue +++ /dev/null @@ -1,246 +0,0 @@ -<template> - <div class="createmyInterface"> - <main> - <div class="mainContent"> - <el-form ref="user" label-width="140px" autoComplete="on" :model="myInterface" - :rules="createmyInterfaceRules" label-position="right"> - <!-- 搴旂敤鍚嶇О --> - <el-form-item label="搴旂敤鍚嶇О:" prop="applicationName"> - <el-input v-model="myInterface.applicationName" placeholder="濉啓搴旂敤鍚嶇О"></el-input> - </el-form-item> - <!-- 搴旂敤鍥炬爣 --> - <el-form-item label="搴旂敤鍥炬爣:" prop="applicationIconUrl"> - <div class="iconBox"> - <div class="upload"> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="iconView"> - <span>绀烘剰鍥�</span> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="tip"> - <span>鍙厑璁镐笂浼爅pg,jpeg,png,svg鏍煎紡鐨勫浘鐗囷紝寤鸿灏哄涓�105px*105px</span> - </div> - </div> - </el-form-item> - <!-- 搴旂敤绫诲瀷 --> - <el-form-item label="搴旂敤绫诲瀷:" prop="applicationType"> - <div class="optionItem"> - <el-radio-group v-model="myInterface.applicationType"> - <el-radio :label="1">缃戦〉搴旂敤</el-radio> - </el-radio-group> - </div> - </el-form-item> - <!--缃戠珯url --> - <el-form-item label="缃戠珯url:" prop="websiteUrl"> - <el-input v-model="myInterface.websiteUrl"></el-input> - </el-form-item> - <!-- 搴旂敤鎻忚堪 --> - <el-form-item label="搴旂敤鎻忚堪:" prop="description"> - <el-input v-model="myInterface.description" placeholder="璇峰~鍐欐弿杩�"></el-input> - </el-form-item> - <!-- 鎸夐挳 --> - <!-- <el-form-item> - <div class="optionBtn"> - <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">鎻愪氦 - </el-button> - <el-button class="btn reset">閲嶇疆</el-button> - </div> - </el-form-item> --> - </el-form> - </div> - </main> - </div> -</template> -<script> -export default { - data() { - const validateApplicationName = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰悕绉�")); - } - }; - const validateApplicationIconUrl = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�")); - } else { - const rep = /^\w+$/; - if (!rep.test(value)) { - callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆")); - } - } - }; - const validateApplicationType = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰鍚�")); - } else { - const rep = /^[\u4E00-\u9FA5]{2,4}$/; - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕"); - } - } - }; - const validatePhone = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欐墜鏈哄彿鐮�")); - } else { - const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/ - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜"); - } - } - }; - return { - myInterface: { - }, - createmyInterfaceRules: { - applicationName: [ - { required: true, trigger: "blur", validator: validateApplicationName}, - ], - applicationIconUrl: [ - { required: true, trigger: "blur", validator: validateApplicationIconUrl }, - ], - applicationType: [ - { required: true, trigger: "blur", validator: validateApplicationType }, - ], - websiteUrl: [ - { required: true, trigger: "blur" }, - ], - description: [ - { required: false, trigger: "blur" }, - ], - }, - } - }, - created() { - const that = this; - const {userInfo} = this; - this.myInterface = JSON.parse(JSON.stringify(userInfo)); - }, - methods: { - }, - props: ['updateFlag','userInfo'] -} -</script> -<style lang="scss" scoped> -.createmyInterface { - border-radius: 1px; - background-color: #09152f; - - main { - text-align: left; - padding: 0 55px; - background-color: #09152f; - - .mainContent { - display: flex; - justify-content: center; - padding-top: 50px; - - .iconBox { - display: flex; - - .upload { - display: flex; - align-items: flex-end; - - img { - width: 120px; - height: 120px; - border-radius: 4px; - } - } - - .iconView { - display: flex; - flex-direction: column; - margin-left: 30px; - justify-content: flex-end; - - img { - width: 70px; - height: 70px; - border-radius: 4px; - } - } - - .tip { - display: flex; - align-items: flex-end; - margin-left: 30px; - font-size: 12px; - - span { - line-height: 20px; - } - } - } - .optionBtn{ - &::v-deep .el-button{ - padding: 12px 40px; - } - .reset{ - border: 1px solid #0079fe; - color: #0079fe; - } - } - &::v-deep .el-form-item__label { - color: #4b9bb7; - } - - &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; - } - - .addPerson { - display: flex; - list-style: none; - padding: 0; - - li { - background-color: #cccccc; - width: 36px; - height: 36px; - border-radius: 50%; - color: #fff; - text-align: center; - font-size: 30px; - margin-left: 10px; - } - } - - .el-form-item__content { - width: 400px; - - .el-select { - width: 100%; - } - } - - .optionHandleSp { - display: flex; - - .areaNumber, - .moreNumber { - flex: 1; - } - - .telNumber { - flex: 2; - } - } - - } - } - - footer { - border-top: 1px solid #fff; - height: 80px; - display: flex; - align-items: center; - justify-content: flex-end; - padding-right: 20px; - } -} -</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/illegalBuild/createUser/index.vue b/src/views/operate/baseSetting/illegalBuild/createUser/index.vue new file mode 100644 index 0000000..b609337 --- /dev/null +++ b/src/views/operate/baseSetting/illegalBuild/createUser/index.vue @@ -0,0 +1,195 @@ +<template> + <div class="createUser"> + <main> + <div class="mainContent"> + <el-form ref="user" label-width="140px" autoComplete="on" :model="things" label-position="right"> + <!-- 杩濊浜嬮」缂栧彿 --> + <el-form-item class="optionItem" label="杩濊浜嬮」缂栧彿:" prop="number"> + <el-input v-model="things.number" placeholder="璇峰~鍐欒繚瑙勪簨椤圭紪鍙�"></el-input> + </el-form-item> + <!-- 鎵�灞炵被鍨� --> + <el-form-item class="optionItems" label="鎵�灞炵被鍨�:" prop="typeThird"> + <el-select v-model="things.typeThird" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" > + <el-option v-for="item in typeThirdList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲ぇ绫� --> + <el-form-item class="optionItem" label="鎵�灞炲ぇ绫�:" prop="typeSecond"> + <el-select v-model="things.typeSecond" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" > + <el-option v-for="item in typeSecondList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲皬绫� --> + <el-form-item class="optionItem" label="鎵�灞炲皬绫�:" prop="typeFirst"> + <el-select v-model="things.typeFirst" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeFirstList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 妗堢敱 --> + <el-form-item class="optionItem" label="妗堢敱:" prop="type"> + <el-input type="textarea" autosize v-model="things.type" placeholder="璇疯緭鍏ユ鐢辨弿杩板唴瀹�" + :disabled="!updateFlag" disabled></el-input> + </el-form-item> + <el-form-item v-if="updateFlag"> + <div class="optionBtn"> + <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">纭 + </el-button> + </div> + </el-form-item> + </el-form> + + </div> + </main> + </div> +</template> +<script> +export default { + data() { + return { + things: { + number: 0, + type: '', + typeFirst: '', + typeSecond: '', + typeThird: '', + }, + roleList: [], + typeThirdList:[], + typeSecondList:[], + typeFirstList:[], + } + }, + created() { + console.log(this.userInfo); + this.things = JSON.parse(JSON.stringify(this.userInfo)); + // 鑾峰彇鎵�灞炵被鍨嬪垪琛� + this.getTypeThird(); + this.getTypeSecond(); + this.getTypeFirst(); + }, + methods: { + // handleUser() { + // this.$refs.user.validate((valid) => { + // if (valid) { + // const { role } = this; + // console.log(role); + // this.$axios.post('/sccg/role/update/' + role.id, { + // id: role.id, + // status: role.status, + // description: role.description, + // name: role.name, + // sort: 0 + // }).then(res => { + // this.$emit('changeDialog', { dialogUpdate: false }); + // this.getUserList(); + // }) + // } else { + // return false; + // } + // }) + // }, + // 鏌ヨ鎵�灞炵被鍨� + getTypeThird() { + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_first", + }) + .then(res => { + this.typeThirdList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲ぇ绫� + getTypeSecond(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_second", + }) + .then(res => { + this.typeSecondList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲皬绫� + getTypeFirst(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_third", + }) + .then(res => { + this.typeFirstList = res.data; + }) + } + }, + props: ['getUserList'] +} +</script> +<style lang="scss" scoped> +.createUser { + border-radius: 1px; + background-color: #09152f; + + main { + // border: 1px solid #fff; + text-align: left; + padding: 0 55px; + background-color: #09152f; + padding-bottom: 50px; + + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; + + .el-form-item__content { + width: 400px; + + .el-select { + width: 100%; + } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } + + } + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } +} +</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/illegalBuild/index.vue b/src/views/operate/baseSetting/illegalBuild/index.vue index e609a53..b1efb3c 100644 --- a/src/views/operate/baseSetting/illegalBuild/index.vue +++ b/src/views/operate/baseSetting/illegalBuild/index.vue @@ -1,93 +1,216 @@ <template> - <div class="otherInterface"> + <div class="userList"> + <div class="headerTitle"> + 杩愯惀绠$悊銆嬪熀纭�璁剧疆銆嬭繚寤轰簨椤硅缃� + </div> <header> - <div class="headerTitle">杩愯惀绠$悊 >> 鍩虹璁剧疆 > 杩濆缓浜嬮」璁剧疆</div> + <div class="headerContent"> + <div class="search"> + <span>绛涢�夋潯浠�:</span> + <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="context"></el-input> + <div class="findBtn"> + <el-button type="primary" @click="getUserList">鏌ヨ</el-button> + </div> + </div> + <div class="addUser"> + <el-button class="addBtn" type="primary" @click="dialogCreate = true">鏂板缓瑙掕壊</el-button> + <!-- <el-dialog :visible.sync="dialogCreate" title="鏂板瑙掕壊" width="45%" v-if="dialogCreate" + :before-close="handleClose"> + <createUser :refresh="getUserList" /> + </el-dialog> --> + </div> + </div> </header> <main> - <div class="mainHeader"> - <span>绛涢�夋潯浠�:</span> - <el-input placeholder="璇疯緭鍏ュ唴瀹�"></el-input> - </div> <div class="mainContent"> - <!-- @selection-change="handleSelectionChange" --> - <!-- 鏁版嵁娓叉煋 --> - <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%" + <!-- 鏁版嵁灞曠ず --> + <el-table ref="multipleTable" :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" - :row-class-name="tableRowClassName"> - <el-table-column type="selection" width="55"> + :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 label="缂栧彿" prop="applicationName" min-width="10"> + <el-table-column prop="number" label="缂栧彿" min-width="10"> </el-table-column> - <el-table-column prop="applicationType" label="鎵�灞炵被鍨�" min-width="10"> + <el-table-column prop="typeFirst" label="鎵�灞炵被鍨�" min-width="10"> </el-table-column> - <el-table-column prop="websiteUrl" label="鎵�灞炵被鍒�" min-width="20"> + <el-table-column prop="type" label="鎵�灞炵被鍒�" min-width="10"> </el-table-column> - <el-table-column label="鎿嶄綔" min-width="10"> + <el-table-column prop="operation" label="鎿嶄綔" min-width="10"> <template slot-scope="scope"> - <span @click="handleView(scope.row)">鏌ョ湅</span> - <span class="line">|</span> - <span @click="handleDelete(scope.row)">鍒犻櫎</span> + <div class="operation"> + <span @click="handleFind(scope.row)">鏌ョ湅</span> + <span class="line">|</span> + <span @click="handleDelete(scope.row)">鍒犻櫎</span> + </div> </template> </el-table-column> </el-table> - <!-- 鍒嗛〉 --> - <!-- <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> --> + <!-- 鏌ョ湅淇敼椤甸潰 --> + <el-dialog :visible.sync="dialogUpdate" width="45%" :title="updateFlag ? '淇敼杩濆缓淇℃伅' :'鏌ョ湅杩濆缓淇℃伅'" + v-if="dialogUpdate" :before-close="handleClose"> + <updateUser :updateFlag="updateFlag" :userInfo=userInfo + :getUserList=" context ? getUserList : getUserList" @changeDialog="changeDialog" /> + </el-dialog> + <!-- tools --> + <div class="tools"> + <div class="funs"> + <div class="funsItem"> + <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> + </div> + <div class="funsItem"> + <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> + </div> + <div class="funsItem"> + <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange"> + <el-option v-for="item in options" :key="item.value" :label="item.label" + :value="item.value" :disabled="item.disabled"> + </el-option> + </el-select> + </div> + </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> </main> - <footer> - <!-- 鍒涘缓寮圭獥 --> - <el-dialog :visible.sync="dialogCreate" title="鏂板绗笁鏂规帴鍙�" width="45%" v-if="dialogCreate" - :before-close="handleClose"> - <createInterface /> - </el-dialog> - <!-- 鏌ョ湅寮圭獥 --> - <el-dialog :visible.sync="dialogUpdate" :title="updateFlag ?'淇敼绗笁鏂规帴鍙�':'鏌ョ湅绗笁鏂规帴鍙�'" width="45%" - v-if="dialogUpdate" :before-close="handleClose"> - <viewInterface :updateFlag="updateFlag" :userInfo=userInfo /> - </el-dialog> - </footer> </div> </template> <script> -import createInterface from './components/createInterface'; -import viewInterface from './components/viewInterface' +import updateUser from "./updateUser" +import createUser from "./createUser" export default { components: { - createInterface, viewInterface + updateUser,createUser }, data() { return { tableData: [], - search: "", + context: "", dialogCreate: false, dialogUpdate: false, updateFlag: false, userInfo: '', - // totalNum: 200, - // pageSize: 10, - // currentPage: 1, + totalNum: null, + pageSize: 10, + currentPage: 1, + all: false, + unsame: false, + myIdx: 0, + options: [ + { + value: 0, + label: '鎵归噺鎿嶄綔', + disabled: true, + }, + { + value: 1, + label: '鎵归噺鍚敤', + }, + { + value: 2, + label: '鎵归噺绂佺敤', + }, + { + value: 3, + label: '鎵归噺鍒犻櫎', + } + ], + tempList: [] } }, created() { this.getUserList(); }, methods: { - // 鑾峰彇鎺ュ彛鍒楄〃 - getUserList() { - const that = this; - // const { currentPage, pageSize, search } = this; - this.dialogCreate = false; - this.$axios.get("sccg/system/portal/thirdApp/search").then(res => { - const { code, data } = res; - if (code == 200) { - this.tableData = data; - } + // 鎵归噺鍒犻櫎 + mulDelete(idArr){ + console.log(idArr); + this.$axios({ + method:'delete', + url:'sccg/illegal_building/batch_delete?ids='+idArr, + }).then(res=>{ + this.getUserList(); + this.$message({ + message:res.message, + type:res.code === 200 ? 'success' : 'warning' + }) }) + }, + // 鎵ц涓嬫媺妗嗘搷浣� + selectChange(val) { + let ids = []; + this.tempList.forEach(item => { + ids.push(item.number); + }) + if (ids.length !== 0) { + if (val === 3) { + this.mulDelete(ids); + } + } else { + this.$message({ + type: 'warning', + message: '鎮ㄨ繕娌¢�変腑浠讳綍鏁版嵁', + }) + } + }, + // 鐩戝惉琛ㄦ牸閫変腑鐘舵�� + tableChange(list) { + this.tempList = list; + if (list.length === this.tableData.length) { + this.all = true; + } else { + this.all = false + } + }, + // 鍏ㄩ�� + selectAll() { + this.$refs.multipleTable.toggleAllSelection(); + }, + // 鍙嶉�� + disSame(list) { + list.forEach(row => { + this.$refs.multipleTable.toggleRowSelection(row) + }) + }, + // 鍒犻櫎鍗曟潯鏁版嵁 + handleDelete({ number }) { + console.log(number); + this.$confirm('纭鍒犻櫎锛�') + .then(_ => { + console.log(1); + this.$axios({ + method: 'delete', + url: `sccg/illegal_building/delete?id=${number}`, + }) + .then(res => { + console.log(res); + this.$message({ + type: res.code === 200 ? 'success' : 'warning', + message: res.message + }) + + this.getUserList(); + }) + }) + .catch(_ => { console.log(2) }); + }, + // 鑾峰彇鐢ㄦ埛鍒楄〃 + getUserList() { + const { currentPage, pageSize, context } = this; + // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭� + this.$axios({ + method: 'get', + url: `sccg/illegal_building/query?current=${currentPage}&size=${pageSize}&keyWord=${context}`, + }) + .then(res => { + this.tableData = res.data.records; + this.totalNum = res.data.total; + }) }, // 璁剧疆琛ㄦ牸鏂戦┈绾� tableRowClassName({ row, rowIndex }) { @@ -98,149 +221,276 @@ } return ''; }, - // 鎵撳紑鏂板鐣岄潰 - handleAdd() { - this.dialogCreate = true; + // 鏌ョ湅鐢ㄦ埛淇℃伅(涓嶅彲淇敼) + handleFind(rowData) { + this.dialogUpdate = true; + this.updateFlag = false; + this.userInfo = rowData; }, - // 鍒涘缓寮圭獥鍏抽棴 + // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� + changeCurrentPage(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓婁竴椤电偣鍑讳簨浠� + handlePrev(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓嬩竴椤电偣鍑讳簨浠� + handleNext(page) { + this.currentPage = page; + this.getUserList(); + }, + changeDialog(val) { + this.dialogUpdate = val.dialogUpdate; + console.log(val); + }, handleClose(done) { - const that = this; this.$confirm('纭鍏抽棴锛�') .then(_ => { - that.dialogCreate = false; + this.dialogCreate = false; + this.dialogUpdate = false; done(); }) .catch(_ => { }); - }, - // 鍒涘缓鏌ョ湅寮圭獥 - handleView(rowData) { - this.userInfo = rowData; - this.dialogUpdate = true; - }, - // 鍒犻櫎绗笁鏂规帴鍙� - handleDelete({ id }) { - console.log(id); - this.$axios.delete('sccg/system/portal/thirdApp/delete', { - params: { - id - } - }).then(res => { - console.log(res); - }) } - // // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� - // changeCurrentPage(page) { - // this.currentPage = page; - // this.getUserList(); - // }, - // // 涓婁竴椤电偣鍑讳簨浠� - // handlePrev(page) { - // this.currentPage = page; - // this.getUserList(); - // }, - // // 涓嬩竴椤电偣鍑讳簨浠� - // handleNext(page) { - // this.currentPage = page; - // this.getUserList(); - // }, } } </script> -<!-- sccg/system/portal/thirdApp/search --> <style lang="scss" scoped> -.otherInterface { +.userList { + text-align: left; + margin: 10px 20px; + color: #4b9bb7; + + .headerTitle { + line-height: 40px; + } + header { - display: flex; - line-height: 60px; - justify-content: space-between; - padding: 0 20px; - color: #4b9bb7; - &::v-deep .el-button { - background-color: #eb5d01; - border: none; - color: #fff; - border-radius: 20px; + background-color: #09152f; + border: 1pox solid #fff; + + .headerContent { + padding: 0 40px; + display: flex; + line-height: 100px; + justify-content: space-between; + align-items: center; + + .search { + display: flex; + justify-content: flex-start; + + span { + flex: 1; + } + + .el-input { + flex: 2; + color: #1d3f57; + + &::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + } + + } + + .findBtn { + line-height: 100px; + margin-left: 15px; + display: flex; + align-items: center; + margin-top: -2px; + + .el-button { + padding: 12px 25px; + border-radius: 20px; + } + } + + .addBtn { + background-color: #eb5d01; + border: none; + border-radius: 20px; + padding: 12px 30px; + } } } main { - padding: 10px 20px; + background-color: #09152f; + margin-top: 20px; + padding-bottom: 50px; + border: 1pox solid #fff; - .mainHeader { - padding-left: 20px; - display: flex; + .mainTitle { line-height: 60px; - color: #4b9bb7; - background-color: #09152f; - .el-input { - width: 180px; - height: 35px; - margin-left: 10px; + } - &::v-deep .el-input__inner { - background-color: #09152f; + .tools { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 20px; + + .funs { + display: flex; + + .funsItem { + line-height: 28px; + display: flex; + align-items: center; border: 1px solid #17324c; + border-radius: 4px; + font-size: 12px; + margin-left: 10px; + + .el-checkbox { + width: 80px; + padding: 0 10px; + } + + .el-select { + width: 120px; + } + + &::v-deep .el-input__inner { + border: none; + background-color: #09152f; + } + + &:hover { + border: 1px solid #4b9bb7; + } + + &:hover .el-checkbox { + color: #4b9bb7; + } + } + + } + + .pagination { + margin-top: 50px; + display: flex; + line-height: 50px; + justify-content: center; + + .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; + } } } } - .mainContent { - margin-top: 20px; - .el-table { + .el-table { + color: #4b9bb7; + font-size: 10px; + + &::v-deep .cell { + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + } + + &::v-deep .el-table__empty-block { + background-color: #09152f; + } + + &::v-deep .el-table__empty-block { color: #4b9bb7; - - &::v-deep .el-table__empty-block { - background-color: #06122c; - } - - &::v-deep .el-table__empty-text { - color: #4b9bb7; - } - - &::v-deep .warning-row { - background-color: #06122c; - } - - &::v-deep .success-row { - background-color: #071f39; - } } - .line { - padding: 0 5px; - // margin-top: -10px; + .operation { + display: flex; + + .line { + padding: 0 5px; + } + + span:hover { + cursor: pointer; + } } + } + + .el-table::v-deep .warning-row { + background: #06122c; + } + + .el-table::v-deep .success-row { + background: #071f39; + } + + &::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; } } - footer { + &::v-deep .el-dialog__header, + &::v-deep .el-dialog__body { + background-color: #06122c; + } - &::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__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__title { - color: #4b9bb7; - } + &::v-deep .el-dialog__close { + width: 20px; + height: 20px; + // color: #fff; + } - &::v-deep .el-dialog__close { - width: 20px; - height: 20px; - // color: #fff; - } - - &::v-deep .el-dialog__body { - padding: 0; - } + &::v-deep .el-dialog__body { + padding: 0; } } </style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/illegalBuild/updateUser/index.vue b/src/views/operate/baseSetting/illegalBuild/updateUser/index.vue new file mode 100644 index 0000000..296caea --- /dev/null +++ b/src/views/operate/baseSetting/illegalBuild/updateUser/index.vue @@ -0,0 +1,131 @@ +<template> + <div class="updateUser"> + <main> + <div class="mainContent"> + <el-form ref="user" label-width="140px" autoComplete="on" :model="things" label-position="right"> + <!-- 杩濊浜嬮」缂栧彿 --> + <el-form-item class="optionItem" label="缂栧彿:" prop="number"> + <el-input v-model="things.number" placeholder="璇峰~鍐欒繚瑙勪簨椤圭紪鍙�" :disabled="!updateFlag"></el-input> + </el-form-item> + <!-- 鎵�灞炵被鍨� --> + <el-form-item class="optionItems" label="鎵�灞炵被鍨�:" prop="typeFirst"> + <el-select v-model="things.typeFirst" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeFirstList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲ぇ绫� --> + <el-form-item class="optionItem" label="鎵�灞炵被鍒�:" prop="type"> + <el-input type="textarea" v-model="things.type" disabled ></el-input> + </el-form-item> + <!-- <el-form-item v-if="updateFlag"> + <div class="optionBtn"> + <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">纭 + </el-button> + </div> + </el-form-item> --> + </el-form> + + </div> + </main> + </div> +</template> +<script> +export default { + data() { + return { + things: { + number: 0, + type: '', + typeFirst: '', + }, + typeFirstList:[], + } + }, + created() { + console.log(this.userInfo); + this.things = JSON.parse(JSON.stringify(this.userInfo)); + // 鑾峰彇鎵�灞炵被鍨嬪垪琛� + this.getTypeFirst(); + }, + methods: { + // 鏌ヨ鎵�灞炲皬绫� + getTypeFirst(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_third", + }) + .then(res => { + this.typeFirstList = res.data; + }) + } + }, + props: ['userInfo', 'updateFlag', 'getUserList', 'changeDialog'] +} +</script> +<style lang="scss" scoped> +.updateUser { + border-radius: 1px; + background-color: #09152f; + + main { + // border: 1px solid #fff; + text-align: left; + padding: 0 55px; + background-color: #09152f; + padding-bottom: 50px; + + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; + + .el-form-item__content { + width: 400px; + + .el-select { + width: 100%; + } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } + + } + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } +} +</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/threepack/components/createInterface/index.vue b/src/views/operate/baseSetting/threepack/components/createInterface/index.vue deleted file mode 100644 index 1be774b..0000000 --- a/src/views/operate/baseSetting/threepack/components/createInterface/index.vue +++ /dev/null @@ -1,260 +0,0 @@ -<template> - <div class="createmyInterface"> - <main> - <div class="mainContent"> - <el-form ref="user" label-width="140px" autoComplete="on" :model="myInterface" - :rules="createmyInterfaceRules" label-position="right"> - <!-- 搴旂敤鍚嶇О --> - <el-form-item label="搴旂敤鍚嶇О:" prop="applicationName"> - <el-input v-model="myInterface.applicationName" placeholder="濉啓搴旂敤鍚嶇О"></el-input> - </el-form-item> - <!-- 搴旂敤鍥炬爣 --> - <el-form-item label="搴旂敤鍥炬爣:" prop="applicationIconUrl"> - <div class="iconBox"> - <div class="upload"> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="iconView"> - <span>绀烘剰鍥�</span> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="tip"> - <span>鍙厑璁镐笂浼爅pg,jpeg,png,svg鏍煎紡鐨勫浘鐗囷紝寤鸿灏哄涓�105px*105px</span> - </div> - </div> - </el-form-item> - <!-- 搴旂敤绫诲瀷 --> - <el-form-item label="搴旂敤绫诲瀷:" prop="applicationType"> - <div class="optionItem"> - <el-radio-group v-model="myInterface.applicationType"> - <el-radio :label="1">缃戦〉搴旂敤</el-radio> - </el-radio-group> - </div> - </el-form-item> - <!--缃戠珯url --> - <el-form-item label="缃戠珯url:" prop="websiteUrl"> - <el-input v-model="myInterface.websiteUrl"></el-input> - </el-form-item> - <!-- 搴旂敤鎻忚堪 --> - <el-form-item label="搴旂敤鎻忚堪:" prop="description"> - <el-input v-model="myInterface.description" placeholder="璇峰~鍐欐弿杩�"></el-input> - </el-form-item> - <!-- 鎸夐挳 --> - <el-form-item> - <div class="optionBtn"> - <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">鎻愪氦 - </el-button> - <el-button class="btn reset">閲嶇疆</el-button> - </div> - </el-form-item> - </el-form> - </div> - </main> - </div> -</template> -<script> -export default { - data() { - const validateApplicationName = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰悕绉�")); - } - }; - const validateApplicationIconUrl = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�")); - } else { - const rep = /^\w+$/; - if (!rep.test(value)) { - callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆")); - } - } - }; - const validateApplicationType = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰鍚�")); - } else { - const rep = /^[\u4E00-\u9FA5]{2,4}$/; - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕"); - } - } - }; - const validatePhone = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欐墜鏈哄彿鐮�")); - } else { - const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/ - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜"); - } - } - }; - return { - myInterface: { - }, - createmyInterfaceRules: { - applicationName: [ - { required: true, trigger: "blur", validator: validateApplicationName}, - ], - applicationIconUrl: [ - { required: true, trigger: "blur", validator: validateApplicationIconUrl }, - ], - applicationType: [ - { required: true, trigger: "blur", validator: validateApplicationType }, - ], - websiteUrl: [ - { required: true, trigger: "blur" }, - ], - description: [ - { required: false, trigger: "blur" }, - ], - }, - } - }, - created() { - const that = this; - }, - methods: { - handleUser() { - const { myInterface } = this; - this.$axios.post('sccg/system/portal/thirdApp/add', { - websiteUrl:myInterface.websiteUrl, - applicationIconUrl:myInterface.applicationIconUrl, - applicationType:0, - description:myInterface.description, - applicationName:myInterface.applicationName - }).then(res => { - console.log(res); - // if (res.code === 200) { - // this.refresh(); - // } - }) - }, - }, - props: ['refresh'] -} -</script> -<style lang="scss" scoped> -.createmyInterface { - border-radius: 1px; - background-color: #09152f; - - main { - text-align: left; - padding: 0 55px; - background-color: #09152f; - padding-bottom: 50px; - .mainContent { - display: flex; - justify-content: center; - padding-top: 50px; - - .iconBox { - display: flex; - - .upload { - display: flex; - align-items: flex-end; - - img { - width: 120px; - height: 120px; - border-radius: 4px; - } - } - - .iconView { - display: flex; - flex-direction: column; - margin-left: 30px; - justify-content: flex-end; - - img { - width: 70px; - height: 70px; - border-radius: 4px; - } - } - - .tip { - display: flex; - align-items: flex-end; - margin-left: 30px; - font-size: 12px; - - span { - line-height: 20px; - } - } - } - .optionBtn{ - margin-top: 30px; - &::v-deep .el-button{ - padding: 12px 40px; - } - .reset{ - border: 1px solid #0079fe; - color: #0079fe; - } - } - &::v-deep .el-form-item__label { - color: #4b9bb7; - } - - &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; - } - - .addPerson { - display: flex; - list-style: none; - padding: 0; - - li { - background-color: #cccccc; - width: 36px; - height: 36px; - border-radius: 50%; - color: #fff; - text-align: center; - font-size: 30px; - margin-left: 10px; - } - } - - .el-form-item__content { - width: 400px; - - .el-select { - width: 100%; - } - } - - .optionHandleSp { - display: flex; - - .areaNumber, - .moreNumber { - flex: 1; - } - - .telNumber { - flex: 2; - } - } - - } - } - - footer { - border-top: 1px solid #fff; - height: 80px; - display: flex; - align-items: center; - justify-content: flex-end; - padding-right: 20px; - } -} -</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/threepack/components/viewInterface/index.vue b/src/views/operate/baseSetting/threepack/components/viewInterface/index.vue deleted file mode 100644 index 6b28ebb..0000000 --- a/src/views/operate/baseSetting/threepack/components/viewInterface/index.vue +++ /dev/null @@ -1,246 +0,0 @@ -<template> - <div class="createmyInterface"> - <main> - <div class="mainContent"> - <el-form ref="user" label-width="140px" autoComplete="on" :model="myInterface" - :rules="createmyInterfaceRules" label-position="right"> - <!-- 搴旂敤鍚嶇О --> - <el-form-item label="搴旂敤鍚嶇О:" prop="applicationName"> - <el-input v-model="myInterface.applicationName" placeholder="濉啓搴旂敤鍚嶇О"></el-input> - </el-form-item> - <!-- 搴旂敤鍥炬爣 --> - <el-form-item label="搴旂敤鍥炬爣:" prop="applicationIconUrl"> - <div class="iconBox"> - <div class="upload"> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="iconView"> - <span>绀烘剰鍥�</span> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="tip"> - <span>鍙厑璁镐笂浼爅pg,jpeg,png,svg鏍煎紡鐨勫浘鐗囷紝寤鸿灏哄涓�105px*105px</span> - </div> - </div> - </el-form-item> - <!-- 搴旂敤绫诲瀷 --> - <el-form-item label="搴旂敤绫诲瀷:" prop="applicationType"> - <div class="optionItem"> - <el-radio-group v-model="myInterface.applicationType"> - <el-radio :label="1">缃戦〉搴旂敤</el-radio> - </el-radio-group> - </div> - </el-form-item> - <!--缃戠珯url --> - <el-form-item label="缃戠珯url:" prop="websiteUrl"> - <el-input v-model="myInterface.websiteUrl"></el-input> - </el-form-item> - <!-- 搴旂敤鎻忚堪 --> - <el-form-item label="搴旂敤鎻忚堪:" prop="description"> - <el-input v-model="myInterface.description" placeholder="璇峰~鍐欐弿杩�"></el-input> - </el-form-item> - <!-- 鎸夐挳 --> - <!-- <el-form-item> - <div class="optionBtn"> - <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">鎻愪氦 - </el-button> - <el-button class="btn reset">閲嶇疆</el-button> - </div> - </el-form-item> --> - </el-form> - </div> - </main> - </div> -</template> -<script> -export default { - data() { - const validateApplicationName = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰悕绉�")); - } - }; - const validateApplicationIconUrl = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�")); - } else { - const rep = /^\w+$/; - if (!rep.test(value)) { - callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆")); - } - } - }; - const validateApplicationType = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰鍚�")); - } else { - const rep = /^[\u4E00-\u9FA5]{2,4}$/; - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕"); - } - } - }; - const validatePhone = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欐墜鏈哄彿鐮�")); - } else { - const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/ - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜"); - } - } - }; - return { - myInterface: { - }, - createmyInterfaceRules: { - applicationName: [ - { required: true, trigger: "blur", validator: validateApplicationName}, - ], - applicationIconUrl: [ - { required: true, trigger: "blur", validator: validateApplicationIconUrl }, - ], - applicationType: [ - { required: true, trigger: "blur", validator: validateApplicationType }, - ], - websiteUrl: [ - { required: true, trigger: "blur" }, - ], - description: [ - { required: false, trigger: "blur" }, - ], - }, - } - }, - created() { - const that = this; - const {userInfo} = this; - this.myInterface = JSON.parse(JSON.stringify(userInfo)); - }, - methods: { - }, - props: ['updateFlag','userInfo'] -} -</script> -<style lang="scss" scoped> -.createmyInterface { - border-radius: 1px; - background-color: #09152f; - - main { - text-align: left; - padding: 0 55px; - background-color: #09152f; - - .mainContent { - display: flex; - justify-content: center; - padding-top: 50px; - - .iconBox { - display: flex; - - .upload { - display: flex; - align-items: flex-end; - - img { - width: 120px; - height: 120px; - border-radius: 4px; - } - } - - .iconView { - display: flex; - flex-direction: column; - margin-left: 30px; - justify-content: flex-end; - - img { - width: 70px; - height: 70px; - border-radius: 4px; - } - } - - .tip { - display: flex; - align-items: flex-end; - margin-left: 30px; - font-size: 12px; - - span { - line-height: 20px; - } - } - } - .optionBtn{ - &::v-deep .el-button{ - padding: 12px 40px; - } - .reset{ - border: 1px solid #0079fe; - color: #0079fe; - } - } - &::v-deep .el-form-item__label { - color: #4b9bb7; - } - - &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; - } - - .addPerson { - display: flex; - list-style: none; - padding: 0; - - li { - background-color: #cccccc; - width: 36px; - height: 36px; - border-radius: 50%; - color: #fff; - text-align: center; - font-size: 30px; - margin-left: 10px; - } - } - - .el-form-item__content { - width: 400px; - - .el-select { - width: 100%; - } - } - - .optionHandleSp { - display: flex; - - .areaNumber, - .moreNumber { - flex: 1; - } - - .telNumber { - flex: 2; - } - } - - } - } - - footer { - border-top: 1px solid #fff; - height: 80px; - display: flex; - align-items: center; - justify-content: flex-end; - padding-right: 20px; - } -} -</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/threepack/createUser/index.vue b/src/views/operate/baseSetting/threepack/createUser/index.vue new file mode 100644 index 0000000..b609337 --- /dev/null +++ b/src/views/operate/baseSetting/threepack/createUser/index.vue @@ -0,0 +1,195 @@ +<template> + <div class="createUser"> + <main> + <div class="mainContent"> + <el-form ref="user" label-width="140px" autoComplete="on" :model="things" label-position="right"> + <!-- 杩濊浜嬮」缂栧彿 --> + <el-form-item class="optionItem" label="杩濊浜嬮」缂栧彿:" prop="number"> + <el-input v-model="things.number" placeholder="璇峰~鍐欒繚瑙勪簨椤圭紪鍙�"></el-input> + </el-form-item> + <!-- 鎵�灞炵被鍨� --> + <el-form-item class="optionItems" label="鎵�灞炵被鍨�:" prop="typeThird"> + <el-select v-model="things.typeThird" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" > + <el-option v-for="item in typeThirdList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲ぇ绫� --> + <el-form-item class="optionItem" label="鎵�灞炲ぇ绫�:" prop="typeSecond"> + <el-select v-model="things.typeSecond" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" > + <el-option v-for="item in typeSecondList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲皬绫� --> + <el-form-item class="optionItem" label="鎵�灞炲皬绫�:" prop="typeFirst"> + <el-select v-model="things.typeFirst" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeFirstList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 妗堢敱 --> + <el-form-item class="optionItem" label="妗堢敱:" prop="type"> + <el-input type="textarea" autosize v-model="things.type" placeholder="璇疯緭鍏ユ鐢辨弿杩板唴瀹�" + :disabled="!updateFlag" disabled></el-input> + </el-form-item> + <el-form-item v-if="updateFlag"> + <div class="optionBtn"> + <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">纭 + </el-button> + </div> + </el-form-item> + </el-form> + + </div> + </main> + </div> +</template> +<script> +export default { + data() { + return { + things: { + number: 0, + type: '', + typeFirst: '', + typeSecond: '', + typeThird: '', + }, + roleList: [], + typeThirdList:[], + typeSecondList:[], + typeFirstList:[], + } + }, + created() { + console.log(this.userInfo); + this.things = JSON.parse(JSON.stringify(this.userInfo)); + // 鑾峰彇鎵�灞炵被鍨嬪垪琛� + this.getTypeThird(); + this.getTypeSecond(); + this.getTypeFirst(); + }, + methods: { + // handleUser() { + // this.$refs.user.validate((valid) => { + // if (valid) { + // const { role } = this; + // console.log(role); + // this.$axios.post('/sccg/role/update/' + role.id, { + // id: role.id, + // status: role.status, + // description: role.description, + // name: role.name, + // sort: 0 + // }).then(res => { + // this.$emit('changeDialog', { dialogUpdate: false }); + // this.getUserList(); + // }) + // } else { + // return false; + // } + // }) + // }, + // 鏌ヨ鎵�灞炵被鍨� + getTypeThird() { + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_first", + }) + .then(res => { + this.typeThirdList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲ぇ绫� + getTypeSecond(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_second", + }) + .then(res => { + this.typeSecondList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲皬绫� + getTypeFirst(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_third", + }) + .then(res => { + this.typeFirstList = res.data; + }) + } + }, + props: ['getUserList'] +} +</script> +<style lang="scss" scoped> +.createUser { + border-radius: 1px; + background-color: #09152f; + + main { + // border: 1px solid #fff; + text-align: left; + padding: 0 55px; + background-color: #09152f; + padding-bottom: 50px; + + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; + + .el-form-item__content { + width: 400px; + + .el-select { + width: 100%; + } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } + + } + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } +} +</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/threepack/index.vue b/src/views/operate/baseSetting/threepack/index.vue index 2dd231f..e8a0bce 100644 --- a/src/views/operate/baseSetting/threepack/index.vue +++ b/src/views/operate/baseSetting/threepack/index.vue @@ -1,94 +1,252 @@ <template> - <div class="otherInterface"> + <div class="userList"> + <div class="headerTitle"> + 杩愯惀绠$悊銆嬪熀纭�璁剧疆銆嬭繚瑙勪簨椤硅缃� + </div> <header> - <div class="headerTitle">杩愯惀绠$悊 >> 鍩虹璁剧疆 > 闂ㄥ墠涓夊寘璁剧疆</div> + <div class="headerContent"> + <div class="search"> + <span>绛涢�夋潯浠�:</span> + <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="context"></el-input> + <div class="findBtn"> + <el-button type="primary" @click="getUserList">鏌ヨ</el-button> + </div> + </div> + <div class="addUser"> + <el-button class="addBtn" type="primary" @click="dialogCreate = true">鏂板缓瑙掕壊</el-button> + <!-- <el-dialog :visible.sync="dialogCreate" title="鏂板瑙掕壊" width="45%" v-if="dialogCreate" + :before-close="handleClose"> + <createUser :refresh="getUserList" /> + </el-dialog> --> + </div> + </div> </header> <main> - <div class="mainHeader"> - <span>绛涢�夋潯浠�:</span> - <el-input placeholder="璇疯緭鍏ュ唴瀹�"></el-input> - </div> <div class="mainContent"> - <!-- @selection-change="handleSelectionChange" --> - <!-- 鏁版嵁娓叉煋 --> - <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%" + <!-- 鏁版嵁灞曠ず --> + <el-table ref="multipleTable" :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" - :row-class-name="tableRowClassName"> - <el-table-column type="selection" width="55"> + :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 label="缂栧彿" prop="applicationName" min-width="10"> + <el-table-column prop="number" label="杩濊浜嬮」缂栧彿" min-width="10"> </el-table-column> - <el-table-column prop="applicationType" label="鎵�灞炵被鍨�" min-width="10"> + <el-table-column prop="typeThird" label="鎵�灞炵被鍨�" min-width="10"> </el-table-column> - <el-table-column prop="websiteUrl" label="鎵�灞炵被鍒�" min-width="20"> + <el-table-column prop="typeSecond" label="鎵�灞炲ぇ绫�" min-width="10"> </el-table-column> - <el-table-column label="鎿嶄綔" min-width="10"> + <el-table-column prop="typeFirst" label="鎵�灞炲皬绫�" min-width="10"> + </el-table-column> + <el-table-column prop="type" label="妗堢敱" min-width="45"> + </el-table-column> + <el-table-column prop="operation" label="鎿嶄綔" min-width="10"> <template slot-scope="scope"> - <span @click="handleView(scope.row)">鏌ョ湅</span> - <span class="line">|</span> - <span @click="handleDelete(scope.row)">鍒犻櫎</span> + <div class="operation"> + <span @click="handleFind(scope.row)">鏌ョ湅</span> + <span class="line">|</span> + <span @click="handleDelete(scope.row)">鍒犻櫎</span> + </div> </template> </el-table-column> </el-table> - <!-- 鍒嗛〉 --> - <!-- <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> --> + <!-- 鏌ョ湅淇敼椤甸潰 --> + <el-dialog :visible.sync="dialogUpdate" width="45%" :title="updateFlag ? '鏉冮檺璁剧疆' :'鏌ョ湅瑙掕壊淇℃伅'" + v-if="dialogUpdate" :before-close="handleClose"> + <updateUser :updateFlag="updateFlag" :userInfo=userInfo + :getUserList=" context ? getUserList : getUserList" @changeDialog="changeDialog" /> + </el-dialog> + <!-- tools --> + <div class="tools"> + <div class="funs"> + <div class="funsItem"> + <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> + </div> + <div class="funsItem"> + <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> + </div> + <div class="funsItem"> + <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange"> + <el-option v-for="item in options" :key="item.value" :label="item.label" + :value="item.value" :disabled="item.disabled"> + </el-option> + </el-select> + </div> + </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> </main> - <footer> - <!-- 鍒涘缓寮圭獥 --> - <el-dialog :visible.sync="dialogCreate" title="鏂板绗笁鏂规帴鍙�" width="45%" v-if="dialogCreate" - :before-close="handleClose"> - <createInterface /> - </el-dialog> - <!-- 鏌ョ湅寮圭獥 --> - <el-dialog :visible.sync="dialogUpdate" :title="updateFlag ?'淇敼绗笁鏂规帴鍙�':'鏌ョ湅绗笁鏂规帴鍙�'" width="45%" - v-if="dialogUpdate" :before-close="handleClose"> - <viewInterface :updateFlag="updateFlag" :userInfo=userInfo /> - </el-dialog> - </footer> </div> </template> <script> -import createInterface from './components/createInterface'; -import viewInterface from './components/viewInterface' +import updateUser from "./updateUser" +import createUser from "./createUser" export default { components: { - createInterface, viewInterface + updateUser,createUser }, data() { return { tableData: [], - search: "", + context: "", dialogCreate: false, dialogUpdate: false, updateFlag: false, userInfo: '', - // totalNum: 200, - // pageSize: 10, - // currentPage: 1, + totalNum: null, + pageSize: 10, + currentPage: 1, + all: false, + unsame: false, + myIdx: 0, + options: [ + { + value: 0, + label: '鎵归噺鎿嶄綔', + disabled: true, + }, + { + value: 1, + label: '鎵归噺鍚敤', + }, + { + value: 2, + label: '鎵归噺绂佺敤', + }, + { + value: 3, + label: '鎵归噺鍒犻櫎', + } + ], + tempList: [] } }, created() { this.getUserList(); }, methods: { - // 鑾峰彇鎺ュ彛鍒楄〃 - getUserList() { - const that = this; - // const { currentPage, pageSize, search } = this; - this.dialogCreate = false; - this.$axios.get("sccg/system/portal/thirdApp/search").then(res => { - const { code, data } = res; - if (code == 200) { - this.tableData = data; - } + // 鎵归噺鍒犻櫎 + mulDelete(idArr){ + console.log(idArr); + this.$axios({ + method:'delete', + url:'sccg/violations/batch_delete?ids='+idArr, + }).then(res=>{ + this.getUserList(); + this.$message({ + message:res.message, + type:res.code === 200 ? 'success' : 'warning' + }) }) }, + // 鎵ц涓嬫媺妗嗘搷浣� + selectChange(val) { + let ids = []; + this.tempList.forEach(item => { + ids.push(item.number); + }) + if (ids.length !== 0) { + if (val === 3) { + this.mulDelete(ids); + } + } else { + this.$message({ + type: 'warning', + message: '鎮ㄨ繕娌¢�変腑浠讳綍鏁版嵁', + }) + } + }, + // 鐩戝惉琛ㄦ牸閫変腑鐘舵�� + tableChange(list) { + this.tempList = list; + if (list.length === this.tableData.length) { + this.all = true; + } else { + this.all = false + } + }, + // 鍏ㄩ�� + selectAll() { + this.$refs.multipleTable.toggleAllSelection(); + }, + // 鍙嶉�� + disSame(list) { + list.forEach(row => { + this.$refs.multipleTable.toggleRowSelection(row) + }) + }, + // 鍒犻櫎鍗曟潯鏁版嵁 + handleDelete({ number }) { + console.log(number); + this.$confirm('纭鍒犻櫎锛�') + .then(_ => { + console.log(1); + this.$axios({ + method: 'delete', + url: `sccg/violations/delete?id=${number}`, + }) + .then(res => { + console.log(res); + this.$message({ + type: res.code === 200 ? 'success' : 'warning', + message: res.message + }) + + this.getUserList(); + }) + }) + .catch(_ => { console.log(2) }); + }, + // 鑾峰彇鐢ㄦ埛鍒楄〃 + getUserList() { + const { currentPage, pageSize, context } = this; + // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭� + this.$axios({ + method: 'get', + url: `sccg/violations/query?current=${currentPage}&size=${pageSize}&keyWord=${context}`, + }) + .then(res => { + this.tableData = res.data.records; + this.totalNum = res.data.total; + }) + }, + // search() { + // const that = this; + // const { currentPage, pageSize, context } = this; + // // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭� + // if (context == '') { + // this.$axios.get('sccg/role/list?keyword=' + '&pageNum=' + currentPage + '&pageSize=' + pageSize).then(res => { + // if (res.code === 200) { + // console.log(res); + // res.data.list.forEach(item => { + // // item.createTime = helper(item.createTime); + // item.status == 1 ? item.status = true : item.status = false; + // }) + // that.tableData = res.data.list; + // this.totalNum = res.data.list.length; + // } + // }) + // } else { + // this.$axios({ + // method: 'get', + // url: 'sccg/role/list?keyword=' + context + '&pageNum=' + currentPage + '&pageSize=' + pageSize, + // }).then(res => { + // if (res.code === 200) { + // res.data.list.forEach(item => { + // item.status == 1 ? item.status = true : item.status = false; + // }) + // that.tableData = res.data.list + // this.totalNum = res.data.list.length; + // } + // }) + // } + // }, // 璁剧疆琛ㄦ牸鏂戦┈绾� tableRowClassName({ row, rowIndex }) { if ((rowIndex + 1) % 2 == 0) { @@ -98,149 +256,276 @@ } return ''; }, - // 鎵撳紑鏂板鐣岄潰 - handleAdd() { - this.dialogCreate = true; + // 鏌ョ湅鐢ㄦ埛淇℃伅(涓嶅彲淇敼) + handleFind(rowData) { + this.dialogUpdate = true; + this.updateFlag = false; + this.userInfo = rowData; }, - // 鍒涘缓寮圭獥鍏抽棴 + // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� + changeCurrentPage(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓婁竴椤电偣鍑讳簨浠� + handlePrev(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓嬩竴椤电偣鍑讳簨浠� + handleNext(page) { + this.currentPage = page; + this.getUserList(); + }, + changeDialog(val) { + this.dialogUpdate = val.dialogUpdate; + console.log(val); + }, handleClose(done) { - const that = this; this.$confirm('纭鍏抽棴锛�') .then(_ => { - that.dialogCreate = false; + this.dialogCreate = false; + this.dialogUpdate = false; done(); }) .catch(_ => { }); - }, - // 鍒涘缓鏌ョ湅寮圭獥 - handleView(rowData) { - this.userInfo = rowData; - this.dialogUpdate = true; - }, - // 鍒犻櫎绗笁鏂规帴鍙� - handleDelete({ id }) { - console.log(id); - this.$axios.delete('sccg/system/portal/thirdApp/delete', { - params: { - id - } - }).then(res => { - console.log(res); - }) } - // // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� - // changeCurrentPage(page) { - // this.currentPage = page; - // this.getUserList(); - // }, - // // 涓婁竴椤电偣鍑讳簨浠� - // handlePrev(page) { - // this.currentPage = page; - // this.getUserList(); - // }, - // // 涓嬩竴椤电偣鍑讳簨浠� - // handleNext(page) { - // this.currentPage = page; - // this.getUserList(); - // }, } } </script> -<!-- sccg/system/portal/thirdApp/search --> <style lang="scss" scoped> -.otherInterface { +.userList { + text-align: left; + margin: 10px 20px; + color: #4b9bb7; + + .headerTitle { + line-height: 40px; + } + header { - display: flex; - line-height: 60px; - justify-content: space-between; - padding: 0 20px; - color: #4b9bb7; - &::v-deep .el-button { - background-color: #eb5d01; - border: none; - color: #fff; - border-radius: 20px; + background-color: #09152f; + border: 1pox solid #fff; + + .headerContent { + padding: 0 40px; + display: flex; + line-height: 100px; + justify-content: space-between; + align-items: center; + + .search { + display: flex; + justify-content: flex-start; + + span { + flex: 1; + } + + .el-input { + flex: 2; + color: #1d3f57; + + &::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + } + + } + + .findBtn { + line-height: 100px; + margin-left: 15px; + display: flex; + align-items: center; + margin-top: -2px; + + .el-button { + padding: 12px 25px; + border-radius: 20px; + } + } + + .addBtn { + background-color: #eb5d01; + border: none; + border-radius: 20px; + padding: 12px 30px; + } } } main { - padding: 10px 20px; + background-color: #09152f; + margin-top: 20px; + padding-bottom: 50px; + border: 1pox solid #fff; - .mainHeader { - padding-left: 20px; - display: flex; + .mainTitle { line-height: 60px; - color: #4b9bb7; - background-color: #09152f; - .el-input { - width: 180px; - height: 35px; - margin-left: 10px; + } - &::v-deep .el-input__inner { - background-color: #09152f; + .tools { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 20px; + + .funs { + display: flex; + + .funsItem { + line-height: 28px; + display: flex; + align-items: center; border: 1px solid #17324c; + border-radius: 4px; + font-size: 12px; + margin-left: 10px; + + .el-checkbox { + width: 80px; + padding: 0 10px; + } + + .el-select { + width: 120px; + } + + &::v-deep .el-input__inner { + border: none; + background-color: #09152f; + } + + &:hover { + border: 1px solid #4b9bb7; + } + + &:hover .el-checkbox { + color: #4b9bb7; + } + } + + } + + .pagination { + margin-top: 50px; + display: flex; + line-height: 50px; + justify-content: center; + + .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; + } } } } - .mainContent { - margin-top: 20px; - .el-table { + .el-table { + color: #4b9bb7; + font-size: 10px; + + &::v-deep .cell { + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + } + + &::v-deep .el-table__empty-block { + background-color: #09152f; + } + + &::v-deep .el-table__empty-block { color: #4b9bb7; - - &::v-deep .el-table__empty-block { - background-color: #06122c; - } - - &::v-deep .el-table__empty-text { - color: #4b9bb7; - } - - &::v-deep .warning-row { - background-color: #06122c; - } - - &::v-deep .success-row { - background-color: #071f39; - } } - .line { - padding: 0 5px; - // margin-top: -10px; + .operation { + display: flex; + + .line { + padding: 0 5px; + } + + span:hover { + cursor: pointer; + } } + } + + .el-table::v-deep .warning-row { + background: #06122c; + } + + .el-table::v-deep .success-row { + background: #071f39; + } + + &::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; } } - footer { + &::v-deep .el-dialog__header, + &::v-deep .el-dialog__body { + background-color: #06122c; + } - &::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__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__title { - color: #4b9bb7; - } + &::v-deep .el-dialog__close { + width: 20px; + height: 20px; + // color: #fff; + } - &::v-deep .el-dialog__close { - width: 20px; - height: 20px; - // color: #fff; - } - - &::v-deep .el-dialog__body { - padding: 0; - } + &::v-deep .el-dialog__body { + padding: 0; } } </style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/threepack/updateUser/index.vue b/src/views/operate/baseSetting/threepack/updateUser/index.vue new file mode 100644 index 0000000..5b0cf9a --- /dev/null +++ b/src/views/operate/baseSetting/threepack/updateUser/index.vue @@ -0,0 +1,195 @@ +<template> + <div class="updateUser"> + <main> + <div class="mainContent"> + <el-form ref="user" label-width="140px" autoComplete="on" :model="things" label-position="right"> + <!-- 杩濊浜嬮」缂栧彿 --> + <el-form-item class="optionItem" label="杩濊浜嬮」缂栧彿:" prop="number"> + <el-input v-model="things.number" placeholder="璇峰~鍐欒繚瑙勪簨椤圭紪鍙�" :disabled="!updateFlag"></el-input> + </el-form-item> + <!-- 鎵�灞炵被鍨� --> + <el-form-item class="optionItems" label="鎵�灞炵被鍨�:" prop="typeThird"> + <el-select v-model="things.typeThird" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeThirdList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲ぇ绫� --> + <el-form-item class="optionItem" label="鎵�灞炲ぇ绫�:" prop="typeSecond"> + <el-select v-model="things.typeSecond" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeSecondList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲皬绫� --> + <el-form-item class="optionItem" label="鎵�灞炲皬绫�:" prop="typeFirst"> + <el-select v-model="things.typeFirst" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeFirstList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 妗堢敱 --> + <el-form-item class="optionItem" label="妗堢敱:" prop="type"> + <el-input type="textarea" autosize v-model="things.type" placeholder="璇疯緭鍏ユ鐢辨弿杩板唴瀹�" + :disabled="!updateFlag" disabled></el-input> + </el-form-item> + <!-- <el-form-item v-if="updateFlag"> + <div class="optionBtn"> + <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">纭 + </el-button> + </div> + </el-form-item> --> + </el-form> + + </div> + </main> + </div> +</template> +<script> +export default { + data() { + return { + things: { + number: 0, + type: '', + typeFirst: '', + typeSecond: '', + typeThird: '', + }, + roleList: [], + typeThirdList:[], + typeSecondList:[], + typeFirstList:[], + } + }, + created() { + console.log(this.userInfo); + this.things = JSON.parse(JSON.stringify(this.userInfo)); + // 鑾峰彇鎵�灞炵被鍨嬪垪琛� + this.getTypeThird(); + this.getTypeSecond(); + this.getTypeFirst(); + }, + methods: { + // handleUser() { + // this.$refs.user.validate((valid) => { + // if (valid) { + // const { role } = this; + // console.log(role); + // this.$axios.post('/sccg/role/update/' + role.id, { + // id: role.id, + // status: role.status, + // description: role.description, + // name: role.name, + // sort: 0 + // }).then(res => { + // this.$emit('changeDialog', { dialogUpdate: false }); + // this.getUserList(); + // }) + // } else { + // return false; + // } + // }) + // }, + // 鏌ヨ鎵�灞炵被鍨� + getTypeThird() { + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_first", + }) + .then(res => { + this.typeThirdList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲ぇ绫� + getTypeSecond(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_second", + }) + .then(res => { + this.typeSecondList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲皬绫� + getTypeFirst(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_third", + }) + .then(res => { + this.typeFirstList = res.data; + }) + } + }, + props: ['userInfo', 'updateFlag', 'getUserList', 'changeDialog'] +} +</script> +<style lang="scss" scoped> +.updateUser { + border-radius: 1px; + background-color: #09152f; + + main { + // border: 1px solid #fff; + text-align: left; + padding: 0 55px; + background-color: #09152f; + padding-bottom: 50px; + + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; + + .el-form-item__content { + width: 400px; + + .el-select { + width: 100%; + } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } + + } + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } +} +</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/violation/components/createInterface/index.vue b/src/views/operate/baseSetting/violation/components/createInterface/index.vue deleted file mode 100644 index 1be774b..0000000 --- a/src/views/operate/baseSetting/violation/components/createInterface/index.vue +++ /dev/null @@ -1,260 +0,0 @@ -<template> - <div class="createmyInterface"> - <main> - <div class="mainContent"> - <el-form ref="user" label-width="140px" autoComplete="on" :model="myInterface" - :rules="createmyInterfaceRules" label-position="right"> - <!-- 搴旂敤鍚嶇О --> - <el-form-item label="搴旂敤鍚嶇О:" prop="applicationName"> - <el-input v-model="myInterface.applicationName" placeholder="濉啓搴旂敤鍚嶇О"></el-input> - </el-form-item> - <!-- 搴旂敤鍥炬爣 --> - <el-form-item label="搴旂敤鍥炬爣:" prop="applicationIconUrl"> - <div class="iconBox"> - <div class="upload"> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="iconView"> - <span>绀烘剰鍥�</span> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="tip"> - <span>鍙厑璁镐笂浼爅pg,jpeg,png,svg鏍煎紡鐨勫浘鐗囷紝寤鸿灏哄涓�105px*105px</span> - </div> - </div> - </el-form-item> - <!-- 搴旂敤绫诲瀷 --> - <el-form-item label="搴旂敤绫诲瀷:" prop="applicationType"> - <div class="optionItem"> - <el-radio-group v-model="myInterface.applicationType"> - <el-radio :label="1">缃戦〉搴旂敤</el-radio> - </el-radio-group> - </div> - </el-form-item> - <!--缃戠珯url --> - <el-form-item label="缃戠珯url:" prop="websiteUrl"> - <el-input v-model="myInterface.websiteUrl"></el-input> - </el-form-item> - <!-- 搴旂敤鎻忚堪 --> - <el-form-item label="搴旂敤鎻忚堪:" prop="description"> - <el-input v-model="myInterface.description" placeholder="璇峰~鍐欐弿杩�"></el-input> - </el-form-item> - <!-- 鎸夐挳 --> - <el-form-item> - <div class="optionBtn"> - <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">鎻愪氦 - </el-button> - <el-button class="btn reset">閲嶇疆</el-button> - </div> - </el-form-item> - </el-form> - </div> - </main> - </div> -</template> -<script> -export default { - data() { - const validateApplicationName = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰悕绉�")); - } - }; - const validateApplicationIconUrl = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�")); - } else { - const rep = /^\w+$/; - if (!rep.test(value)) { - callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆")); - } - } - }; - const validateApplicationType = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰鍚�")); - } else { - const rep = /^[\u4E00-\u9FA5]{2,4}$/; - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕"); - } - } - }; - const validatePhone = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欐墜鏈哄彿鐮�")); - } else { - const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/ - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜"); - } - } - }; - return { - myInterface: { - }, - createmyInterfaceRules: { - applicationName: [ - { required: true, trigger: "blur", validator: validateApplicationName}, - ], - applicationIconUrl: [ - { required: true, trigger: "blur", validator: validateApplicationIconUrl }, - ], - applicationType: [ - { required: true, trigger: "blur", validator: validateApplicationType }, - ], - websiteUrl: [ - { required: true, trigger: "blur" }, - ], - description: [ - { required: false, trigger: "blur" }, - ], - }, - } - }, - created() { - const that = this; - }, - methods: { - handleUser() { - const { myInterface } = this; - this.$axios.post('sccg/system/portal/thirdApp/add', { - websiteUrl:myInterface.websiteUrl, - applicationIconUrl:myInterface.applicationIconUrl, - applicationType:0, - description:myInterface.description, - applicationName:myInterface.applicationName - }).then(res => { - console.log(res); - // if (res.code === 200) { - // this.refresh(); - // } - }) - }, - }, - props: ['refresh'] -} -</script> -<style lang="scss" scoped> -.createmyInterface { - border-radius: 1px; - background-color: #09152f; - - main { - text-align: left; - padding: 0 55px; - background-color: #09152f; - padding-bottom: 50px; - .mainContent { - display: flex; - justify-content: center; - padding-top: 50px; - - .iconBox { - display: flex; - - .upload { - display: flex; - align-items: flex-end; - - img { - width: 120px; - height: 120px; - border-radius: 4px; - } - } - - .iconView { - display: flex; - flex-direction: column; - margin-left: 30px; - justify-content: flex-end; - - img { - width: 70px; - height: 70px; - border-radius: 4px; - } - } - - .tip { - display: flex; - align-items: flex-end; - margin-left: 30px; - font-size: 12px; - - span { - line-height: 20px; - } - } - } - .optionBtn{ - margin-top: 30px; - &::v-deep .el-button{ - padding: 12px 40px; - } - .reset{ - border: 1px solid #0079fe; - color: #0079fe; - } - } - &::v-deep .el-form-item__label { - color: #4b9bb7; - } - - &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; - } - - .addPerson { - display: flex; - list-style: none; - padding: 0; - - li { - background-color: #cccccc; - width: 36px; - height: 36px; - border-radius: 50%; - color: #fff; - text-align: center; - font-size: 30px; - margin-left: 10px; - } - } - - .el-form-item__content { - width: 400px; - - .el-select { - width: 100%; - } - } - - .optionHandleSp { - display: flex; - - .areaNumber, - .moreNumber { - flex: 1; - } - - .telNumber { - flex: 2; - } - } - - } - } - - footer { - border-top: 1px solid #fff; - height: 80px; - display: flex; - align-items: center; - justify-content: flex-end; - padding-right: 20px; - } -} -</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/violation/components/viewInterface/index.vue b/src/views/operate/baseSetting/violation/components/viewInterface/index.vue deleted file mode 100644 index 6b28ebb..0000000 --- a/src/views/operate/baseSetting/violation/components/viewInterface/index.vue +++ /dev/null @@ -1,246 +0,0 @@ -<template> - <div class="createmyInterface"> - <main> - <div class="mainContent"> - <el-form ref="user" label-width="140px" autoComplete="on" :model="myInterface" - :rules="createmyInterfaceRules" label-position="right"> - <!-- 搴旂敤鍚嶇О --> - <el-form-item label="搴旂敤鍚嶇О:" prop="applicationName"> - <el-input v-model="myInterface.applicationName" placeholder="濉啓搴旂敤鍚嶇О"></el-input> - </el-form-item> - <!-- 搴旂敤鍥炬爣 --> - <el-form-item label="搴旂敤鍥炬爣:" prop="applicationIconUrl"> - <div class="iconBox"> - <div class="upload"> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="iconView"> - <span>绀烘剰鍥�</span> - <img src="@/assets/imgs/user/default-avatar.jpg" alt=""> - </div> - <div class="tip"> - <span>鍙厑璁镐笂浼爅pg,jpeg,png,svg鏍煎紡鐨勫浘鐗囷紝寤鸿灏哄涓�105px*105px</span> - </div> - </div> - </el-form-item> - <!-- 搴旂敤绫诲瀷 --> - <el-form-item label="搴旂敤绫诲瀷:" prop="applicationType"> - <div class="optionItem"> - <el-radio-group v-model="myInterface.applicationType"> - <el-radio :label="1">缃戦〉搴旂敤</el-radio> - </el-radio-group> - </div> - </el-form-item> - <!--缃戠珯url --> - <el-form-item label="缃戠珯url:" prop="websiteUrl"> - <el-input v-model="myInterface.websiteUrl"></el-input> - </el-form-item> - <!-- 搴旂敤鎻忚堪 --> - <el-form-item label="搴旂敤鎻忚堪:" prop="description"> - <el-input v-model="myInterface.description" placeholder="璇峰~鍐欐弿杩�"></el-input> - </el-form-item> - <!-- 鎸夐挳 --> - <!-- <el-form-item> - <div class="optionBtn"> - <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">鎻愪氦 - </el-button> - <el-button class="btn reset">閲嶇疆</el-button> - </div> - </el-form-item> --> - </el-form> - </div> - </main> - </div> -</template> -<script> -export default { - data() { - const validateApplicationName = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰悕绉�")); - } - }; - const validateApplicationIconUrl = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�")); - } else { - const rep = /^\w+$/; - if (!rep.test(value)) { - callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆")); - } - } - }; - const validateApplicationType = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰鍚�")); - } else { - const rep = /^[\u4E00-\u9FA5]{2,4}$/; - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕"); - } - } - }; - const validatePhone = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欐墜鏈哄彿鐮�")); - } else { - const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/ - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜"); - } - } - }; - return { - myInterface: { - }, - createmyInterfaceRules: { - applicationName: [ - { required: true, trigger: "blur", validator: validateApplicationName}, - ], - applicationIconUrl: [ - { required: true, trigger: "blur", validator: validateApplicationIconUrl }, - ], - applicationType: [ - { required: true, trigger: "blur", validator: validateApplicationType }, - ], - websiteUrl: [ - { required: true, trigger: "blur" }, - ], - description: [ - { required: false, trigger: "blur" }, - ], - }, - } - }, - created() { - const that = this; - const {userInfo} = this; - this.myInterface = JSON.parse(JSON.stringify(userInfo)); - }, - methods: { - }, - props: ['updateFlag','userInfo'] -} -</script> -<style lang="scss" scoped> -.createmyInterface { - border-radius: 1px; - background-color: #09152f; - - main { - text-align: left; - padding: 0 55px; - background-color: #09152f; - - .mainContent { - display: flex; - justify-content: center; - padding-top: 50px; - - .iconBox { - display: flex; - - .upload { - display: flex; - align-items: flex-end; - - img { - width: 120px; - height: 120px; - border-radius: 4px; - } - } - - .iconView { - display: flex; - flex-direction: column; - margin-left: 30px; - justify-content: flex-end; - - img { - width: 70px; - height: 70px; - border-radius: 4px; - } - } - - .tip { - display: flex; - align-items: flex-end; - margin-left: 30px; - font-size: 12px; - - span { - line-height: 20px; - } - } - } - .optionBtn{ - &::v-deep .el-button{ - padding: 12px 40px; - } - .reset{ - border: 1px solid #0079fe; - color: #0079fe; - } - } - &::v-deep .el-form-item__label { - color: #4b9bb7; - } - - &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; - } - - .addPerson { - display: flex; - list-style: none; - padding: 0; - - li { - background-color: #cccccc; - width: 36px; - height: 36px; - border-radius: 50%; - color: #fff; - text-align: center; - font-size: 30px; - margin-left: 10px; - } - } - - .el-form-item__content { - width: 400px; - - .el-select { - width: 100%; - } - } - - .optionHandleSp { - display: flex; - - .areaNumber, - .moreNumber { - flex: 1; - } - - .telNumber { - flex: 2; - } - } - - } - } - - footer { - border-top: 1px solid #fff; - height: 80px; - display: flex; - align-items: center; - justify-content: flex-end; - padding-right: 20px; - } -} -</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/violation/createUser/index.vue b/src/views/operate/baseSetting/violation/createUser/index.vue new file mode 100644 index 0000000..b609337 --- /dev/null +++ b/src/views/operate/baseSetting/violation/createUser/index.vue @@ -0,0 +1,195 @@ +<template> + <div class="createUser"> + <main> + <div class="mainContent"> + <el-form ref="user" label-width="140px" autoComplete="on" :model="things" label-position="right"> + <!-- 杩濊浜嬮」缂栧彿 --> + <el-form-item class="optionItem" label="杩濊浜嬮」缂栧彿:" prop="number"> + <el-input v-model="things.number" placeholder="璇峰~鍐欒繚瑙勪簨椤圭紪鍙�"></el-input> + </el-form-item> + <!-- 鎵�灞炵被鍨� --> + <el-form-item class="optionItems" label="鎵�灞炵被鍨�:" prop="typeThird"> + <el-select v-model="things.typeThird" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" > + <el-option v-for="item in typeThirdList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲ぇ绫� --> + <el-form-item class="optionItem" label="鎵�灞炲ぇ绫�:" prop="typeSecond"> + <el-select v-model="things.typeSecond" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" > + <el-option v-for="item in typeSecondList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲皬绫� --> + <el-form-item class="optionItem" label="鎵�灞炲皬绫�:" prop="typeFirst"> + <el-select v-model="things.typeFirst" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeFirstList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 妗堢敱 --> + <el-form-item class="optionItem" label="妗堢敱:" prop="type"> + <el-input type="textarea" autosize v-model="things.type" placeholder="璇疯緭鍏ユ鐢辨弿杩板唴瀹�" + :disabled="!updateFlag" disabled></el-input> + </el-form-item> + <el-form-item v-if="updateFlag"> + <div class="optionBtn"> + <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">纭 + </el-button> + </div> + </el-form-item> + </el-form> + + </div> + </main> + </div> +</template> +<script> +export default { + data() { + return { + things: { + number: 0, + type: '', + typeFirst: '', + typeSecond: '', + typeThird: '', + }, + roleList: [], + typeThirdList:[], + typeSecondList:[], + typeFirstList:[], + } + }, + created() { + console.log(this.userInfo); + this.things = JSON.parse(JSON.stringify(this.userInfo)); + // 鑾峰彇鎵�灞炵被鍨嬪垪琛� + this.getTypeThird(); + this.getTypeSecond(); + this.getTypeFirst(); + }, + methods: { + // handleUser() { + // this.$refs.user.validate((valid) => { + // if (valid) { + // const { role } = this; + // console.log(role); + // this.$axios.post('/sccg/role/update/' + role.id, { + // id: role.id, + // status: role.status, + // description: role.description, + // name: role.name, + // sort: 0 + // }).then(res => { + // this.$emit('changeDialog', { dialogUpdate: false }); + // this.getUserList(); + // }) + // } else { + // return false; + // } + // }) + // }, + // 鏌ヨ鎵�灞炵被鍨� + getTypeThird() { + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_first", + }) + .then(res => { + this.typeThirdList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲ぇ绫� + getTypeSecond(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_second", + }) + .then(res => { + this.typeSecondList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲皬绫� + getTypeFirst(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_third", + }) + .then(res => { + this.typeFirstList = res.data; + }) + } + }, + props: ['getUserList'] +} +</script> +<style lang="scss" scoped> +.createUser { + border-radius: 1px; + background-color: #09152f; + + main { + // border: 1px solid #fff; + text-align: left; + padding: 0 55px; + background-color: #09152f; + padding-bottom: 50px; + + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; + + .el-form-item__content { + width: 400px; + + .el-select { + width: 100%; + } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } + + } + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } +} +</style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/violation/index.vue b/src/views/operate/baseSetting/violation/index.vue index 1bd09f4..e8a0bce 100644 --- a/src/views/operate/baseSetting/violation/index.vue +++ b/src/views/operate/baseSetting/violation/index.vue @@ -1,98 +1,252 @@ <template> - <div class="otherInterface"> + <div class="userList"> + <div class="headerTitle"> + 杩愯惀绠$悊銆嬪熀纭�璁剧疆銆嬭繚瑙勪簨椤硅缃� + </div> <header> - <div class="headerTitle">杩愯惀绠$悊 >> 鍩虹璁剧疆 > 杩濊浜嬮」璁剧疆</div> + <div class="headerContent"> + <div class="search"> + <span>绛涢�夋潯浠�:</span> + <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="context"></el-input> + <div class="findBtn"> + <el-button type="primary" @click="getUserList">鏌ヨ</el-button> + </div> + </div> + <div class="addUser"> + <el-button class="addBtn" type="primary" @click="dialogCreate = true">鏂板缓瑙掕壊</el-button> + <!-- <el-dialog :visible.sync="dialogCreate" title="鏂板瑙掕壊" width="45%" v-if="dialogCreate" + :before-close="handleClose"> + <createUser :refresh="getUserList" /> + </el-dialog> --> + </div> + </div> </header> <main> - <div class="mainHeader"> - <span>绛涢�夋潯浠�:</span> - <el-input placeholder="璇疯緭鍏ュ唴瀹�"></el-input> - </div> <div class="mainContent"> - <!-- @selection-change="handleSelectionChange" --> - <!-- 鏁版嵁娓叉煋 --> - <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%" + <!-- 鏁版嵁灞曠ず --> + <el-table ref="multipleTable" :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" - :row-class-name="tableRowClassName"> - <el-table-column type="selection" width="55"> + :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 label="杩濊浜嬮」缂栧彿" prop="applicationName" min-width="10"> + <el-table-column prop="number" label="杩濊浜嬮」缂栧彿" min-width="10"> </el-table-column> - <el-table-column prop="applicationType" label="鎵�灞炵被鍨�" min-width="10"> + <el-table-column prop="typeThird" label="鎵�灞炵被鍨�" min-width="10"> </el-table-column> - <el-table-column prop="websiteUrl" label="鎵�灞炲ぇ绫�" min-width="10"> + <el-table-column prop="typeSecond" label="鎵�灞炲ぇ绫�" min-width="10"> </el-table-column> - <el-table-column prop="description" label="鎵�灞炲皬绫�" min-width="10"> + <el-table-column prop="typeFirst" label="鎵�灞炲皬绫�" min-width="10"> </el-table-column> - <el-table-column prop="description" label="鎻忚堪(妗堢敱)" min-width="20"> + <el-table-column prop="type" label="妗堢敱" min-width="45"> </el-table-column> - <el-table-column label="鎿嶄綔" min-width="10"> + <el-table-column prop="operation" label="鎿嶄綔" min-width="10"> <template slot-scope="scope"> - <span @click="handleView(scope.row)">鏌ョ湅</span> - <span class="line">|</span> - <span @click="handleDelete(scope.row)">鍒犻櫎</span> + <div class="operation"> + <span @click="handleFind(scope.row)">鏌ョ湅</span> + <span class="line">|</span> + <span @click="handleDelete(scope.row)">鍒犻櫎</span> + </div> </template> </el-table-column> </el-table> - <!-- 鍒嗛〉 --> - <!-- <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> --> + <!-- 鏌ョ湅淇敼椤甸潰 --> + <el-dialog :visible.sync="dialogUpdate" width="45%" :title="updateFlag ? '鏉冮檺璁剧疆' :'鏌ョ湅瑙掕壊淇℃伅'" + v-if="dialogUpdate" :before-close="handleClose"> + <updateUser :updateFlag="updateFlag" :userInfo=userInfo + :getUserList=" context ? getUserList : getUserList" @changeDialog="changeDialog" /> + </el-dialog> + <!-- tools --> + <div class="tools"> + <div class="funs"> + <div class="funsItem"> + <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> + </div> + <div class="funsItem"> + <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> + </div> + <div class="funsItem"> + <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange"> + <el-option v-for="item in options" :key="item.value" :label="item.label" + :value="item.value" :disabled="item.disabled"> + </el-option> + </el-select> + </div> + </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> </main> - <footer> - <!-- 鍒涘缓寮圭獥 --> - <el-dialog :visible.sync="dialogCreate" title="鏂板绗笁鏂规帴鍙�" width="45%" v-if="dialogCreate" - :before-close="handleClose"> - <createInterface /> - </el-dialog> - <!-- 鏌ョ湅寮圭獥 --> - <el-dialog :visible.sync="dialogUpdate" :title="updateFlag ?'淇敼绗笁鏂规帴鍙�':'鏌ョ湅绗笁鏂规帴鍙�'" width="45%" - v-if="dialogUpdate" :before-close="handleClose"> - <viewInterface :updateFlag="updateFlag" :userInfo=userInfo /> - </el-dialog> - </footer> </div> </template> <script> -import createInterface from './components/createInterface'; -import viewInterface from './components/viewInterface' +import updateUser from "./updateUser" +import createUser from "./createUser" export default { components: { - createInterface, viewInterface + updateUser,createUser }, data() { return { tableData: [], - search: "", + context: "", dialogCreate: false, dialogUpdate: false, updateFlag: false, userInfo: '', - // totalNum: 200, - // pageSize: 10, - // currentPage: 1, + totalNum: null, + pageSize: 10, + currentPage: 1, + all: false, + unsame: false, + myIdx: 0, + options: [ + { + value: 0, + label: '鎵归噺鎿嶄綔', + disabled: true, + }, + { + value: 1, + label: '鎵归噺鍚敤', + }, + { + value: 2, + label: '鎵归噺绂佺敤', + }, + { + value: 3, + label: '鎵归噺鍒犻櫎', + } + ], + tempList: [] } }, created() { this.getUserList(); }, methods: { - // 鑾峰彇鎺ュ彛鍒楄〃 - getUserList() { - const that = this; - // const { currentPage, pageSize, search } = this; - this.dialogCreate = false; - this.$axios.get("sccg/system/portal/thirdApp/search").then(res => { - const { code, data } = res; - if (code == 200) { - this.tableData = data; - } + // 鎵归噺鍒犻櫎 + mulDelete(idArr){ + console.log(idArr); + this.$axios({ + method:'delete', + url:'sccg/violations/batch_delete?ids='+idArr, + }).then(res=>{ + this.getUserList(); + this.$message({ + message:res.message, + type:res.code === 200 ? 'success' : 'warning' + }) }) }, + // 鎵ц涓嬫媺妗嗘搷浣� + selectChange(val) { + let ids = []; + this.tempList.forEach(item => { + ids.push(item.number); + }) + if (ids.length !== 0) { + if (val === 3) { + this.mulDelete(ids); + } + } else { + this.$message({ + type: 'warning', + message: '鎮ㄨ繕娌¢�変腑浠讳綍鏁版嵁', + }) + } + }, + // 鐩戝惉琛ㄦ牸閫変腑鐘舵�� + tableChange(list) { + this.tempList = list; + if (list.length === this.tableData.length) { + this.all = true; + } else { + this.all = false + } + }, + // 鍏ㄩ�� + selectAll() { + this.$refs.multipleTable.toggleAllSelection(); + }, + // 鍙嶉�� + disSame(list) { + list.forEach(row => { + this.$refs.multipleTable.toggleRowSelection(row) + }) + }, + // 鍒犻櫎鍗曟潯鏁版嵁 + handleDelete({ number }) { + console.log(number); + this.$confirm('纭鍒犻櫎锛�') + .then(_ => { + console.log(1); + this.$axios({ + method: 'delete', + url: `sccg/violations/delete?id=${number}`, + }) + .then(res => { + console.log(res); + this.$message({ + type: res.code === 200 ? 'success' : 'warning', + message: res.message + }) + + this.getUserList(); + }) + }) + .catch(_ => { console.log(2) }); + }, + // 鑾峰彇鐢ㄦ埛鍒楄〃 + getUserList() { + const { currentPage, pageSize, context } = this; + // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭� + this.$axios({ + method: 'get', + url: `sccg/violations/query?current=${currentPage}&size=${pageSize}&keyWord=${context}`, + }) + .then(res => { + this.tableData = res.data.records; + this.totalNum = res.data.total; + }) + }, + // search() { + // const that = this; + // const { currentPage, pageSize, context } = this; + // // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭� + // if (context == '') { + // this.$axios.get('sccg/role/list?keyword=' + '&pageNum=' + currentPage + '&pageSize=' + pageSize).then(res => { + // if (res.code === 200) { + // console.log(res); + // res.data.list.forEach(item => { + // // item.createTime = helper(item.createTime); + // item.status == 1 ? item.status = true : item.status = false; + // }) + // that.tableData = res.data.list; + // this.totalNum = res.data.list.length; + // } + // }) + // } else { + // this.$axios({ + // method: 'get', + // url: 'sccg/role/list?keyword=' + context + '&pageNum=' + currentPage + '&pageSize=' + pageSize, + // }).then(res => { + // if (res.code === 200) { + // res.data.list.forEach(item => { + // item.status == 1 ? item.status = true : item.status = false; + // }) + // that.tableData = res.data.list + // this.totalNum = res.data.list.length; + // } + // }) + // } + // }, // 璁剧疆琛ㄦ牸鏂戦┈绾� tableRowClassName({ row, rowIndex }) { if ((rowIndex + 1) % 2 == 0) { @@ -102,149 +256,276 @@ } return ''; }, - // 鎵撳紑鏂板鐣岄潰 - handleAdd() { - this.dialogCreate = true; + // 鏌ョ湅鐢ㄦ埛淇℃伅(涓嶅彲淇敼) + handleFind(rowData) { + this.dialogUpdate = true; + this.updateFlag = false; + this.userInfo = rowData; }, - // 鍒涘缓寮圭獥鍏抽棴 + // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� + changeCurrentPage(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓婁竴椤电偣鍑讳簨浠� + handlePrev(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓嬩竴椤电偣鍑讳簨浠� + handleNext(page) { + this.currentPage = page; + this.getUserList(); + }, + changeDialog(val) { + this.dialogUpdate = val.dialogUpdate; + console.log(val); + }, handleClose(done) { - const that = this; this.$confirm('纭鍏抽棴锛�') .then(_ => { - that.dialogCreate = false; + this.dialogCreate = false; + this.dialogUpdate = false; done(); }) .catch(_ => { }); - }, - // 鍒涘缓鏌ョ湅寮圭獥 - handleView(rowData) { - this.userInfo = rowData; - this.dialogUpdate = true; - }, - // 鍒犻櫎绗笁鏂规帴鍙� - handleDelete({ id }) { - console.log(id); - this.$axios.delete('sccg/system/portal/thirdApp/delete', { - params: { - id - } - }).then(res => { - console.log(res); - }) } - // // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� - // changeCurrentPage(page) { - // this.currentPage = page; - // this.getUserList(); - // }, - // // 涓婁竴椤电偣鍑讳簨浠� - // handlePrev(page) { - // this.currentPage = page; - // this.getUserList(); - // }, - // // 涓嬩竴椤电偣鍑讳簨浠� - // handleNext(page) { - // this.currentPage = page; - // this.getUserList(); - // }, } } </script> -<!-- sccg/system/portal/thirdApp/search --> <style lang="scss" scoped> -.otherInterface { +.userList { + text-align: left; + margin: 10px 20px; + color: #4b9bb7; + + .headerTitle { + line-height: 40px; + } + header { - display: flex; - line-height: 60px; - justify-content: space-between; - padding: 0 20px; - color: #4b9bb7; - &::v-deep .el-button { - background-color: #eb5d01; - border: none; - color: #fff; - border-radius: 20px; + background-color: #09152f; + border: 1pox solid #fff; + + .headerContent { + padding: 0 40px; + display: flex; + line-height: 100px; + justify-content: space-between; + align-items: center; + + .search { + display: flex; + justify-content: flex-start; + + span { + flex: 1; + } + + .el-input { + flex: 2; + color: #1d3f57; + + &::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + } + + } + + .findBtn { + line-height: 100px; + margin-left: 15px; + display: flex; + align-items: center; + margin-top: -2px; + + .el-button { + padding: 12px 25px; + border-radius: 20px; + } + } + + .addBtn { + background-color: #eb5d01; + border: none; + border-radius: 20px; + padding: 12px 30px; + } } } main { - padding: 10px 20px; + background-color: #09152f; + margin-top: 20px; + padding-bottom: 50px; + border: 1pox solid #fff; - .mainHeader { - padding-left: 20px; - display: flex; + .mainTitle { line-height: 60px; - color: #4b9bb7; - background-color: #09152f; - .el-input { - width: 180px; - height: 35px; - margin-left: 10px; + } - &::v-deep .el-input__inner { - background-color: #09152f; + .tools { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 20px; + + .funs { + display: flex; + + .funsItem { + line-height: 28px; + display: flex; + align-items: center; border: 1px solid #17324c; + border-radius: 4px; + font-size: 12px; + margin-left: 10px; + + .el-checkbox { + width: 80px; + padding: 0 10px; + } + + .el-select { + width: 120px; + } + + &::v-deep .el-input__inner { + border: none; + background-color: #09152f; + } + + &:hover { + border: 1px solid #4b9bb7; + } + + &:hover .el-checkbox { + color: #4b9bb7; + } + } + + } + + .pagination { + margin-top: 50px; + display: flex; + line-height: 50px; + justify-content: center; + + .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; + } } } } - .mainContent { - margin-top: 20px; - .el-table { + .el-table { + color: #4b9bb7; + font-size: 10px; + + &::v-deep .cell { + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + } + + &::v-deep .el-table__empty-block { + background-color: #09152f; + } + + &::v-deep .el-table__empty-block { color: #4b9bb7; - - &::v-deep .el-table__empty-block { - background-color: #06122c; - } - - &::v-deep .el-table__empty-text { - color: #4b9bb7; - } - - &::v-deep .warning-row { - background-color: #06122c; - } - - &::v-deep .success-row { - background-color: #071f39; - } } - .line { - padding: 0 5px; - // margin-top: -10px; + .operation { + display: flex; + + .line { + padding: 0 5px; + } + + span:hover { + cursor: pointer; + } } + } + + .el-table::v-deep .warning-row { + background: #06122c; + } + + .el-table::v-deep .success-row { + background: #071f39; + } + + &::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; } } - footer { + &::v-deep .el-dialog__header, + &::v-deep .el-dialog__body { + background-color: #06122c; + } - &::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__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__title { - color: #4b9bb7; - } + &::v-deep .el-dialog__close { + width: 20px; + height: 20px; + // color: #fff; + } - &::v-deep .el-dialog__close { - width: 20px; - height: 20px; - // color: #fff; - } - - &::v-deep .el-dialog__body { - padding: 0; - } + &::v-deep .el-dialog__body { + padding: 0; } } </style> \ No newline at end of file diff --git a/src/views/operate/baseSetting/violation/updateUser/index.vue b/src/views/operate/baseSetting/violation/updateUser/index.vue new file mode 100644 index 0000000..5b0cf9a --- /dev/null +++ b/src/views/operate/baseSetting/violation/updateUser/index.vue @@ -0,0 +1,195 @@ +<template> + <div class="updateUser"> + <main> + <div class="mainContent"> + <el-form ref="user" label-width="140px" autoComplete="on" :model="things" label-position="right"> + <!-- 杩濊浜嬮」缂栧彿 --> + <el-form-item class="optionItem" label="杩濊浜嬮」缂栧彿:" prop="number"> + <el-input v-model="things.number" placeholder="璇峰~鍐欒繚瑙勪簨椤圭紪鍙�" :disabled="!updateFlag"></el-input> + </el-form-item> + <!-- 鎵�灞炵被鍨� --> + <el-form-item class="optionItems" label="鎵�灞炵被鍨�:" prop="typeThird"> + <el-select v-model="things.typeThird" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeThirdList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲ぇ绫� --> + <el-form-item class="optionItem" label="鎵�灞炲ぇ绫�:" prop="typeSecond"> + <el-select v-model="things.typeSecond" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeSecondList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲皬绫� --> + <el-form-item class="optionItem" label="鎵�灞炲皬绫�:" prop="typeFirst"> + <el-select v-model="things.typeFirst" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeFirstList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 妗堢敱 --> + <el-form-item class="optionItem" label="妗堢敱:" prop="type"> + <el-input type="textarea" autosize v-model="things.type" placeholder="璇疯緭鍏ユ鐢辨弿杩板唴瀹�" + :disabled="!updateFlag" disabled></el-input> + </el-form-item> + <!-- <el-form-item v-if="updateFlag"> + <div class="optionBtn"> + <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">纭 + </el-button> + </div> + </el-form-item> --> + </el-form> + + </div> + </main> + </div> +</template> +<script> +export default { + data() { + return { + things: { + number: 0, + type: '', + typeFirst: '', + typeSecond: '', + typeThird: '', + }, + roleList: [], + typeThirdList:[], + typeSecondList:[], + typeFirstList:[], + } + }, + created() { + console.log(this.userInfo); + this.things = JSON.parse(JSON.stringify(this.userInfo)); + // 鑾峰彇鎵�灞炵被鍨嬪垪琛� + this.getTypeThird(); + this.getTypeSecond(); + this.getTypeFirst(); + }, + methods: { + // handleUser() { + // this.$refs.user.validate((valid) => { + // if (valid) { + // const { role } = this; + // console.log(role); + // this.$axios.post('/sccg/role/update/' + role.id, { + // id: role.id, + // status: role.status, + // description: role.description, + // name: role.name, + // sort: 0 + // }).then(res => { + // this.$emit('changeDialog', { dialogUpdate: false }); + // this.getUserList(); + // }) + // } else { + // return false; + // } + // }) + // }, + // 鏌ヨ鎵�灞炵被鍨� + getTypeThird() { + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_first", + }) + .then(res => { + this.typeThirdList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲ぇ绫� + getTypeSecond(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_second", + }) + .then(res => { + this.typeSecondList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲皬绫� + getTypeFirst(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_third", + }) + .then(res => { + this.typeFirstList = res.data; + }) + } + }, + props: ['userInfo', 'updateFlag', 'getUserList', 'changeDialog'] +} +</script> +<style lang="scss" scoped> +.updateUser { + border-radius: 1px; + background-color: #09152f; + + main { + // border: 1px solid #fff; + text-align: left; + padding: 0 55px; + background-color: #09152f; + padding-bottom: 50px; + + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; + + .el-form-item__content { + width: 400px; + + .el-select { + width: 100%; + } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } + + } + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } +} +</style> \ No newline at end of file diff --git a/src/views/operate/disposal/casepool/pool/compenents/checkIn/index.vue b/src/views/operate/disposal/casepool/pool/compenents/checkIn/index.vue deleted file mode 100644 index 6de23ae..0000000 --- a/src/views/operate/disposal/casepool/pool/compenents/checkIn/index.vue +++ /dev/null @@ -1,173 +0,0 @@ -<template> - <div class="checkIn"> - <div class="form"> - <!-- :rules="createRoleRules" --> - <el-form ref="user" label-width="140px" autoComplete="on" :model="role" label-position="right"> - <div class="things"> - <div class="title">濉啓鍩虹淇℃伅</div> - <!-- 闂绫诲瀷 --> - <el-form-item class="optionItem" label="闂绫诲瀷:" prop="name"> - <el-select v-model="role.type" placeholder="杩濊"> - <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value" - :disabled="item.disabled"> - </el-option> - </el-select> - </el-form-item> - <!-- 澶х被鍚嶇О --> - <el-form-item class="optionItems" label="澶х被鍚嶇О:" prop="status"> - <el-select v-model="role.type" placeholder="璇烽�夋嫨澶х被鍚嶇О"> - <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value" - :disabled="item.disabled"> - </el-option> - </el-select> - </el-form-item> - <!-- 灏忕被鍚嶇О --> - <el-form-item class="optionItem" label="灏忕被鍚嶇О:" prop="description"> - <el-select v-model="role.type" placeholder="璇烽�夋嫨灏忕被鍚嶇О"> - <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value" - :disabled="item.disabled"> - </el-option> - </el-select> - </el-form-item> - <!-- 浜嬩欢绛夌骇 --> - <el-form-item class="optionItem" label="浜嬩欢绛夌骇:" prop="name"> - <el-select v-model="role.type" placeholder="璇烽�夋嫨妗堜欢绛夌骇"> - <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value" - :disabled="item.disabled"> - </el-option> - </el-select> - </el-form-item> - <!-- 妗堢敱 --> - <el-form-item class="optionItem" label="妗堢敱:" prop="name"> - <el-input v-model="role.name" placeholder="璇疯緭鍏ユ鐢�"></el-input> - </el-form-item> - <!-- 鎵�灞炲幙鍖� --> - <el-form-item class="optionItem" label="鎵�灞炲幙鍖�:" prop="name"> - <el-select v-model="role.type" placeholder="璇烽�夋嫨鎵�灞炲幙鍖�"> - <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value" - :disabled="item.disabled"> - </el-option> - </el-select> - </el-form-item> - <!-- 鎵�灞炵ぞ鍖� --> - <el-form-item class="optionItem" label="鎵�灞炵ぞ鍖�:" prop="name"> - <el-select v-model="role.type" placeholder="璇烽�夋嫨鎵�灞炵ぞ鍖�"> - <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value" - :disabled="item.disabled"> - </el-option> - </el-select> - </el-form-item> - <!-- 鎵�灞炶閬� --> - <el-form-item class="optionItem" label="鎵�灞炶閬�:" prop="name"> - <el-select v-model="role.type" placeholder="璇烽�夋嫨鎵�灞炶閬�"> - <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value" - :disabled="item.disabled"> - </el-option> - </el-select> - </el-form-item> - <!-- 浜嬪彂鍦扮偣 --> - <el-form-item class="optionItem" label="浜嬪彂鍦扮偣:" prop="name"> - <el-input v-model="role.name" placeholder="璇疯緭鍏ヤ簨鍙戝湴鐐硅缁嗕綅缃�"></el-input> - </el-form-item> - <!-- 鏄惁鍏宠仈鍟嗛摵 --> - <el-form-item class="optionItem" label="鏄惁鍏宠仈鍟嗛摵:" prop="name"> - <el-radio v-model="role.name"> - 鏄� - </el-radio> - <el-radio v-model="role.name"> - 鍚� - </el-radio> - </el-form-item> - <!-- 鍏宠仈鍟嗛摵鍚嶇О --> - <el-form-item class="optionItem" label="鍏宠仈鍟嗛摵鍚嶇О:" prop="name"> - <el-input v-model="role.name" placeholder="璇峰~鍐欏叧鑱斿晢閾哄悕绉�"></el-input> - </el-form-item> - <!-- 濉啓杞︾墝鍙� --> - <el-form-item class="optionItem" label="濉啓杞︾墝鍙�:" prop="name"> - <el-input v-model="role.name" placeholder="璇峰~鍐欒溅鐗屽彿"></el-input> - </el-form-item> - <!-- 闂鎻忚堪 --> - <el-form-item class="optionItem" label="闂鎻忚堪:" prop="name"> - <el-input v-model="role.name" placeholder="璇峰~鍐欏唴瀹�200瀛椾互鍐�"></el-input> - </el-form-item> - </div> - <div class="person"> - <div class="title">濉啓鍙嶆槧浜轰俊鎭�</div> - <!-- 鍙嶆槧浜� --> - <el-form-item class="optionItem" label="鍙嶆槧浜�:" prop="name"> - <el-input v-model="role.name"></el-input> - </el-form-item> - <!-- 鑱旂郴鏂瑰紡 --> - <el-form-item class="optionItems" label="鑱旂郴鏂瑰紡:" prop="status"> - <el-input v-model="role.name"></el-input> - </el-form-item> - <!-- 韬唤璇佸彿 --> - <el-form-item class="optionItem" label="韬唤璇佸彿:" prop="description"> - <el-input v-model="role.description"></el-input> - </el-form-item> - </div> - <el-form-item> - <div class="optionBtn"> - <el-button class="btn cancel">鍙栨秷</el-button> - <!-- @click.native.prevent="handleUser" --> - <el-button type="primary" class="btn submit">鎻愪氦 - </el-button> - </div> - </el-form-item> - </el-form> - </div> - <div class="map"> - <myMap></myMap> - </div> - </div> -</template> -<script> -import myMap from '@/components/map' -export default { - components: { - myMap, - }, - data() { - return { - role: { - - }, - createRoleRules: [ - - ], - typeList: [] - } - } -} -</script> -<style lang="scss" scoped> -.checkIn { - display: flex; - - .form { - flex: 1; - color: #4b9bb7; - .title { - line-height: 40px; - } - - &::v-deep .el-form-item__label { - color: #4b9bb7; - } - .el-form{ - .el-input{ - &::v-deep .el-input__inner{ - width: 60%; - } - } - } - &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; - } - } - .map{ - flex: 1; - } -} -</style> \ No newline at end of file diff --git a/src/views/operate/disposal/casepool/pool/createUser/ill/index.vue b/src/views/operate/disposal/casepool/pool/createUser/ill/index.vue new file mode 100644 index 0000000..e894c43 --- /dev/null +++ b/src/views/operate/disposal/casepool/pool/createUser/ill/index.vue @@ -0,0 +1,3 @@ +<template> + <div>2</div> +</template> \ No newline at end of file diff --git a/src/views/operate/disposal/casepool/pool/createUser/index.vue b/src/views/operate/disposal/casepool/pool/createUser/index.vue new file mode 100644 index 0000000..f812cab --- /dev/null +++ b/src/views/operate/disposal/casepool/pool/createUser/index.vue @@ -0,0 +1,61 @@ +<template> + <div class="createUser"> + <div class="chooseArea" v-if="flag"> + <el-button type="primary" @click="toShow(0,'杩濊')">杩濊鐧昏</el-button> + <el-button type="primary" @click="toShow(1,'杩濆缓')">杩濆缓鐧昏</el-button> + </div> + <div class="inputArea" v-else> + <MyIll v-if="index===0" /> + <MyVio v-else /> + </div> + </div> +</template> +<script> +import MyVio from './vio'; +import MyIll from './ill'; +export default { + components: { + MyIll, MyVio + }, + data() { + return { + flag: true, + index: 0,//0:杩濊,1:杩濆缓 + } + }, + created() { + + }, + methods: { + toShow(idx, lab) { + this.$confirm('鎮ㄧ‘瀹氳鍘讳笂鎶�' + lab + '浜嬩欢') + .then(_ => { + console.log(1); + this.index = idx; + this.flag = false; + }) + .catch(_ => { console.log('err') }); + } + }, +} +</script> +<style lang="scss" scoped> +.chooseArea { + display: flex; + flex-direction: column; + align-items: center; + padding-top: 50px; + padding-bottom: 80px; + + .el-button { + width: 120px; + line-height: 40px; + padding: 0; + margin-top: 20px; + } + + .el-button+.el-button { + margin-left: 0; + } +} +</style> \ No newline at end of file diff --git a/src/views/operate/disposal/casepool/pool/createUser/vio/index.vue b/src/views/operate/disposal/casepool/pool/createUser/vio/index.vue new file mode 100644 index 0000000..d0ef7c6 --- /dev/null +++ b/src/views/operate/disposal/casepool/pool/createUser/vio/index.vue @@ -0,0 +1,3 @@ +<template> + <div>1</div> +</template> \ No newline at end of file diff --git a/src/views/operate/disposal/casepool/pool/index.vue b/src/views/operate/disposal/casepool/pool/index.vue index 880b410..c0edcb2 100644 --- a/src/views/operate/disposal/casepool/pool/index.vue +++ b/src/views/operate/disposal/casepool/pool/index.vue @@ -1,122 +1,296 @@ <template> - <div class="casepool"> - <!-- 鏌ヨ娣诲姞 --> + <div class="userList"> <header> - <div class="search"> - <span>鏉ユ簮鏌ヨ锛�</span> - <el-input placeholder="璇疯緭鍏ラ棶棰樻潵婧�"></el-input> - </div> - <div class="add"> - <el-button type="primary" icon="el-icon-plus" @click="handleOpenDialog">娣诲姞</el-button> + <div class="headerContent"> + <div class="search"> + <span>鏉ユ簮鏌ヨ:</span> + <el-input placeholder="璇疯緭鍏ラ棶棰樻潵婧�" v-model="context"></el-input> + <div class="findBtn"> + <el-button type="primary" @click="getUserList">鏌ヨ</el-button> + </div> + </div> + <div class="addUser"> + <el-button class="addBtn" type="primary" @click="dialogCreate = true">娣诲姞</el-button> + <el-dialog :before-close="handleClose" :visible.sync="dialogCreate" title="璇烽�夋嫨涓婃姤浜嬩欢绫诲瀷" width="45%" v-if="dialogCreate"> + <createUser /> + </el-dialog> + </div> </div> </header> - <!-- 涓讳綋灞曠ず --> <main> <div class="mainContent"> <!-- 瀵艰埅鐘舵�佹爣绛� --> <div class="nav"> - <el-tabs type="border-card"> - <el-tab-pane :label="item.name" v-for="item in tagList" :key="item.name"></el-tab-pane> - </el-tabs> - <!-- 鏁版嵁娓叉煋 --> - <el-table ref="multipleTable" - :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" - :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> - <el-table-column type="selection" min-width="5"> - </el-table-column> - <el-table-column label="浜嬩欢缂栧彿" min-width="6"> - <template slot-scope="scope">{{ scope.row.id }}</template> - </el-table-column> - <el-table-column prop="source" label="闂鏉ユ簮" min-width="10"> - </el-table-column> - <el-table-column prop="bigKind" label="澶х被鍚嶇О" min-width="6"> - </el-table-column> - <el-table-column prop="samllKind" label="灏忕被鍚嶇О" min-width="6"> - </el-table-column> - <el-table-column prop="reson" label="妗堢敱" min-width="10"> - </el-table-column> - <el-table-column prop="location" label="鎶ヨ鐐逛綅" min-width="10"> - </el-table-column> - <el-table-column prop="area" label="鎵�灞炲尯鍩�" min-width="10"> - </el-table-column> - <el-table-column prop="appendTime" label="鎶ヨ鏃堕棿" min-width="10"> - </el-table-column> - <el-table-column prop="duration" label="鎸佺画鏃堕棿" min-width="6"> - </el-table-column> - <el-table-column prop="operation" label="鎿嶄綔" min-width="15"> - <template slot-scope="scope"> - <div class="operation"> - <span @click="handleFind(scope.row)">涓婃姤</span> - <span class="line">|</span> - <span @click="handleUpdate(scope.row)">璋冨害</span> - <span class="line">|</span> - <span>鍐嶅涔�</span> - <span class="line">|</span> - <span>鏆備笉澶勭悊</span> - </div> - </template> - </el-table-column> - </el-table> + <div @click="changeNavChecked(index)" :class="[item.checked ? 'is-active':'','nav-item']" + v-for="(item,index) in tagList" :key="item.name">{{item.name}}</div> + </div> + <div class="type-nav"> + <div @click="changeTypeChecked(index)" v-for="(item,index) in typeList" :key="item.name" + :class="[item.checked ? 'is-active':'','type-item']">{{item.name}}</div> + </div> + <!-- 鏁版嵁灞曠ず --> + <el-table ref="multipleTable" + :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','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="number" label="浜嬩欢缂栧彿" min-width="10"> + </el-table-column> + <el-table-column prop="typeThird" label="闂鏉ユ簮" min-width="10"> + </el-table-column> + <el-table-column prop="typeSecond" label="澶х被鍚嶇О" min-width="10"> + </el-table-column> + <el-table-column prop="typeFirst" label="灏忕被鍚嶇О" min-width="10"> + </el-table-column> + <el-table-column prop="type" label="妗堢敱" min-width="10"> + </el-table-column> + <el-table-column prop="type" label="鎶ヨ鐐逛綅" min-width="10"> + </el-table-column> + <el-table-column prop="type" label="鎵�灞炲尯鍩�" min-width="10"> + </el-table-column> + <el-table-column prop="type" label="鎶ヨ鏃堕棿" min-width="10"> + </el-table-column> + <el-table-column prop="type" label="鎸佺画鏃堕棿" min-width="10"> + </el-table-column> + <el-table-column prop="operation" label="鎿嶄綔" min-width="20"> + <template slot-scope="scope"> + <div class="operation"> + <span @click="handleFind(scope.row)">涓婃姤</span> + <span class="line">|</span> + <span @click="handleDelete(scope.row)">璋冨害</span> + <span class="line">|</span> + <span @click="handleDelete(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%" :title="updateFlag ? '鏉冮檺璁剧疆' :'鏌ョ湅瑙掕壊淇℃伅'" + v-if="dialogUpdate" :before-close="handleClose"> + <updateUser :updateFlag="updateFlag" :userInfo=userInfo + :getUserList=" context ? getUserList : getUserList" @changeDialog="changeDialog" /> + </el-dialog> + <!-- tools --> + <div class="tools"> + <div class="funs"> + <div class="funsItem"> + <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> + </div> + <div class="funsItem"> + <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> + </div> + <div class="funsItem"> + <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange"> + <el-option v-for="item in options" :key="item.value" :label="item.label" + :value="item.value" :disabled="item.disabled"> + </el-option> + </el-select> + </div> + </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> </main> - <!-- 缁勪欢鍖� --> - <footer> - <el-dialog v-if="visible" :visible.async="visible" title="闂鐧昏" width="60%" :before-close="handleClose"> - <checkIn></checkIn> - </el-dialog> - </footer> </div> </template> <script> -import checkIn from './compenents/checkIn'; +import updateUser from "./updateUser" +import createUser from "./createUser" export default { components: { - checkIn, + updateUser, createUser }, data() { return { + tableData: [], + context: "", + dialogCreate: false, + dialogUpdate: false, + updateFlag: false, + userInfo: '', + totalNum: null, + pageSize: 10, + currentPage: 1, + all: false, + unsame: false, + myIdx: 0, + options: [ + { + value: 0, + label: '鎵归噺鎿嶄綔', + disabled: true, + }, + { + value: 1, + label: '鎵归噺鍚敤', + }, + { + value: 2, + label: '鎵归噺绂佺敤', + }, + { + value: 3, + label: '鎵归噺鍒犻櫎', + } + ], + tempList: [], tagList: [ { name: '寰呭鐞�', - value: 0, + value: 7, + checked: true }, { name: '宸蹭笂鎶�', - value: 0, + value: 1, + checked: false }, { name: '宸茶皟搴�', - value: 0, + value: 3, + checked: false }, { name: '鍦ㄥ涔�', - value: 0, + value: 4, + checked: false }, { name: '鏆備笉澶勭悊', - value: 0, + value: 4, + checked: false }, + ], + typeList: [ { name: '杩濊', - value: 0, + value: 1, + checked: true }, { name: '杩濆缓', - value: 0, + value: 2, + checked: false, }, ], - tableData: [ - { - id: 13413114, - source: '浜哄伐涓婃姤/瑙嗛宸℃煡', - appendTime: '2022-01-09 14:52' - } - ], - visible: false, + mystatus:0, + statusArr:[], } }, + created() { + this.tagList.forEach(item => { + if (item.checked) { + this.statusArr[0] = item.value; + } + }) + this.typeList.forEach(item => { + if (item.checked) { + this.statusArr[1] = item.value; + } + }) + // this.getUserList(); + }, methods: { + // 鎵归噺鍒犻櫎 + mulDelete(idArr) { + console.log(idArr); + // this.$axios({ + // method: 'delete', + // url: 'sccg/violations/batch_delete?ids=' + idArr, + // }).then(res => { + // this.getUserList(); + // this.$message({ + // message: res.message, + // type: res.code === 200 ? 'success' : 'warning' + // }) + // }) + }, + // 鎵ц涓嬫媺妗嗘搷浣� + selectChange(val) { + let ids = []; + this.tempList.forEach(item => { + ids.push(item.number); + }) + if (ids.length !== 0) { + if (val === 3) { + this.mulDelete(ids); + } + } else { + this.$message({ + type: 'warning', + message: '鎮ㄨ繕娌¢�変腑浠讳綍鏁版嵁', + }) + } + }, + // 鐩戝惉琛ㄦ牸閫変腑鐘舵�� + tableChange(list) { + this.tempList = list; + if (list.length === this.tableData.length) { + this.all = true; + } else { + this.all = false + } + }, + // 鍏ㄩ�� + selectAll() { + this.$refs.multipleTable.toggleAllSelection(); + }, + // 鍙嶉�� + disSame(list) { + list.forEach(row => { + this.$refs.multipleTable.toggleRowSelection(row) + }) + }, + // 鍒犻櫎鍗曟潯鏁版嵁 + handleDelete({ number }) { + console.log(number); + this.$confirm('纭鍒犻櫎锛�') + .then(_ => { + console.log(1); + // this.$axios({ + // method: 'delete', + // url: `sccg/violations/delete?id=${number}`, + // }) + // .then(res => { + // console.log(res); + // this.$message({ + // type: res.code === 200 ? 'success' : 'warning', + // message: res.message + // }) + + // this.getUserList(); + // }) + }) + .catch(_ => { console.log(2) }); + }, + // 鑾峰彇鐢ㄦ埛鍒楄〃 + getUserList() { + const { currentPage, pageSize, context, statusArr } = this; + console.log(statusArr); + this.$axios({ + method: 'get', + url: `sccg/base-case/query/${statusArr[1]}?status=` + statusArr[0] + }).then(res => { + console.log(res); + }) + // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭� + // this.$axios({ + // method: 'get', + // url: `sccg/violations/query?current=${currentPage}&size=${pageSize}&keyWord=${context}`, + // }) + // .then(res => { + // this.tableData = res.data.records; + // this.totalNum = res.data.total; + // }) + }, // 璁剧疆琛ㄦ牸鏂戦┈绾� tableRowClassName({ row, rowIndex }) { if ((rowIndex + 1) % 2 == 0) { @@ -126,141 +300,309 @@ } return ''; }, - // 鎵撳紑娣诲姞椤� - handleOpenDialog() { - this.visible = true; + // 鏌ョ湅鐢ㄦ埛淇℃伅(涓嶅彲淇敼) + handleFind(rowData) { + this.dialogUpdate = true; + this.updateFlag = false; + this.userInfo = rowData; }, - // 鍏抽棴瀵硅瘽妗� + // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� + changeCurrentPage(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓婁竴椤电偣鍑讳簨浠� + handlePrev(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓嬩竴椤电偣鍑讳簨浠� + handleNext(page) { + this.currentPage = page; + this.getUserList(); + }, + changeDialog(val) { + this.dialogUpdate = val.dialogUpdate; + console.log(val); + }, handleClose(done) { this.$confirm('纭鍏抽棴锛�') .then(_ => { - this.visible = false; + this.dialogCreate = false; + this.dialogUpdate = false; done(); }) .catch(_ => { }); - } + }, + // 鏇存敼涓�绾ф爣绛剧殑閫変腑 + changeNavChecked(idx) { + this.tagList.forEach((item, index) => { + if (index === idx) { + item.checked = true; + } else { + item.checked = false; + } + }) + this.typeList[0].checked = true; + this.typeList[1].checked = false; + }, + // 鏇存敼杩濊/杩濆缓 + changeTypeChecked(idx) { + this.typeList.forEach((item, index) => { + if (index === idx) { + item.checked = true; + } else { + item.checked = false; + } + }) + }, } } </script> <style lang="scss" scoped> -.casepool { +.userList { text-align: left; + margin: 10px 20px; color: #4b9bb7; header { - display: flex; - justify-content: space-between; - padding: 0 20px; - line-height: 60px; + background-color: #09152f; + border: 1pox solid #fff; - .search { + .headerContent { + padding: 0 40px; display: flex; + line-height: 100px; + justify-content: space-between; + align-items: center; - span { - flex: 2; + .search { + display: flex; + justify-content: flex-start; + + span { + flex: 1; + } + + .el-input { + flex: 2; + color: #1d3f57; + + &::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + } + } - .el-input { - flex: 5; + .findBtn { + line-height: 100px; + margin-left: 15px; + display: flex; + align-items: center; + margin-top: -2px; - &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; + .el-button { + padding: 12px 25px; + border-radius: 20px; } } - } - .add { - .el-button { + .addBtn { background-color: #eb5d01; border: none; border-radius: 20px; + padding: 12px 30px; } } } main { - .mainContent { - .nav { - &::v-deep .el-tabs--border-card { - border: none; - } + background-color: #09152f; + margin-top: 20px; + padding-bottom: 50px; + border: 1pox solid #fff; - &::v-deep .el-tabs--border-card>.el-tabs__content { - background-color: #09152f; - } - - &::v-deep .el-tabs__nav-scroll { - background-color: #09152f; - } - - &::v-deep .el-tabs__header { - line-height: 60px; - } - - &::v-deep .el-tabs--border-card>.el-tabs__header .el-tabs__item { - color: #fff; - } - - &::v-deep .el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active { - color: #4b9bb7; - background-color: #071f39; - border: none; - } - - .el-table { - font-size: 12px; - color: #4b9bb7; - - .line { - padding: 0 5px; - } - } - - &::v-deep .el-table__empty-block { - background-color: #09152f; - color: #4b9bb7; - } - - .el-table::v-deep .warning-row { - background: #06122c; - } - - .el-table::v-deep .success-row { - background: #071f39; - } - } - } - } - - footer { - - &::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; + .mainTitle { line-height: 60px; } - &::v-deep .el-dialog__title { + padding: 10px; + + .nav { + display: flex; + line-height: 40px; + + .nav-item { + width: 80px; + text-align: center; + + &:hover { + cursor: pointer; + } + } + + .is-active { + background-color: #070f22; + color: #fff; + } + } + + .type-nav { + display: flex; + line-height: 40px; + margin-left: 30px; + margin-top: 2px; + + .type-item { + width: 80px; + text-align: center; + + &:hover { + cursor: pointer; + } + } + + .is-active { + background-color: #070f22; + border-radius: 4px; + color: #fff; + } + } + + .tools { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 20px; + + .funs { + display: flex; + + .funsItem { + line-height: 28px; + display: flex; + align-items: center; + border: 1px solid #17324c; + border-radius: 4px; + font-size: 12px; + margin-left: 10px; + + .el-checkbox { + width: 80px; + padding: 0 10px; + } + + .el-select { + width: 120px; + } + + &::v-deep .el-input__inner { + border: none; + background-color: #09152f; + } + + &:hover { + border: 1px solid #4b9bb7; + } + + &:hover .el-checkbox { + color: #4b9bb7; + } + } + + } + + .pagination { + margin-top: 50px; + display: flex; + line-height: 50px; + justify-content: center; + + .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; + } + } + } + } + + .el-table { color: #4b9bb7; + font-size: 10px; + margin-top: 10px; + + &::v-deep .cell { + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + } + + &::v-deep .el-table__empty-block { + background-color: #09152f; + } + + &::v-deep .el-table__empty-block { + color: #4b9bb7; + } + + .operation { + display: flex; + + .line { + padding: 0 5px; + } + + span:hover { + cursor: pointer; + } + } } - &::v-deep .el-dialog__close { - width: 20px; - height: 20px; - // color: #fff; + .el-table::v-deep .warning-row { + background: #06122c; } - &::v-deep .el-dialog__body { - padding: 0; + .el-table::v-deep .success-row { + background: #071f39; } } + + &::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 diff --git a/src/views/operate/disposal/casepool/pool/updateUser/index.vue b/src/views/operate/disposal/casepool/pool/updateUser/index.vue new file mode 100644 index 0000000..5b0cf9a --- /dev/null +++ b/src/views/operate/disposal/casepool/pool/updateUser/index.vue @@ -0,0 +1,195 @@ +<template> + <div class="updateUser"> + <main> + <div class="mainContent"> + <el-form ref="user" label-width="140px" autoComplete="on" :model="things" label-position="right"> + <!-- 杩濊浜嬮」缂栧彿 --> + <el-form-item class="optionItem" label="杩濊浜嬮」缂栧彿:" prop="number"> + <el-input v-model="things.number" placeholder="璇峰~鍐欒繚瑙勪簨椤圭紪鍙�" :disabled="!updateFlag"></el-input> + </el-form-item> + <!-- 鎵�灞炵被鍨� --> + <el-form-item class="optionItems" label="鎵�灞炵被鍨�:" prop="typeThird"> + <el-select v-model="things.typeThird" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeThirdList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲ぇ绫� --> + <el-form-item class="optionItem" label="鎵�灞炲ぇ绫�:" prop="typeSecond"> + <el-select v-model="things.typeSecond" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeSecondList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炲皬绫� --> + <el-form-item class="optionItem" label="鎵�灞炲皬绫�:" prop="typeFirst"> + <el-select v-model="things.typeFirst" placeholder="璇烽�夋嫨鎵�灞炵被鍨�" disabled> + <el-option v-for="item in typeFirstList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 妗堢敱 --> + <el-form-item class="optionItem" label="妗堢敱:" prop="type"> + <el-input type="textarea" autosize v-model="things.type" placeholder="璇疯緭鍏ユ鐢辨弿杩板唴瀹�" + :disabled="!updateFlag" disabled></el-input> + </el-form-item> + <!-- <el-form-item v-if="updateFlag"> + <div class="optionBtn"> + <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">纭 + </el-button> + </div> + </el-form-item> --> + </el-form> + + </div> + </main> + </div> +</template> +<script> +export default { + data() { + return { + things: { + number: 0, + type: '', + typeFirst: '', + typeSecond: '', + typeThird: '', + }, + roleList: [], + typeThirdList:[], + typeSecondList:[], + typeFirstList:[], + } + }, + created() { + console.log(this.userInfo); + this.things = JSON.parse(JSON.stringify(this.userInfo)); + // 鑾峰彇鎵�灞炵被鍨嬪垪琛� + this.getTypeThird(); + this.getTypeSecond(); + this.getTypeFirst(); + }, + methods: { + // handleUser() { + // this.$refs.user.validate((valid) => { + // if (valid) { + // const { role } = this; + // console.log(role); + // this.$axios.post('/sccg/role/update/' + role.id, { + // id: role.id, + // status: role.status, + // description: role.description, + // name: role.name, + // sort: 0 + // }).then(res => { + // this.$emit('changeDialog', { dialogUpdate: false }); + // this.getUserList(); + // }) + // } else { + // return false; + // } + // }) + // }, + // 鏌ヨ鎵�灞炵被鍨� + getTypeThird() { + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_first", + }) + .then(res => { + this.typeThirdList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲ぇ绫� + getTypeSecond(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_second", + }) + .then(res => { + this.typeSecondList = res.data; + }) + }, + // 鏌ヨ鎵�灞炲皬绫� + getTypeFirst(){ + this.$axios({ + method: 'get', + url: "sccg/violations/query/type_third", + }) + .then(res => { + this.typeFirstList = res.data; + }) + } + }, + props: ['userInfo', 'updateFlag', 'getUserList', 'changeDialog'] +} +</script> +<style lang="scss" scoped> +.updateUser { + border-radius: 1px; + background-color: #09152f; + + main { + // border: 1px solid #fff; + text-align: left; + padding: 0 55px; + background-color: #09152f; + padding-bottom: 50px; + + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; + + .el-form-item__content { + width: 400px; + + .el-select { + width: 100%; + } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } + + } + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } +} +</style> \ No newline at end of file diff --git a/src/views/systemSetting/baseSetting/department/createUser/index.vue b/src/views/systemSetting/baseSetting/department/createUser/index.vue index e0273f4..d25ded5 100644 --- a/src/views/systemSetting/baseSetting/department/createUser/index.vue +++ b/src/views/systemSetting/baseSetting/department/createUser/index.vue @@ -11,8 +11,8 @@ <!-- 涓婄骇閮ㄩ棬 --> <el-form-item class="optionItems" label="涓婄骇閮ㄩ棬:" prop="parentId"> <el-select v-model="depart.parentId" placeholder="璇疯緭鍏ヤ笂绾ч儴闂�"> - <el-option v-for="item in departList" :key="item.departName" :label="item.departName" :value="item.id" - :disabled="item.disabled"> + <el-option v-for="item in departList" :key="item.departName" :label="item.departName" + :value="item.id" :disabled="item.disabled"> </el-option> </el-select> </el-form-item> @@ -21,13 +21,29 @@ <el-input v-model="depart.departType" placeholder="璇烽�夋嫨閮ㄩ棬绫诲瀷"></el-input> </el-form-item> <!--娣诲姞浜哄憳 --> - <el-form-item class="optionItem" label="娣诲姞浜哄憳:"> + <el-form-item class="optionItem add" label="娣诲姞浜哄憳:"> <ul class="addPerson"> <li><i class="el-icon-user-solid"></i></li> <li><i class="el-icon-user-solid"></i></li> <li><i class="el-icon-user-solid"></i></li> - <li><i class="el-icon-plus"></i></li> + <li><i class="el-icon-plus" @click="openUser = true"></i></li> </ul> + <div class="card" v-if="openUser"> + <el-card class="box-card"> + <div slot="header" class="myclear"> + <span>宸ヤ綔浜哄憳</span> + <div @click="addUser">娣诲姞</div> + </div> + <div class="scrollWrap"> + <el-checkbox-group :max="3" v-model="checkedUser" @change="handleCheckedUserChange"> + <el-checkbox v-for="user in userList" :label="user.username" :key="user.id" :value="user.id"> + {{user.username}} + </el-checkbox> + </el-checkbox-group> + </div> + <div class="hidebar"></div> + </el-card> + </div> </el-form-item> <!-- 閮ㄩ棬鎻忚堪 --> <el-form-item class="optionItem" label="閮ㄩ棬鎻忚堪:" prop="departDes"> @@ -50,7 +66,7 @@ const validateNickname = (rule, value, callback) => { if (!value) { callback(new Error("璇峰~鍐欓儴闂ㄥ悕绉�")); - }else{ + } else { callback(); } }; @@ -93,18 +109,18 @@ { required: false, trigger: "blur" }, ], }, - typeList: [], + userList: [], departList: [], + checkedUser: [], + openUser:false, } }, created() { const that = this; // 鑾峰彇閮ㄩ棬鏍戝舰缁撴瀯鍥� this.getDepartTree(); - // 鑾峰彇鍏ㄩ儴閮ㄩ棬鍒楄〃 - // this.$axios.get('sccg/depart/page').then(res => { - // that.departList = res.data.records; - // }) + // 鑾峰彇鐢ㄦ埛鍒楄〃 + this.getUserList(); }, methods: { handleUser() { @@ -112,41 +128,69 @@ if (valid) { const { depart } = this; console.log(depart); - this.$axios.post('/sccg/depart/create', { - departName: depart.departName, - parentId: depart.parentId, departType: depart.departType, departDes: depart.departDes - }).then(res => { - if (res.code === 200) { - this.$message({ - message:res.message, - type:'success' - }) - this.refresh(); - }else if(res.code ===2001){ - this.$message({ - message:res.message, - type:'error' - }) - this.refresh(); - } - }) - }else{ + // this.$axios.post('/sccg/depart/create', { + // departName: depart.departName, + // parentId: depart.parentId, departType: depart.departType, departDes: depart.departDes + // }).then(res => { + // if (res.code === 200) { + // this.$message({ + // message:res.message, + // type:'success' + // }) + // this.refresh(); + // }else if(res.code ===2001){ + // this.$message({ + // message:res.message, + // type:'error' + // }) + // this.refresh(); + // } + // }) + } else { return false; } }) }, // 鑾峰彇閮ㄩ棬鏍戝舰缁撴瀯鍥� - getDepartTree(){ + getDepartTree() { this.$axios({ - method:'get', - url:'sccg/depart/tree', + method: 'get', + url: 'sccg/depart/tree', }) - .then(res=>{ - res.data.unshift({id:0,departName:'涓�绾ц彍鍗曟爮'}) - this.departList = res.data; - console.log(res); + .then(res => { + res.data.unshift({ id: 0, departName: '椤剁骇鑿滃崟' }) + this.departList = res.data; + }) + }, + // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭� + getUserList() { + const that = this; + const { currentPage, pageSize, search } = this; + // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭�佺敤鎴锋煡璇�(鏆傛椂鏀寔鐢佃瘽鍙风爜) + this.$axios.get(`sccg/admin/list`).then(res => { + if (res.code === 200) { + console.log(res) + this.userList = res.data.records; + } }) - } + }, + handleCheckedUserChange(value) { + // console.log(value); + if(value.length>3){ + console.log(this.checkedUser); + this.$message({ + type:'warning', + message:'鏈�澶氬彧鑳芥坊鍔犱笁涓垚鍛�' + }) + } + // let checkedCount = value.length; + // this.checkAll = checkedCount === this.cities.length; + // this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length; + }, + addUser(){ + console.log(this.checkedUser); + this.openUser = false; + }, }, props: ['refresh'] } @@ -220,6 +264,60 @@ } } + + .add { + position: relative; + + .card { + position: absolute; + z-index: 2000; + right: 0; + .box-card { + max-height: 200px; + overflow: hidden; + background-color: #09152f; + position: relative; + max-width: 220px; + + .scrollWrap { + overflow: scroll; + height: 160px; + position: relative; + color: #4b9bb7; + + .el-checkbox-group { + display: flex; + flex-direction: column; + + .el-checkbox { + line-height: 20px; + } + } + } + + .myclear { + width: 100%; + line-height: 20px; + color: #4b9bb7; + display: flex; + justify-content: space-between; + } + + .hidebar { + position: absolute; + top: 77px; + right: 20px; + width: 20px; + height: 160px; + background-color: #09152f; + } + + .item { + line-height: 40px; + } + } + } + } } footer { diff --git a/src/views/systemSetting/baseSetting/department/index.vue b/src/views/systemSetting/baseSetting/department/index.vue index 9516994..169b284 100644 --- a/src/views/systemSetting/baseSetting/department/index.vue +++ b/src/views/systemSetting/baseSetting/department/index.vue @@ -11,7 +11,8 @@ </div> <div class="addUser"> <el-button class="addBtn" type="primary" @click="dialogCreate = true">鏂板閮ㄩ棬</el-button> - <el-dialog :visible.sync="dialogCreate" title="鏂板閮ㄩ棬淇℃伅" width="45%" v-if="dialogCreate"> + <el-dialog :visible.sync="dialogCreate" title="鏂板閮ㄩ棬淇℃伅" width="45%" v-if="dialogCreate" + :before-close="handleClose"> <createUser :refresh="context==='' ? getUserList : search " /> </el-dialog> </div> @@ -22,7 +23,8 @@ <!-- 鏁版嵁灞曠ず --> <el-table ref="multipleTable" :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" - :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> + :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="id" label="閮ㄩ棬ID" min-width="5"> @@ -60,16 +62,33 @@ </el-table> <!-- 鏌ョ湅淇敼椤甸潰 --> <el-dialog :visible.sync="dialogUpdate" width="45%" :title="updateFlag ? '淇敼閮ㄩ棬淇℃伅' :'鏌ョ湅閮ㄩ棬淇℃伅'" - v-if="dialogUpdate"> - <updateUser :updateFlag="updateFlag" :userInfo="userInfo" :getUserList="context==='' ? getUserList : search" - @changeDialog="changMyDialog" /> + v-if="dialogUpdate" :before-close="handleClose"> + <updateUser :updateFlag="updateFlag" :userInfo="userInfo" + :getUserList="context==='' ? getUserList : search" @changeDialog="changMyDialog" /> </el-dialog> - <!-- 鍒嗛〉 --> - <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> + <!-- tools --> + <div class="tools"> + <div class="funs"> + <div class="funsItem"> + <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> + </div> + <div class="funsItem"> + <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> + </div> + <div class="funsItem"> + <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange"> + <el-option v-for="item in options" :key="item.value" :label="item.label" + :value="item.value" :disabled="item.disabled"> + </el-option> + </el-select> + </div> + </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> </main> @@ -93,13 +112,62 @@ totalNum: 200, pageSize: 10, currentPage: 1, - context: '' + context: '', + all: false, + unsame: false, + myIdx: 0, + options: [ + { + value: 0, + label: '鎵归噺鎿嶄綔', + disabled: true, + }, + { + value: 1, + label: '鎵归噺鍚敤', + }, + { + value: 2, + label: '鎵归噺绂佺敤', + }, + { + value: 3, + label: '鎵归噺鍒犻櫎', + } + ], + tempList: [] } }, created() { this.getUserList(); }, methods: { + selectChange(list) { + console.log(list); + console.log(this.tempList); + }, + tableChange(list) { + this.tempList = list; + if (list.length === this.tableData.length) { + this.all = true; + } else { + this.all = false + } + }, + changeTime({ createTime }) { + return helper(createTime); + }, + selectAll() { + + this.$refs.multipleTable.toggleAllSelection(); + }, + disSame(list) { + // console.log(this.$refs.multipleTable); + // const row = this.$refs.table.data + list.forEach(row => { + this.$refs.multipleTable.toggleRowSelection(row) + }) + }, handleDelete({ id }) { this.$confirm('纭鍒犻櫎锛�') .then(_ => { @@ -113,14 +181,14 @@ .then(res => { console.log(res); this.$message({ - type: res.code===404 ? 'warning':'success', + type: res.code === 404 ? 'warning' : 'success', message: res.message }) this.getUserList(); }) }) - .catch(_ => {}); + .catch(_ => { }); }, // 淇敼瑙掕壊 handleChangeRole(obj) { @@ -207,6 +275,15 @@ // 鍏抽棴dialog changMyDialog(val) { this.dialogUpdate = val.dialogFlag; + }, + handleClose(done) { + this.$confirm('纭鍏抽棴锛�') + .then(_ => { + this.dialogUpdate = false; + this.dialogCreate = false; + done(); + }) + .catch(_ => { }); } }, } @@ -280,17 +357,69 @@ line-height: 60px; } - .pagination { - margin-top: 50px; + .tools { display: flex; - line-height: 50px; - justify-content: center; + justify-content: space-between; + align-items: center; + padding: 0 20px; - &::v-deep li, - &::v-deep .btn-prev, - &::v-deep .btn-next { - background-color: #071f39; - color: #4b9bb7; + .funs { + display: flex; + + .funsItem { + line-height: 28px; + display: flex; + align-items: center; + border: 1px solid #17324c; + border-radius: 4px; + font-size: 12px; + margin-left: 10px; + + .el-checkbox { + width: 80px; + padding: 0 10px; + } + + .el-select { + width: 120px; + } + + &::v-deep .el-input__inner { + border: none; + background-color: #09152f; + } + + &:hover { + border: 1px solid #4b9bb7; + } + + &:hover .el-checkbox { + color: #4b9bb7; + } + } + + } + + .pagination { + margin-top: 50px; + display: flex; + line-height: 50px; + justify-content: center; + + .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; + } + } } } diff --git a/src/views/systemSetting/baseSetting/role/index.vue b/src/views/systemSetting/baseSetting/role/index.vue index 48e48ed..fceb8a6 100644 --- a/src/views/systemSetting/baseSetting/role/index.vue +++ b/src/views/systemSetting/baseSetting/role/index.vue @@ -11,7 +11,8 @@ </div> <div class="addUser"> <el-button class="addBtn" type="primary" @click="dialogCreate = true">鏂板缓瑙掕壊</el-button> - <el-dialog :visible.sync="dialogCreate" title="鏂板瑙掕壊" width="45%" v-if="dialogCreate"> + <el-dialog :visible.sync="dialogCreate" title="鏂板瑙掕壊" width="45%" v-if="dialogCreate" + :before-close="handleClose"> <createUser :refresh="context==='' ? getUserList : search" /> </el-dialog> </div> @@ -22,7 +23,8 @@ <!-- 鏁版嵁灞曠ず --> <el-table ref="multipleTable" :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" - :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> + :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 label="鐢ㄦ埛ID" min-width="5"> @@ -62,16 +64,33 @@ </el-table> <!-- 鏌ョ湅淇敼椤甸潰 --> <el-dialog :visible.sync="dialogUpdate" width="45%" :title="updateFlag ? '鏉冮檺璁剧疆' :'鏌ョ湅瑙掕壊淇℃伅'" - v-if="dialogUpdate"> + v-if="dialogUpdate" :before-close="handleClose"> <updateUser :updateFlag="updateFlag" :userInfo=userInfo :getUserList=" context ? getUserList : getUserList" @changeDialog="changeDialog" /> </el-dialog> - <!-- 鍒嗛〉 --> - <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> + <!-- tools --> + <div class="tools"> + <div class="funs"> + <div class="funsItem"> + <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> + </div> + <div class="funsItem"> + <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> + </div> + <div class="funsItem"> + <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange"> + <el-option v-for="item in options" :key="item.value" :label="item.label" + :value="item.value" :disabled="item.disabled"> + </el-option> + </el-select> + </div> + </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> </main> @@ -96,12 +115,61 @@ totalNum: null, pageSize: 10, currentPage: 1, + all: false, + unsame: false, + myIdx: 0, + options: [ + { + value: 0, + label: '鎵归噺鎿嶄綔', + disabled: true, + }, + { + value: 1, + label: '鎵归噺鍚敤', + }, + { + value: 2, + label: '鎵归噺绂佺敤', + }, + { + value: 3, + label: '鎵归噺鍒犻櫎', + } + ], + tempList: [] } }, created() { this.getUserList(); }, methods: { + selectChange(list) { + console.log(list); + console.log(this.tempList); + }, + tableChange(list) { + this.tempList = list; + if (list.length === this.tableData.length) { + this.all = true; + } else { + this.all = false + } + }, + changeTime({ createTime }) { + return helper(createTime); + }, + selectAll() { + + this.$refs.multipleTable.toggleAllSelection(); + }, + disSame(list) { + // console.log(this.$refs.multipleTable); + // const row = this.$refs.table.data + list.forEach(row => { + this.$refs.multipleTable.toggleRowSelection(row) + }) + }, handleDelete({ id }) { const that = this; let arr = []; @@ -228,6 +296,15 @@ changeDialog(val) { this.dialogUpdate = val.dialogUpdate; console.log(val); + }, + handleClose(done) { + this.$confirm('纭鍏抽棴锛�') + .then(_ => { + this.dialogUpdate = false; + this.dialogCreate = false; + done(); + }) + .catch(_ => { }); } } } @@ -301,17 +378,69 @@ line-height: 60px; } - .pagination { - margin-top: 50px; + .tools { display: flex; - line-height: 50px; - justify-content: center; + justify-content: space-between; + align-items: center; + padding: 0 20px; - &::v-deep li, - &::v-deep .btn-prev, - &::v-deep .btn-next { - background-color: #071f39; - color: #4b9bb7; + .funs { + display: flex; + + .funsItem { + line-height: 28px; + display: flex; + align-items: center; + border: 1px solid #17324c; + border-radius: 4px; + font-size: 12px; + margin-left: 10px; + + .el-checkbox { + width: 80px; + padding: 0 10px; + } + + .el-select { + width: 120px; + } + + &::v-deep .el-input__inner { + border: none; + background-color: #09152f; + } + + &:hover { + border: 1px solid #4b9bb7; + } + + &:hover .el-checkbox { + color: #4b9bb7; + } + } + + } + + .pagination { + margin-top: 50px; + display: flex; + line-height: 50px; + justify-content: center; + + .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; + } + } } } diff --git a/src/views/systemSetting/baseSetting/user/components/createUser/index.vue b/src/views/systemSetting/baseSetting/user/components/createUser/index.vue index c3b9f52..c790ef6 100644 --- a/src/views/systemSetting/baseSetting/user/components/createUser/index.vue +++ b/src/views/systemSetting/baseSetting/user/components/createUser/index.vue @@ -17,12 +17,12 @@ <el-input v-model="user.username" placeholder="璇峰~鍐欑敤鎴峰鍚�"></el-input> </el-form-item> <!-- 鎬у埆 --> - <!-- <el-form-item class="optionItem" label="鎬у埆:" prop="gender"> - <el-radio-group v-model="user.gender"> + <el-form-item class="optionItem" label="鎬у埆:" prop="sex"> + <el-radio-group v-model="user.sex"> <el-radio :label="1">鐢�</el-radio> - <el-radio :label="2">濂�</el-radio> + <el-radio :label="0">濂�</el-radio> </el-radio-group> - </el-form-item> --> + </el-form-item> <!-- 鏄惁鍏氬憳 --> <el-form-item class="optionItem" label="鏄惁鍏氬憳:" prop="isDy"> <el-radio-group v-model="user.isDy"> @@ -67,7 +67,7 @@ </el-form-item> <!-- 鎵�灞為儴闂� --> <el-form-item class="optionItem" label="鎵�灞為儴闂�:" prop="departmentId"> - <el-select v-model="user.departmentId" placeholder="璇烽�夋嫨鎵�灞為儴闂�"> + <el-select v-model="user.departmentId" placeholder="璇烽�夋嫨鎵�灞為儴闂�" @change="getDepartName"> <el-option v-for="item in departList" :key="item.name" :label="item.departName" :value="item.id"> </el-option> @@ -198,7 +198,7 @@ // nickName: '', password: '', username: '', - gender: 1, + sex: 1, isDy: 0, mobile: '', email: '', @@ -224,7 +224,7 @@ username: [ { required: true, trigger: "blur", validator: validateTruename }, ], - gender: [ + sex: [ { required: true, trigger: "blur" }, ], isDy: [ @@ -290,16 +290,17 @@ jsDy: user.isDy, jobTitle: user.jobTitle, mobile: user.mobile, - nickName: user.nickName, + // nickName: user.nickName, password: user.password, userType: user.userType, username: user.username, + departName:user.departName, }).then(res => { if (res.code === 200) { console.log(1); this.$message({ type:'success', - message:res.code, + message:res.message, }) this.$emit('sendDialog', { flag: false }); }else if(res.code === 500 && res.message === "鎿嶄綔澶辫触"){ @@ -327,6 +328,14 @@ // 閲嶇疆琛ㄥ崟 resetForm(){ this.$refs['user'].resetFields(); + }, + // 鑾峰緱閮ㄩ棬鍚嶇О + getDepartName(data){ + this.departList.forEach(item=>{ + if(item.id === data){ + this.user.departName = item.departName + } + }) } }, props: ['sendDialog'] diff --git a/src/views/systemSetting/baseSetting/user/components/header/index.vue b/src/views/systemSetting/baseSetting/user/components/header/index.vue index 48daecc..eeb8562 100644 --- a/src/views/systemSetting/baseSetting/user/components/header/index.vue +++ b/src/views/systemSetting/baseSetting/user/components/header/index.vue @@ -3,7 +3,7 @@ <div class="headerContent"> <div class="search"> <span>绛涢�夋潯浠�:</span> - <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="search"></el-input> + <el-input placeholder="璇疯緭鍏ユ墜鏈哄彿杩涜鏌ヨ" v-model="search"></el-input> <div class="findBtn"> <el-button type="primary" @click="setSearch">鏌ヨ</el-button> </div> diff --git a/src/views/systemSetting/baseSetting/user/components/main/index.vue b/src/views/systemSetting/baseSetting/user/components/main/index.vue index c974a08..97ba372 100644 --- a/src/views/systemSetting/baseSetting/user/components/main/index.vue +++ b/src/views/systemSetting/baseSetting/user/components/main/index.vue @@ -4,7 +4,7 @@ <!-- 鏁版嵁灞曠ず --> <el-table ref="multipleTable" :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" - :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> + :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 label="鐢ㄦ埛ID" min-width="4"> @@ -58,28 +58,29 @@ :getUserList="getUserList" /> </el-dialog> <!-- tools --> - <div class="pagination"> + <div class="tools"> + <div class="funs"> + <div class="funsItem"> + <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> + </div> + <div class="funsItem"> + <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> + </div> + <div class="funsItem"> + <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange"> + <el-option v-for="item in options" :key="item.value" :label="item.label" + :value="item.value" :disabled="item.disabled"> + </el-option> + </el-select> + </div> + </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 class="tools"> - <div class="funs"> - <div class="funsItem" > - <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> - </div> - <div class="funsItem" > - <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> - </div> - </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> </main> </template> @@ -106,23 +107,56 @@ password: false, depart: false, }, - all:false, - unsame:false, + all: false, + unsame: false, + myIdx:0, + options:[ + { + value:0, + label:'鎵归噺鎿嶄綔', + disabled:true, + }, + { + value:1, + label:'鎵归噺鍚敤', + }, + { + value:2, + label:'鎵归噺绂佺敤', + }, + { + value:3, + label:'鎵归噺鍒犻櫎', + } + ], + tempList:[] } }, created() { this.getUserList(); }, methods: { - changeTime({createTime}){ + selectChange(list){ + console.log(list); + console.log(this.tempList); + }, + tableChange(list){ + this.tempList = list; + if(list.length===this.tableData.length){ + this.all = true; + }else{ + this.all = false + } + }, + changeTime({ createTime }) { return helper(createTime); }, selectAll() { this.$refs.multipleTable.toggleAllSelection(); }, - disSame(list){ - console.log(this.$refs.multipleTable); + disSame(list) { + // console.log(this.$refs.multipleTable); // const row = this.$refs.table.data list.forEach(row => { this.$refs.multipleTable.toggleRowSelection(row) @@ -199,10 +233,10 @@ // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭�佺敤鎴锋煡璇�(鏆傛椂鏀寔鐢佃瘽鍙风爜) this.$axios.get(`sccg/admin/list?mobile=${search}¤t=${currentPage}&pageSize=${pageSize}`).then(res => { if (res.code === 200) { - // res.data.records.forEach(item => { - // item.createTime = helper(item.createTime); - // item.status == 1 ? item.status = true : item.status = false; - // }) + res.data.records.forEach(item => { + // item.createTime = helper(item.createTime); + item.status == 1 ? item.status = true : item.status = false; + }) that.totalNum = res.data.pages * pageSize; that.tableData = res.data.records; this.renderFlag = true; @@ -238,6 +272,7 @@ if (this.keyword != '') { this.search = this.keyword; } + this.currentPage = 1; this.getUserList(); this.$emit('resetFresh', { flag: false }) } @@ -261,12 +296,40 @@ .tools { display: flex; justify-content: space-between; + align-items: center; + padding: 0 20px; + .funs { + display: flex; + .funsItem { + line-height: 28px; + display: flex; + align-items: center; + border: 1px solid #17324c; + border-radius: 4px; + font-size: 12px; + margin-left: 10px; + .el-checkbox{ + width: 80px; + padding: 0 10px; + } + .el-select{ + width: 120px; + } + &::v-deep .el-input__inner{ + border: none; + background-color: #09152f; + } + &:hover{ + border: 1px solid #4b9bb7; + } + &:hover .el-checkbox{ + color: #4b9bb7; + } + } + + } - // .funs {} - - - } - .pagination { + .pagination { margin-top: 50px; display: flex; line-height: 50px; @@ -280,8 +343,13 @@ background-color: #071f39; color: #4b9bb7; } + &::v-deep .active{ + background-color: #409eff; + color: #fff; + } } } + } .el-table { color: #4b9bb7; diff --git a/src/views/systemSetting/baseSetting/user/components/updateUser/index.vue b/src/views/systemSetting/baseSetting/user/components/updateUser/index.vue index 6d37fec..63a2494 100644 --- a/src/views/systemSetting/baseSetting/user/components/updateUser/index.vue +++ b/src/views/systemSetting/baseSetting/user/components/updateUser/index.vue @@ -19,12 +19,12 @@ <el-input v-model="user.true_name" placeholder="璇峰~鍐欑敤鎴峰鍚�"></el-input> </el-form-item> --> <!-- 鎬у埆 --> - <!-- <el-form-item class="optionItem" label="鎬у埆:" prop="gender"> - <el-radio-group v-model="user.gender"> + <el-form-item class="optionItem" label="鎬у埆:" prop="sex" > + <el-radio-group v-model="user.sex" :disabled="!flag.role"> <el-radio :label="1">鐢�</el-radio> - <el-radio :label="2">濂�</el-radio> + <el-radio :label="0">濂�</el-radio> </el-radio-group> - </el-form-item> --> + </el-form-item> <!-- 鏄惁鍏氬憳 --> <el-form-item class="optionItem" label="鏄惁鍏氬憳:" prop="isDy"> <el-radio-group v-model="user.isDy" disabled> @@ -206,7 +206,7 @@ nickName: '', password: '', username: '', - // gender: 1, + sex: 1, isDy: 1, mobile: '', email: '', @@ -232,9 +232,9 @@ username: [ { required: true, trigger: "blur", validator: validateTruename }, ], - // gender: [ - // { required: true, trigger: "blur" }, - // ], + sex: [ + { required: true, trigger: "blur" }, + ], isDy: [ { required: true, trigger: "blur" }, ], @@ -276,6 +276,7 @@ created() { const that = this; this.user = JSON.parse(JSON.stringify(that.userInfo)); + console.log(this.user); // 鑾峰彇瑙掕壊鍒楄〃 this.getRoleList(); // 鑾峰彇鍏ㄩ儴閮ㄩ棬鍒楄〃 diff --git a/src/views/systemSetting/platform/portalSetting/index.vue b/src/views/systemSetting/platform/portalSetting/index.vue index 3bac3e2..a799394 100644 --- a/src/views/systemSetting/platform/portalSetting/index.vue +++ b/src/views/systemSetting/platform/portalSetting/index.vue @@ -65,7 +65,7 @@ }, methods: { - setPicUrl({obj, value}) { + setPicUrl({ obj, value }) { const { icon } = this; const baseUrl = 'http://140.143.152.226:8410/'; for (let key in icon) { @@ -77,15 +77,15 @@ }, // 鏇存敼logo鍏ュ彛 async changeLogo() { - const {icon} = this; + const { icon } = this; console.log(icon); const preIcon = await this.getIcon(); if (preIcon.length === 0) { this.handleChangeLogo(); return; } - for(let key in icon){ - if(icon[key]!==''){ + for (let key in icon) { + if (icon[key] !== '') { preIcon[key] = icon[key]; } } @@ -121,9 +121,15 @@ }).then(res => { console.log(res); if (res.code == 200) { - this.$message({ - message: res.message, - type: 'success' + this.$axios({ + method: 'get', + url: 'sccg/system/portal/logo/search', + }).then(res => { + this.$message({ + message: res.message, + type: 'success' + }) + sessionStorage.setItem('pic', JSON.stringify(result)); }) } }) @@ -144,7 +150,7 @@ }) } localStorage.removeItem('pic'); - window.location.href=''; + window.location.href = ''; } }, -- Gitblit v1.8.0