4 changed files with 544 additions and 17 deletions
-
2.env.development
-
3src/views/deviceManage/map3d/map.vue
-
127src/views/deviceManage/shelfManage/shelf3dPosition.vue
-
429src/views/weChatMiniProgram/index.vue
@ -0,0 +1,429 @@ |
|||
<template> |
|||
<div class="app-container row-container"> |
|||
<div class="content-area"> |
|||
<div class="area-config"> |
|||
<div class="config-item"> |
|||
<div class="config-item-main"> |
|||
<span class="data-title">数据接口</span> |
|||
<!-- 原数据接口表单 --> |
|||
<el-form ref="openForm" :model="openForm" size="small" label-width="100px"> |
|||
<el-form-item label="域名地址" prop="open_lib_http"> |
|||
<el-tooltip |
|||
v-if="!editStatus.openForm.open_lib_http" |
|||
class="item" |
|||
effect="dark" |
|||
content="双击输入框进行编辑" |
|||
placement="top" |
|||
> |
|||
<span |
|||
class="edit-readonly" |
|||
@dblclick="handleDblClick('openForm', 'open_lib_http')" |
|||
> |
|||
{{ openForm.open_lib_http }} |
|||
</span> |
|||
</el-tooltip> |
|||
<el-input |
|||
v-else |
|||
ref="openFormopen_lib_http" |
|||
v-model="openForm.open_lib_http" |
|||
@blur="handleBlur('openForm', 'open_lib_http')" |
|||
@keyup.enter="handleBlur('openForm', 'open_lib_http')" |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item label="AppId" prop="open_lib_appId"> |
|||
<el-tooltip |
|||
v-if="!editStatus.openForm.open_lib_appId" |
|||
class="item" |
|||
effect="dark" |
|||
content="双击输入框进行编辑" |
|||
placement="top" |
|||
> |
|||
<span |
|||
|
|||
class="edit-readonly" |
|||
@dblclick="handleDblClick('openForm', 'open_lib_appId')" |
|||
> |
|||
{{ openForm.open_lib_appId }} |
|||
</span> |
|||
</el-tooltip> |
|||
<el-input |
|||
v-else |
|||
ref="openFormopen_lib_appId" |
|||
v-model="openForm.open_lib_appId" |
|||
@blur="handleBlur('openForm', 'open_lib_appId')" |
|||
@keyup.enter="handleBlur('openForm', 'open_lib_appId')" |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item label="Secret" prop="open_lib_secret"> |
|||
<el-tooltip |
|||
v-if="!editStatus.openForm.open_lib_secret" |
|||
class="item" |
|||
effect="dark" |
|||
content="双击输入框进行编辑" |
|||
placement="top" |
|||
> |
|||
<span |
|||
class="edit-readonly" |
|||
@dblclick="handleDblClick('openForm', 'open_lib_secret')" |
|||
> |
|||
{{ openForm.open_lib_secret }} |
|||
</span> |
|||
</el-tooltip> |
|||
<el-input |
|||
v-else |
|||
ref="openFormopen_lib_secret" |
|||
v-model="openForm.open_lib_secret" |
|||
@blur="handleBlur('openForm', 'open_lib_secret')" |
|||
@keyup.enter="handleBlur('openForm', 'open_lib_secret')" |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item label="sm4-key" prop="sm4_key"> |
|||
<el-tooltip |
|||
v-if="!editStatus.openForm.sm4_key" |
|||
class="item" |
|||
effect="dark" |
|||
content="双击输入框进行编辑" |
|||
placement="top" |
|||
> |
|||
<span |
|||
class="edit-readonly" |
|||
@dblclick="handleDblClick('openForm', 'sm4_key')" |
|||
> |
|||
{{ openForm.sm4_key }} |
|||
</span> |
|||
</el-tooltip> |
|||
<el-input |
|||
v-else |
|||
ref="openFormsm4_key" |
|||
v-model="openForm.sm4_key" |
|||
@blur="handleBlur('openForm', 'sm4_key')" |
|||
@keyup.enter="handleBlur('openForm', 'sm4_key')" |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item label="opac_url" prop="opac_url"> |
|||
<el-tooltip |
|||
v-if="!editStatus.openForm.opac_url" |
|||
class="item" |
|||
effect="dark" |
|||
content="双击输入框进行编辑" |
|||
placement="top" |
|||
> |
|||
<span |
|||
class="edit-readonly" |
|||
@dblclick="handleDblClick('openForm', 'opac_url')" |
|||
> |
|||
{{ openForm.opac_url }} |
|||
</span> |
|||
</el-tooltip> |
|||
<el-input |
|||
v-else |
|||
ref="openFormopac_url" |
|||
v-model="openForm.opac_url" |
|||
@blur="handleBlur('openForm', 'opac_url')" |
|||
@keyup.enter="handleBlur('openForm', 'opac_url')" |
|||
/> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
<!-- <div class="config-remarks">双击输入框可进行编辑。</div> --> |
|||
</div> |
|||
<div class="config-item"> |
|||
<div class="config-item-main"> |
|||
<span class="data-title">小程序绑定</span> |
|||
<el-form ref="vxForm" :model="vxForm" size="small" label-width="100px"> |
|||
<el-form-item label="AppID" prop="vx_mini_appId"> |
|||
<el-tooltip |
|||
v-if="!editStatus.vxForm.vx_mini_appId" |
|||
class="item" |
|||
effect="dark" |
|||
content="双击输入框进行编辑" |
|||
placement="top" |
|||
> |
|||
<span |
|||
class="edit-readonly" |
|||
@dblclick="handleDblClick('vxForm', 'vx_mini_appId')" |
|||
> |
|||
{{ vxForm.vx_mini_appId }} |
|||
</span> |
|||
</el-tooltip> |
|||
<el-input |
|||
v-else |
|||
ref="vxFormvx_mini_appId" |
|||
v-model="vxForm.vx_mini_appId" |
|||
@blur="handleBlur('vxForm', 'vx_mini_appId')" |
|||
@keyup.enter="handleBlur('vxForm', 'vx_mini_appId')" |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item label="AppSecret" prop="vx_mini_secret"> |
|||
<el-tooltip |
|||
v-if="!editStatus.vxForm.vx_mini_secret" |
|||
class="item" |
|||
effect="dark" |
|||
content="双击输入框进行编辑" |
|||
placement="top" |
|||
> |
|||
<span |
|||
class="edit-readonly" |
|||
@dblclick="handleDblClick('vxForm', 'vx_mini_secret')" |
|||
> |
|||
{{ vxForm.vx_mini_secret }} |
|||
</span> |
|||
</el-tooltip> |
|||
<el-input |
|||
v-else |
|||
ref="vxFormvx_mini_secret" |
|||
v-model="vxForm.vx_mini_secret" |
|||
@blur="handleBlur('vxForm', 'vx_mini_secret')" |
|||
@keyup.enter="handleBlur('vxForm', 'vx_mini_secret')" |
|||
/> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
<!-- <div class="config-remarks">双击输入框可进行编辑。</div> --> |
|||
</div> |
|||
<div class="config-item"> |
|||
<div class="config-item-main"> |
|||
<span class="data-title">管理员绑定</span> |
|||
<el-form ref="adminForm" :model="adminForm" size="small" label-width="100px"> |
|||
<el-form-item label="账号" prop="op_user"> |
|||
<el-tooltip |
|||
v-if="!editStatus.adminForm.op_user" |
|||
class="item" |
|||
effect="dark" |
|||
content="双击输入框进行编辑" |
|||
placement="top" |
|||
> |
|||
<span |
|||
class="edit-readonly" |
|||
@dblclick="handleDblClick('adminForm', 'op_user')" |
|||
> |
|||
{{ adminForm.op_user }} |
|||
</span> |
|||
</el-tooltip> |
|||
<el-input |
|||
v-else |
|||
ref="adminFormop_user" |
|||
v-model="adminForm.op_user" |
|||
@blur="handleBlur('adminForm', 'op_user')" |
|||
@keyup.enter="handleBlur('adminForm', 'op_user')" |
|||
/> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
<!-- <div class="config-remarks">双击输入框可进行编辑。</div> --> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { FetchInitScreenSetting, FetchEditScreenSetting } from '@/api/digitalScreen/index' |
|||
import { mapGetters } from 'vuex' |
|||
|
|||
export default { |
|||
name: 'WeChatMiniProgram', |
|||
components: { |
|||
}, |
|||
data() { |
|||
return { |
|||
openForm: { |
|||
open_lib_http: null, |
|||
open_lib_appId: null, |
|||
open_lib_secret: null, |
|||
sm4_key: null, |
|||
opac_url: null |
|||
}, |
|||
vxForm: { |
|||
vx_mini_appId: null, |
|||
vx_mini_secret: null |
|||
}, |
|||
adminForm: { |
|||
op_user: null |
|||
}, |
|||
editStatus: { |
|||
openForm: { |
|||
open_lib_http: false, |
|||
open_lib_appId: false, |
|||
open_lib_secret: false, |
|||
sm4_key: false, |
|||
opac_url: false |
|||
}, |
|||
vxForm: { |
|||
vx_mini_appId: false, |
|||
vx_mini_secret: false |
|||
}, |
|||
adminForm: { |
|||
op_user: false |
|||
} |
|||
}, |
|||
originalValues: { |
|||
openForm: {}, |
|||
vxForm: {}, |
|||
adminForm: {} |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapGetters([ |
|||
'baseApi', |
|||
'user' |
|||
]) |
|||
}, |
|||
created() { |
|||
}, |
|||
mounted() { |
|||
this.$nextTick(() => { |
|||
this.initScreenSetting() |
|||
}) |
|||
}, |
|||
methods: { |
|||
// 初始化智慧大屏基本数据 |
|||
initScreenSetting() { |
|||
FetchInitScreenSetting({ 'libcode': this.user.fonds.fondsNo }).then(res => { |
|||
Object.values(res).forEach(item => { |
|||
const { code, context } = item |
|||
|
|||
// 处理数据接口相关 |
|||
if (code === 'open_lib_http') { |
|||
this.openForm.open_lib_http = context |
|||
} else if (code === 'open_lib_appId') { |
|||
this.openForm.open_lib_appId = context |
|||
} else if (code === 'open_lib_secret') { |
|||
this.openForm.open_lib_secret = context |
|||
} else if (code === 'sm4_key') { |
|||
this.openForm.sm4_key = context |
|||
} else if (code === 'opac_url') { |
|||
this.openForm.opac_url = context |
|||
} |
|||
|
|||
// 处理微信小程序绑定相关 |
|||
if (code === 'vx_mini_appId') { |
|||
this.vxForm.vx_mini_appId = context |
|||
} else if (code === 'vx_mini_secret') { |
|||
this.vxForm.vx_mini_secret = context |
|||
} |
|||
|
|||
// 处理管理员绑定 |
|||
if (code === 'op_user') { |
|||
this.adminForm.op_user = context |
|||
} |
|||
}) |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
|
|||
// 其他表单编辑框 |
|||
handleDblClick(formName, field) { |
|||
this.originalValues[formName][field] = this[formName][field] |
|||
this.editStatus[formName][field] = true |
|||
this.$nextTick(() => { |
|||
const input = this.$refs[`${formName}${field}`] |
|||
if (input) input.focus() |
|||
}) |
|||
}, |
|||
handleBlur(formName, field) { |
|||
this.editStatus[formName][field] = false |
|||
if (this[formName][field] !== this.originalValues[formName][field]) { |
|||
this.saveEdit(formName, field) |
|||
} |
|||
}, |
|||
saveEdit(formName, field) { |
|||
console.log(this.user) |
|||
const code = field |
|||
const context = this[formName][field] |
|||
const libcode = this.user.fonds.fondsNo |
|||
const remarks = '' |
|||
|
|||
if (!context && context !== 0) { |
|||
// 其他字段的非空校验 |
|||
this.$message.warning(`${this.getFieldLabel(formName, field)}不能为空`) |
|||
this.rollbackValue(formName, field) |
|||
return |
|||
} |
|||
|
|||
// 3. 构建提交参数 |
|||
const submitParam = { code, context, libcode, remarks } |
|||
|
|||
// 4. 调用接口保存 |
|||
FetchEditScreenSetting(submitParam) |
|||
.then(() => { |
|||
this.$message.success(`${this.getFieldLabel(formName, field)}更新成功`) |
|||
// 更新原始值为新值 |
|||
// if (formName === 'title') { |
|||
// this.originalTitle = this.screen_title |
|||
// this.originalValues.title = this.screen_title |
|||
// } else if (formName === 'specialFields' && field.startsWith('show') && field !== 'show_screen') { |
|||
// // 更新屏幕的originalTime |
|||
// const screenItem = this.screenItems.find(item => item.code === field) |
|||
// if (screenItem) { |
|||
// screenItem.originalTime = context |
|||
// } |
|||
// this.originalValues[formName][field] = context |
|||
// } else if (formName !== 'specialFields' || field !== 'show_screen') { |
|||
// this.originalValues[formName][field] = context |
|||
// } |
|||
}) |
|||
.catch(() => { |
|||
this.$message.error(`${this.getFieldLabel(formName, field)}更新失败`) |
|||
this.rollbackValue(formName, field) |
|||
}) |
|||
}, |
|||
// 新增：回滚值的通用方法 |
|||
rollbackValue(formName, field) { |
|||
if (this.originalValues[formName]?.[field] !== undefined) { |
|||
if (formName === 'title') { |
|||
this.screen_title = this.originalValues[formName][field] |
|||
} else if (formName === 'specialFields' && field.startsWith('show') && field !== 'show_screen') { |
|||
// 回滚屏幕时长 |
|||
const screenItem = this.screenItems.find(item => item.code === field) |
|||
if (screenItem) { |
|||
screenItem.time = this.originalValues[formName][field] |
|||
screenItem.originalTime = this.originalValues[formName][field] |
|||
} |
|||
} else if (formName === 'specialFields') { |
|||
this[field] = this.originalValues[formName][field] |
|||
} else { |
|||
this[formName][field] = this.originalValues[formName][field] |
|||
// 回滚复选框状态 |
|||
if (formName === 'librarySettingForm') { |
|||
const originalChecked = this.originalValues[formName][`${field}_checked`] |
|||
if (originalChecked !== undefined) { |
|||
this[formName][`${field}_checked`] = originalChecked |
|||
} |
|||
} |
|||
} |
|||
} |
|||
}, |
|||
getFieldLabel(formName, field) { |
|||
const labels = { |
|||
openForm: { |
|||
open_lib_http: '域名地址', |
|||
open_lib_appId: 'AppId', |
|||
open_lib_secret: 'Secret', |
|||
sm4_key: 'SM4密钥', |
|||
opac_url: 'OPAC地址' |
|||
}, |
|||
vxForm: { |
|||
vx_mini_appId: '微信小程序AppID', |
|||
vx_mini_secret: '微信小程序Secret' |
|||
}, |
|||
adminForm: { |
|||
op_user: '管理员账号' |
|||
} |
|||
} |
|||
return labels[formName][field] || field |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
@import "~@/assets/styles/digitalScreen.scss"; |
|||
.content-area { |
|||
height: 734px; |
|||
border-radius: 4px; |
|||
width: 100%; |
|||
} |
|||
|
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue