update

src/api/backbone/user.js

@@ -36,17 +36,8 @@ export function login(username, password, publicKey) {
 
 export function loginClient() {
   return service({
-    url: '/connect/token',
-    method: 'post',
-    headers: {
-      'Content-type': 'application/x-www-form-urlencoded'
-    },
-    data: qs.stringify({
-      client_id: process.env.VUE_APP_CREDENT_CLIENT_ID,
-      client_secret: process.env.VUE_APP_CREDENT_CLIENT_SECRET,
-      // grant_type: 'password',
-      grant_type: 'client_credentials'
-    })
+    url: '/api/token',
+    method: 'get'
   })
 }
 

src/api/client-setting.js

@@ -0,0 +1,27 @@
+import { appservice } from '@/utils/apiService'
+
+const baseUrl = '/api/client'
+
+export function getList(params) {
+  return appservice({
+    url: `${baseUrl}`,
+    method: 'get',
+    params
+  })
+}
+
+export function create(data) {
+  return appservice({
+    url: `${baseUrl}`,
+    method: 'post',
+    data
+  })
+}
+
+export function remove(id) {
+  return appservice({
+    url: `${baseUrl}/${id}`,
+    method: 'delete'
+  })
+}
+

src/permission.js

@@ -18,7 +18,8 @@ const whiteList = [
   '/signin-oidc',
   '/signout-callback-oidc',
   '/gride-work-info',
-  '/beam-carrier-work-info'
+  '/beam-carrier-work-info',
+  '/client-credential-info'
 ] // no redirect whitelist
 
 router.beforeEach(async(to, from, next) => {

src/router/index.js

@@ -63,6 +63,12 @@ export const constantRoutes = [
     hidden: true
   },
   {
+    path: '/client-credential-info',
+    name: 'client-credential-info',
+    component: () => import('@/views/grider-erections/client-settings'),
+    hidden: true
+  },
+  {
     path: '/',
     component: Layout,
     redirect: '/dashboard',

src/store/modules/user.js

@@ -67,12 +67,13 @@ const actions = {
   },
 
   async clientCredentials({ commit }) {
-    var publicKey = 'yjl1234569876584'
-    commit('SET_PUBLIC_KEY', publicKey)
-    setPubKey(publicKey)
+    // var publicKey = 'yjl1234569876584'
+    // commit('SET_PUBLIC_KEY', publicKey)
+    // setPubKey(publicKey)
     var res = await loginClient()
-    commit('SET_ACCESS_TOKEN', res.access_token)
-    setToken(res.access_token)
+    console.log('asdsad', res)
+    commit('SET_ACCESS_TOKEN', res.accessToken)
+    setToken(res.accessToken)
   },
   async loginOidc({ state }) {
     await state.authService.signIn()

src/utils/apiService.js

@@ -68,7 +68,8 @@ export function createService(baseUrl) {
       // }
 
       if (error.response && error.response.status === 401) {
-        msg = '令牌失效或未登陆！'
+        console.log('asdasd', error.response)
+        msg = error.response.data.msg
       }
 
       // if (error.response && error.response.status === 403) {

src/views/grider-erections/client-settings/index.vue

@@ -0,0 +1,240 @@
+<template>
+  <el-container class="content-height-fit">
+    <el-container class="resize-fit-container">
+      <div class="app-container">
+        <div class="filter-container blue-top-border">
+          <el-input
+            v-model="listQuery.clientId"
+            placeholder="请输入客户端Id"
+            class="filter-item"
+            clearable
+            @change="getList"
+          />
+          <el-button
+            v-waves
+            class="filter-item"
+            type="primary"
+            icon="el-icon-search"
+            size="small"
+            @click="handleFilter"
+          >查询</el-button>
+          <el-button
+            v-waves
+            class="filter-item"
+            type="primary"
+            icon="el-icon-edit"
+            size="small"
+            @click="handleCreate"
+          >新增</el-button>
+        </div>
+        <div class="content-container">
+          <el-table
+            v-loading="listLoading"
+            row-key="id"
+            :data="list"
+            border
+            fit
+            highlight-current-row
+            style="width: 100%"
+            height="calc(100vh - 276px)"
+          >
+            <el-table-column label="序号" type="index" width="50" align="center" />
+            <el-table-column label="客户端Id" prop="clientId" align="center" />
+            <el-table-column label="客户端密钥" prop="clientSecret" align="center" />
+            <el-table-column label="Token过期时间" prop="expiresIn" align="center" />
+            <el-table-column
+              label="操作"
+              align="center"
+              width="80"
+              class-name="small-padding fixed-width"
+            >
+              <template slot-scope="{ row }">
+                <el-button
+                  size="mini"
+                  type="danger"
+                  @click="handleDelete(row)"
+                >删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+          <pagination
+            :total="total"
+            :skip-count.sync="listQuery.skipCount"
+            :max-result-count.sync="listQuery.maxResultCount"
+            @pagination="getList"
+          />
+        </div>
+        <el-dialog
+          title="创建客户端凭证"
+          :close-on-click-modal="false"
+          :visible.sync="dialogFormVisible"
+        >
+          <el-form
+            ref="dataForm"
+            v-loading="formLoading"
+            :rules="rules"
+            :model="entity"
+            label-position="right"
+            label-width="120px"
+          >
+            <el-row :gutter="16">
+              <el-col :span="8">
+                <el-form-item label="客户端Id" prop="clientId">
+                  <el-input v-model="entity.clientId" :show-overflow-tooltip="true" />
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="客户端密钥" prop="clientSecret">
+                  <el-input v-model="entity.clientSecret" :show-overflow-tooltip="true" />
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="Token过期时间" prop="expiresIn">
+                  <el-input v-model="entity.expiresIn" :show-overflow-tooltip="true" />
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+          <div slot="footer" class="dialog-footer">
+            <el-button
+              :disabled="formLoading"
+              @click="dialogFormVisible = false"
+            >取消</el-button>
+            <el-button
+              :disabled="formLoading"
+              type="primary"
+              @click="createData()"
+            >确认</el-button>
+          </div>
+        </el-dialog>
+      </div>
+    </el-container>
+  </el-container>
+</template>
+
+<script>
+import * as clientApi from '@/api/client-setting'
+import waves from '@/directive/waves' // waves directive
+import Pagination from '@/components/Pagination' // secondary package based on el-pagination
+
+export default {
+  name: 'CameraMng',
+  directives: { waves },
+  components: { Pagination },
+  data() {
+    return {
+      list: [],
+      entity: {},
+      total: 0,
+      listLoading: false,
+      listQuery: {
+        skipCount: 0,
+        maxResultCount: 20
+      },
+      dialogFormVisible: false,
+      formLoading: false,
+      rules: {
+        clientId: [
+          { required: true, message: '请输入客户端Id', trigger: 'blur' },
+          { max: 32, message: '长度必须少于32个字符', trigger: 'blur' }
+        ],
+        clientSecret: [
+          { required: true, message: '请输入客户端密钥', trigger: 'blur' },
+          { max: 64, message: '长度必须少于64个字符', trigger: 'blur' }
+        ],
+        expiresIn: [
+          { required: true, message: '请输入Token过期时长', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  mounted() {
+    this.getList()
+  },
+  methods: {
+    // 获取数据列表
+    getList() {
+      this.listLoading = true
+      clientApi
+        .getList(this.listQuery)
+        .then(res => {
+          this.list = res.items
+          this.total = res.totalCount
+        })
+        .finally(() => {
+          this.listLoading = false
+        })
+    },
+    // 查询
+    handleFilter() {
+      this.listQuery.skipCount = 0
+      this.getList()
+    },
+    // 创建点击事件
+    handleCreate() {
+      this.dialogFormVisible = true
+      this.formLoading = false
+      this.entity = {}
+      this.$nextTick(() => {
+        this.$refs['dataForm'].clearValidate()
+      })
+    },
+    // 创建
+    createData() {
+      this.$refs['dataForm'].validate(valid => {
+        if (valid) {
+          this.formLoading = true
+          clientApi
+            .create(this.entity)
+            .then(() => {
+              this.getList()
+              this.dialogFormVisible = false
+              this.$notify({
+                title: '成功',
+                message: '创建成功',
+                type: 'success',
+                duration: 2000
+              })
+            })
+            .finally(() => {
+              this.formLoading = false
+            })
+        }
+      })
+    },
+    // 删除
+    handleDelete(row) {
+      this.$confirm('此操作将删除该项, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.listLoading = true
+        clientApi
+          .remove(row.id)
+          .then(() => {
+            this.getList()
+            this.$notify({
+              title: '成功',
+              message: '删除成功',
+              type: 'success',
+              duration: 2000
+            })
+          })
+          .finally(() => {
+            this.listLoading = false
+          })
+      })
+    }
+  }
+}
+</script>
+
+<style  scoped>
+.number >>> input{
+  text-align: left !important;
+}
+.el-selects >>> .el-input--suffix{
+  width: 150px !important;
+}
+</style>