前端项目

develop
mengqiang 4 years ago
parent 93edf7d3f7
commit 15d3dd67af
  1. 2
      sso-auth-center-vue/.env.development
  2. 2
      sso-auth-center-vue/.env.production
  3. 2
      sso-auth-center-vue/.env.staging
  4. 28
      sso-auth-center-vue/README.md
  5. 257
      sso-auth-center-vue/src/views/sso/dept/index.vue
  6. 17
      sso-auth-center-vue/src/views/sso/platform/platformDetail.vue
  7. 2
      sso-auth-center-vue/src/views/sso/platform/platformMgmt.vue

@ -2,5 +2,5 @@
ENV = 'development' ENV = 'development'
# base api # base api
# VUE_APP_BASE_API = '/dev-api' # VUE_APP_BASE_API = '/api'
VUE_APP_BASE_API = 'http://localhost:9901/api' VUE_APP_BASE_API = 'http://localhost:9901/api'

@ -2,5 +2,5 @@
ENV = 'production' ENV = 'production'
# base api # base api
VUE_APP_BASE_API = '/prod-api' VUE_APP_BASE_API = '/api'

@ -4,5 +4,5 @@ NODE_ENV = production
ENV = 'staging' ENV = 'staging'
# base api # base api
VUE_APP_BASE_API = '/stage-api' VUE_APP_BASE_API = '/api'

@ -0,0 +1,28 @@
# 小强认证中心前端项目
```bash
# 进入项目目录
cd sso-auth-center-vue
# 安装依赖
npm install
# 建议不要直接使用 cnpm 安装依赖,会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org
# 启动服务
npm run dev
```
浏览器访问 http://localhost:端口
## 发布
```bash
# 构建测试环境
npm run build-test
# 构建生产环境
npm run build
```

@ -4,138 +4,141 @@
<el-breadcrumb-item>{{ targetSysName }}</el-breadcrumb-item> <el-breadcrumb-item>{{ targetSysName }}</el-breadcrumb-item>
<el-breadcrumb-item>部门管理</el-breadcrumb-item> <el-breadcrumb-item>部门管理</el-breadcrumb-item>
</el-breadcrumb> </el-breadcrumb>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch"> <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch">
<el-form-item label="部门名称" prop="deptNameLike"> <el-form-item label="部门名称" prop="deptNameLike">
<el-input <el-input
v-model="queryParams.deptNameLike" v-model="queryParams.deptNameLike"
placeholder="请输入部门名称" placeholder="请输入部门名称"
clearable clearable
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="状态" prop="status"> <el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" placeholder="状态" @keyup.enter.native="handleQuery" @change="handleQuery" <el-select v-model="queryParams.status" placeholder="状态" @keyup.enter.native="handleQuery"
size="small" style="width: 90px"> @change="handleQuery"
<el-option :key="-1" label="全部" :value="-1"/> size="small" style="width: 90px">
<el-option :key="0" label="正常" :value="0"/> <el-option :key="-1" label="全部" :value="-1"/>
<el-option :key="1" label="停用" :value="1"/> <el-option :key="0" label="正常" :value="0"/>
</el-select> <el-option :key="1" label="停用" :value="1"/>
</el-form-item> </el-select>
<el-form-item> </el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-form-item>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
</el-form-item> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form>
<el-row>
<el-form>
<el-form-item style="margin: 0">
<el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="handleAdd(null)" v-hasPermission="['dept:add']">新增
</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-row>
<el-table
border
v-loading="loading"
:data="deptList"
row-key="deptId"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-table-column fixed prop="deptName" label="部门名称" min-width="180" show-overflow-tooltip></el-table-column>
<el-table-column prop="status" label="状态" align="center" min-width="80" show-overflow-tooltip>
<template slot-scope="scope">
<span v-if="scope.row.status === 0"> <el-tag type="success" size="mini">启用</el-tag></span>
<span v-if="scope.row.status === 1"><el-tag type="danger" size="mini">停用</el-tag></span>
</template>
</el-table-column>
<el-table-column prop="sortNum" label="显示顺序" align="center" min-width="100" show-overflow-tooltip></el-table-column>
<el-table-column prop="createTime" min-width="165" label="创建时间" align="center"/>
<el-table-column prop="updateTime" min-width="165" label="修改时间" align="center"/>
<el-table-column fixed="right" label="操作" align="center" width="200">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermission="['dept:update']"
>修改
</el-button>
<el-button
v-if="scope.row.status===0"
size="mini"
type="text"
icon="el-icon-plus"
@click="handleAdd(scope.row)"
v-hasPermission="['dept:add']"
>新增
</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermission="['dept:delete']"
>删除
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 添加或修改部门对话框 --> <el-row>
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body> <el-form>
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> <el-form-item style="margin: 0">
<el-row> <el-button
<el-col :span="24"> type="primary"
<el-form-item label="上级部门" prop="deptParentId"> icon="el-icon-plus"
<treeselect v-model="form.deptParentId" :options="deptOptions" :normalizer="normalizer" size="mini"
placeholder="选择上级部门"/> @click="handleAdd(null)" v-hasPermission="['dept:add']">新增
</el-form-item> </el-button>
</el-col> </el-form-item>
<el-col :span="12"> </el-form>
<el-form-item label="部门名称" prop="deptName"> </el-row>
<el-input v-model="form.deptName" placeholder="请输入部门名称"/>
</el-form-item> <el-table
</el-col> border
<el-col :span="12"> v-loading="loading"
<el-form-item label="部门状态" prop="status"> :data="deptList"
<el-radio-group v-model="form.status"> row-key="deptId"
<el-radio :label="0">正常</el-radio> :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-radio :label="1">停用</el-radio> <el-table-column fixed prop="deptName" label="部门名称" min-width="180" show-overflow-tooltip></el-table-column>
</el-radio-group> <el-table-column prop="status" label="状态" align="center" min-width="80" show-overflow-tooltip>
</el-form-item> <template slot-scope="scope">
</el-col> <span v-if="scope.row.status === 0"> <el-tag type="success" size="mini">启用</el-tag></span>
<el-col :span="12"> <span v-if="scope.row.status === 1"><el-tag type="danger" size="mini">停用</el-tag></span>
<el-form-item label="显示顺序" prop="sortNum"> </template>
<el-input-number v-model="form.sortNum" controls-position="right" :min="0" :max="999999999"/> </el-table-column>
</el-form-item> <el-table-column prop="sortNum" label="显示顺序" align="center" min-width="100"
</el-col> show-overflow-tooltip></el-table-column>
</el-row> <el-table-column prop="createTime" min-width="165" label="创建时间" align="center"/>
<el-row> <el-table-column prop="updateTime" min-width="165" label="修改时间" align="center"/>
<el-col :span="24"> <el-table-column fixed="right" label="操作" align="center" width="200">
<el-form-item label="备注" prop="remarks"> <template slot-scope="scope">
<el-input v-model="form.remarks" type="textarea" <el-button
:autosize="{ minRows: 2, maxRows: 5}" size="mini"
placeholder="请输入内容"></el-input> type="text"
</el-form-item> icon="el-icon-edit"
</el-col> @click="handleUpdate(scope.row)"
</el-row> v-hasPermission="['dept:update']"
</el-form> >修改
<div slot="footer" class="dialog-footer"> </el-button>
<el-button type="primary" @click="submitForm"> </el-button> <el-button
<el-button @click="cancel"> </el-button> v-if="scope.row.status===0"
</div> size="mini"
</el-dialog> type="text"
icon="el-icon-plus"
@click="handleAdd(scope.row)"
v-hasPermission="['dept:add']"
>新增
</el-button>
<el-button
v-if="scope.row.children.length<=0"
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermission="['dept:delete']"
>删除
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 添加或修改部门对话框 -->
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-row>
<el-col :span="24">
<el-form-item label="上级部门" prop="deptParentId">
<treeselect v-model="form.deptParentId" :options="deptOptions" :normalizer="normalizer"
placeholder="选择上级部门"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="部门名称" prop="deptName">
<el-input v-model="form.deptName" placeholder="请输入部门名称"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="部门状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio :label="0">正常</el-radio>
<el-radio :label="1">停用</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="显示顺序" prop="sortNum">
<el-input-number v-model="form.sortNum" controls-position="right" :min="0" :max="999999999"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" type="textarea"
:autosize="{ minRows: 2, maxRows: 5}"
placeholder="请输入内容"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</div> </div>
</div>
</template> </template>
<script> <script>

