| | |
| | | * @Author: lzhe lzhe@example.com |
| | | * @Date: 2024-03-26 10:28:33 |
| | | * @LastEditors: lzhe lzhe@example.com |
| | | * @LastEditTime: 2024-05-07 21:09:02 |
| | | * @LastEditTime: 2024-09-30 10:10:59 |
| | | * @FilePath: /smart-web/src/views/master/person/main/index.vue |
| | | * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE |
| | | --> |
| | |
| | | </el-row> |
| | | </el-form> |
| | | </el-tab-pane> |
| | | <el-tab-pane label="企业LOGO"> |
| | | <!-- <el-tab-pane label="企业LOGO"> |
| | | <div class="tabTitle">企业LOGO</div> |
| | | <span class="logotitle">上传logo</span> |
| | | <div class="logo1"> |
| | |
| | | <ul class="show-list"> |
| | | <li :class="{active: active.isA}" @click="changeLi('isA')"> |
| | | <div class="edit" @click="editBtn('isA')">编辑</div> |
| | | <div class="logo"> |
| | | <img src="http://116.63.155.153:83/api/static/images/cps.png"> |
| | | <div class="logo" style="background-color: seagreen;"> |
| | | CPS |
| | | </div> |
| | | <div class="content"> |
| | | <div class="name">CPS</div> |
| | |
| | | </li> |
| | | <li :class="{active: active.isB}" @click="changeLi('isB')"> |
| | | <div class="edit" @click="editBtn('isB')">编辑</div> |
| | | <div class="logo"> |
| | | <img src="http://116.63.155.153:83/api/static/images/vision.png"> |
| | | <div class="logo" style="background-color: dodgerblue;"> |
| | | 大屏 |
| | | </div> |
| | | <div class="content"> |
| | | <div class="name">大屏</div> |
| | |
| | | </li> |
| | | <li :class="{active: active.isC}" @click="changeLi('isC')"> |
| | | <div class="edit" @click="editBtn('isC')">编辑</div> |
| | | <div class="logo"> |
| | | <img src="http://116.63.155.153:83/api/static/images/hmi.png"> |
| | | <div class="logo" style="background-color: darkgoldenrod;"> |
| | | HMI |
| | | </div> |
| | | <div class="content"> |
| | | <div class="name">HMI</div> |
| | |
| | | </el-form-item> |
| | | </el-form> |
| | | </el-card> |
| | | </el-tab-pane> |
| | | </el-tab-pane> --> |
| | | <el-tab-pane label="授权"> |
| | | <div class="tabTitle">授权</div> |
| | | <div class="license-detail"> |
| | |
| | | <div><span class="left">设备标识:</span><span class="licenseCopy" @click="licenseCopy">复制</span></div> |
| | | </div> |
| | | </el-tab-pane> |
| | | <el-tab-pane label="服务集成"> |
| | | <!-- <el-tab-pane label="服务集成"> |
| | | <div class="tabTitle">服务集成</div> |
| | | <div class="card"> |
| | | <div class="top"> |
| | | <div class="title"> |
| | | <img src="./logo.png" /> |
| | | <span>企业微信</span> |
| | | <span class="taginfo" v-if="appType==1">已关联</span> |
| | | <span class="taginfo" v-if="outerData[0].status == 1">已关联</span> |
| | | <div class="desc">CPS与企业微信关联,协作与沟通更加高效。绑定后将同步企业微信的人员名单和组织架构,并允许成员使用企业微信账号登录</div> |
| | | </div> |
| | | <el-button class="btn" @click="addOss(1)" v-if="appType!=1" :disabled="appType != 1">关联</el-button> |
| | | <el-button class="btn" @click="addOss(2)" v-if="appType==1" :disabled="appType != 1" type="danger" plain>解绑</el-button> |
| | | <el-button class="btn" @click="addOss(1)" v-if="outerData[0].status == 0" :disabled="outerData[1].status == 1">关联</el-button> |
| | | <el-button class="btn" @click="relieve(1)" v-if="outerData[0].status == 1" type="danger" plain>解绑</el-button> |
| | | </div> |
| | | </div> |
| | | <div class="card"> |
| | | <div class="top"> |
| | | <div class="title"> |
| | | <img src="./logo.png"/> |
| | | <span >钉钉</span> |
| | | <span class="taginfo" v-if="appType==2">已关联</span> |
| | | <div class="desc">CPS与钉钉关联,协作与沟通更加高效。绑定后将同步钉钉的人员名单和组织架构,并允许成员使用钉钉账号登录</div> |
| | | </div> |
| | | <el-button class="btn" @click="addOss(2)" v-if="appType!=2" :disabled="appType != 2">关联</el-button> |
| | | <el-button class="btn" @click="addOss(2)" v-if="appType==2" :disabled="appType != 2" type="danger" plain>解绑</el-button> |
| | | </div> |
| | | <div class="bottom"> |
| | | <div class="bottom" v-if="outerData[0].status == 1"> |
| | | <div class="info"> |
| | | <div class="img"> |
| | | <el-icon><Monitor /></el-icon> |
| | |
| | | <div class="info-right"> |
| | | <div class="tag"> |
| | | <div> 组织架构同步</div> |
| | | <span>立即同步</span> |
| | | <span @click="updataOss(1)">立即同步</span> |
| | | </div> |
| | | <div class="time">上次同步时间:-</div> |
| | | <div class="time">上次同步时间:{{licenseDetail.lastSyncTime || '-'}}</div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="card"> |
| | | <div class="top"> |
| | | <div class="title"> |
| | | <img src="./logo.png"/> |
| | | <span >钉钉</span> |
| | | <span class="taginfo" v-if="outerData[1].status == 1">已关联</span> |
| | | <div class="desc">CPS与钉钉关联,协作与沟通更加高效。绑定后将同步钉钉的人员名单和组织架构,并允许成员使用钉钉账号登录</div> |
| | | </div> |
| | | <el-button class="btn" @click="addOss(2)" v-if="outerData[1].status == 0" :disabled="outerData[0].status == 1">关联</el-button> |
| | | <el-button class="btn" @click="relieve(2)" type="danger" plain v-if="outerData[1].status == 1">解绑</el-button> |
| | | </div> |
| | | <div class="bottom" v-if="outerData[1].status == 1"> |
| | | <div class="info"> |
| | | <div class="img"> |
| | | <el-icon><Monitor /></el-icon> |
| | | </div> |
| | | <div class="info-right"> |
| | | <div class="tag"> |
| | | <div> 组织架构同步</div> |
| | | <span @click="updataOss(2)">立即同步</span> |
| | | </div> |
| | | <div class="time">上次同步时间:{{licenseDetail.lastSyncTime || '-'}}</div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </el-tab-pane> |
| | | </el-tab-pane> --> |
| | | <!-- <el-tab-pane label="DMP日志"> |
| | | <div class="tabTitle">DMP日志</div> |
| | | <el-form :inline="true" :model="DMPsearchData" label-width="80px"> |
| | | <el-row> |
| | | <el-col :span="6"> |
| | | <el-form-item label="设备"> |
| | | <el-select v-model="DMPsearchData.machineCode" style="width: 100%" @change="DMPsearchChange"> |
| | | <el-option v-for="item in machineCodeList" :key="item.id" :label="item.machineName" :value="item.id"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-form-item label="采集项"> |
| | | <el-select v-model="DMPsearchData.affectedVariable" style="width: 100%" @change="DMPsearchChange"> |
| | | <el-option v-for="item in affectedVariableList" :key="item.code" :label="item.code" :value="item.code"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-form-item label="采集值"> |
| | | <el-input v-model="DMPsearchData.variableValue" placeholder="采集值" clearable style="width: 100%" @change="DMPsearchChange"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-form-item label="时间范围"> |
| | | <el-date-picker v-model="DMPsearchData.selectDate" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" align="right" value-format="YYYY-MM-DD HH:mm:ss" @change="dateChange" style="vertical-align: middle;width: 100%;"></el-date-picker> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <div> |
| | | <div class="dict-table"> |
| | | <el-table ref="multipleTableRef" :data="DMPtableData" border style="width: 100%" class="multipleTableRef"> |
| | | <el-table-column prop="test" label="设备名称"></el-table-column> |
| | | <el-table-column prop="test" label="设备编号"></el-table-column> |
| | | <el-table-column prop="test" label="采集项"></el-table-column> |
| | | <el-table-column prop="test" label="采集值"></el-table-column> |
| | | <el-table-column prop="test" label="采集状态"></el-table-column> |
| | | <el-table-column prop="test" label="采集时间"></el-table-column> |
| | | <el-table-column prop="test" label="类型"></el-table-column> |
| | | <el-table-column fixed="right" label="操作"> |
| | | <template #default="scope"> |
| | | <el-button text type="primary" size="small" @click="showDrawer(scope.row, scope.$index)">??</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | | <el-pagination |
| | | style="margin-top: 12px;" |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | | :page-sizes="[15, 50, 100]" |
| | | :page-size="15" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="DMPsearchData.total"> |
| | | </el-pagination> |
| | | </el-tab-pane> --> |
| | | </el-tabs> |
| | | <save-dialog v-if="dialog.save" ref="saveDialog" @success="addOssSuccess" @closed="dialog.save=false"></save-dialog> |
| | | <!-- 解绑 --> |
| | | <el-dialog v-model="relieveModel" :width="500"> |
| | | <el-icon class="relieveModelIcon"><Warning /></el-icon> |
| | | <div class="relieveModelTip"> |
| | | <p>解除绑定后,您将不能通过钉钉维护数据。</p> |
| | | <p>如果确定解绑请点击“立即解绑”,否则请点击“取消”。</p> |
| | | </div> |
| | | <template #footer> |
| | | <el-button @click="relieveModel=false" >取消</el-button> |
| | | <el-button :loading="relieveModelSaveing" type="danger" plain @click="relieveModelSave">立即解绑</el-button> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | name: "oss-main", |
| | | data(){ |
| | | return { |
| | | appType: "", |
| | | DMPtableData: [], |
| | | relieveType: "", |
| | | outerData: [{status: 0},{status: 0}], //服务集成 |
| | | relieveModelSaveing: false, |
| | | relieveModel: false, |
| | | dialog: { |
| | | save: false |
| | | }, |
| | |
| | | CPS: "" |
| | | } |
| | | }, |
| | | DMPsearchData: { |
| | | machineCode: "", |
| | | affectedVariable: "", |
| | | variableValue: "", |
| | | startTime: "", |
| | | endTime: "", |
| | | current: 1, |
| | | size: 15, |
| | | total: 0, |
| | | selectDate: [] |
| | | }, |
| | | machineCodeList: [], |
| | | affectedVariableList: [], |
| | | uploadData: {}, |
| | | logoType: "0", |
| | | authorization: {Authorization: "Basic c2FiZXI6c2FiZXJfc2VjcmV0"}, |
| | |
| | | this.getFile(); //企业logo |
| | | this.license(); //授权 |
| | | this.outer(); //服务集成 |
| | | this.getlog(); //DMP日志 |
| | | this.getMachineCodeList(); //DMP日志 |
| | | }, |
| | | methods: { |
| | | getMachineCodeList() { |
| | | this.$HTTP.get(`/api/blade-cps/machine/list`).then(res=> { |
| | | if(res.code == 200) { |
| | | this.machineCodeList = res.data; |
| | | this.outer(); //服务集成 |
| | | } |
| | | }) |
| | | }, |
| | | dateChange(val) { |
| | | this.DMPsearchData.startTime = val[0]; |
| | | this.DMPsearchData.endTime = val[1]; |
| | | this.getlog(); |
| | | }, |
| | | DMPsearchChange() { |
| | | this.getlog(); |
| | | }, |
| | | getlog() { |
| | | var obj = Object.assign({},this.DMPsearchData); |
| | | this.$HTTP.post(`/api/blade-dmp-log/log/page?current=${this.DMPsearchData.current}&size=${this.DMPsearchData.size}`,obj).then(res=> { |
| | | if(res.code == 200) { |
| | | this.DMPtableData = res.data.records; |
| | | this.DMPsearchData.total = res.data.total; |
| | | } |
| | | }) |
| | | }, |
| | | relieveModelSave(type) { //解绑 |
| | | this.$HTTP.get(`/api/blade-sync/outer-app-config/unbind/${this.relieveType}`).then(res=> { |
| | | if(res.code == 200) { |
| | | this.$message.success("操作成功"); |
| | | this.relieveModel = false; |
| | | this.outer(); //服务集成 |
| | | } |
| | | }) |
| | | }, |
| | | relieve(type) { //解绑 |
| | | this.relieveModel = true; |
| | | this.relieveType = type; |
| | | }, |
| | | updataOss(type) { |
| | | if(type == 1) { |
| | | var url = "/api/blade-sync/wechat/sync"; |
| | | var methods = "post"; |
| | | } |
| | | if(type == 2) { |
| | | var url = "/api/blade-sync/ding-sync/sync-immediately"; |
| | | var methods = "get"; |
| | | } |
| | | this.$HTTP[methods](url).then(res=> { |
| | | if(res.code == 200) { |
| | | this.dialog.save = true |
| | | this.$nextTick(() => { |
| | | this.$refs.saveDialog.open(type,res.data,'updata'); |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | outer() { |
| | | this.$HTTP.get("/api/blade-sync/outer-app-config/list").then(res=> { |
| | | if(res.code == 200) { |
| | | this.appType = res.data[0].appType; |
| | | res.data.forEach(item=> { |
| | | this.outerData[item.appType - 1] = item; |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | addOss(type) { |
| | | this.dialog.save = true |
| | | this.$nextTick(() => { |
| | | this.$refs.saveDialog.open(type); |
| | | this.$refs.saveDialog.open(type,this.outerData,'add'); |
| | | }) |
| | | }, |
| | | addOssSuccess() { |
| | | |
| | | this.outer(); //服务集成 |
| | | }, |
| | | licenseCopy() { |
| | | // 复制到剪贴板 |
| | |
| | | this.ossForm = res.data; |
| | | } |
| | | }) |
| | | } |
| | | }, |
| | | handleSizeChange(val) { |
| | | console.log(`每页 ${val} 条`); |
| | | this.DMPsearchData.current = "1"; |
| | | this.DMPsearchData.size = val; |
| | | this.getlog(); |
| | | }, |
| | | handleCurrentChange(val) { |
| | | console.log(`当前页: ${val}`); |
| | | this.DMPsearchData.current = val; |
| | | this.getlog(); |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | top: 18px; |
| | | right: 16px; |
| | | font-size: 14px; |
| | | color: #3b8e8e; |
| | | color: #409eff; |
| | | } |
| | | .show-list li .logo { |
| | | width: 66px; |
| | | height: 66px; |
| | | margin-right: 14px; |
| | | } |
| | | .show-list li .logo img{ |
| | | width: 66px; |
| | | height: 66px; |
| | | color: #fff; |
| | | font-size: 18px; |
| | | text-align: center; |
| | | line-height: 66px; |
| | | border-radius: 6px; |
| | | font-weight: 800; |
| | | } |
| | | .show-list li .lcontent .name{ |
| | | font-weight: 700; |
| | |
| | | top: 20px; |
| | | } |
| | | .card .top .title .taginfo { |
| | | color: #3b8e8e; |
| | | border: 1px solid #3b8e8e; |
| | | color: #409eff; |
| | | border: 1px solid #409eff; |
| | | border-radius: 4px; |
| | | font-size: 14px; |
| | | margin-left: 10px; |
| | |
| | | padding: 20px; |
| | | } |
| | | .card .bottom .info .img { |
| | | background-color: #3b8e8e; |
| | | background-color: #409eff; |
| | | border-radius: 6px; |
| | | display: flex; |
| | | justify-content: center; |
| | |
| | | font-size: 14px; |
| | | } |
| | | .card .bottom .info .info-right .tag span{ |
| | | color: #3b8e8e; |
| | | color: #409eff; |
| | | cursor: pointer; |
| | | padding: 0 !important; |
| | | min-height: 14px !important; |
| | |
| | | color: #bbb; |
| | | font-size: 14px; |
| | | } |
| | | .relieveModelIcon { |
| | | color: red; |
| | | font-size: 16px; |
| | | margin-right: 8px; |
| | | vertical-align: -3px; |
| | | vertical-align: top; |
| | | } |
| | | .relieveModelTip { |
| | | display: inline-block; |
| | | } |
| | | </style> |