@ -26,10 +26,13 @@
</el-card> </el-card>
</el-col> </el-col>
<el-col :md="3" :lg="3" v-if="hasUpdatePermission"> <el-col :md="3" :lg="3" v-if="hasUpdatePermission">
<sysIcon :sysId="detailData.sysId" :imgUrl="detailData.sysIcon"/> <sysIcon v-if="detailData.sysIcon !=='' && detailData.sysIcon !==undefined" :sysId="detailData.sysId" :imgUrl="detailData.sysIcon"/>
<sysIcon v-else :sysId="detailData.sysId" :imgUrl="detailData.sysDefaultIcon"/>
</el-col> </el-col>
<el-col :md="3" :lg="3" v-if="!hasUpdatePermission"> <el-col :md="3" :lg="3" v-if="!hasUpdatePermission">
<img :src="detailData.sysIcon" style="width: 260px; height: 160px"/> <img v-if="detailData.sysIcon !=='' && detailData.sysIcon !==undefined" :src="detailData.sysIcon"
style="width: 260px; height: 160px"/>
<img v-else :src="detailData.sysDefaultIcon" style="width: 260px; height: 160px"/>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="10"> <el-row :gutter="10">
@ -122,7 +125,7 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="系统编码" prop="sysCode"> <el-form-item label="系统编码" prop="sysCode">
<el-input readonly="true" disabled="true" v-model="updateForm.sysCode" placeholder="请输入系统编码"/> <el-input readonly="true" disabled="true" v-model="updateForm.sysCode" placeholder="请输入系统编码"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
@ -301,13 +304,13 @@ export default {
this.detailData = response.data this.detailData = response.data
//- //-
if ('' !== this.detailData.sysIcon && !isExternal(this.detailData.sysIcon)) { if ('' !== this.detailData.sysIcon && !isExternal(this.detailData.sysIcon)) {
this.detailData.sysIcon = process.env.VUE_APP_BASE_API + this.detailData.sysIcon this.detailData.sysIcon = process.env.VUE_APP_BASE_API + this.detailData.sysIcon
} }
// //
if (null == this.detailData.sysIcon || '' === this.detailData.sysIcon) { if (null == this.detailData.sysIcon || '' === this.detailData.sysIcon) {
this.detailData.sysIcon = require('@/assets/image/default-system.jpg') this.detailData.sysDefaultIcon = require('@/assets/image/default-system.jpg')
} }
} }
) )
}, },
updateSystem() { updateSystem() {

@ -198,7 +198,7 @@ export default {
submitForm() { submitForm() {
this.$refs['addForm'].validate(valid => { this.$refs['addForm'].validate(valid => {
if (valid) { if (valid) {
this.addForm.sysIcon='';
this.$confirm( this.$confirm(
'是否确认新增,请注意!新增后系统编码将不可修改?', '是否确认新增,请注意!新增后系统编码将不可修改?',
'确认警告', '确认警告',

Loading…
Cancel
Save