|
|
@@ -0,0 +1,125 @@
|
|
|
+<template>
|
|
|
+ <div class="showGoodsIdx">
|
|
|
+ <s-header :name="$t('device.alramClean')" :noback="false"></s-header>
|
|
|
+ <div class="headerCon kBordBott o-plr-10 o-ptb-16 l-flex-RC">
|
|
|
+ <div class="line o-mr-6"></div>
|
|
|
+ <div>
|
|
|
+ <span class="c-color c-text-14">{{ $t('device.showGoodsPage.equipmentName') }}：</span>
|
|
|
+ <span class="c-text-color c-text-14">{{ equipmentName }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <van-cell v-if="showCheckBtn" center
|
|
|
+ :title="checked ? $t('alramClean.openStatus') : $t('alramClean.closeStatus')" size="large"
|
|
|
+ title-style="color: #404d74;">
|
|
|
+ <template #right-icon>
|
|
|
+ <van-switch :model-value="checked" @update:model-value="updateStatus" size="24" />
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+// 导入接口
|
|
|
+import { updateAlarmCleanStatus, getAlarmClean } from '@/service/device/index';
|
|
|
+import sHeader from "@/components/SimpleHeader";
|
|
|
+import { ref } from "@vue/reactivity";
|
|
|
+import { onMounted } from '@vue/runtime-core';
|
|
|
+import { useRoute, useRouter } from 'vue-router';
|
|
|
+import { showConfirmDialog, showFailToast, showToast } from 'vant';
|
|
|
+import { useI18n } from "vue-i18n";
|
|
|
+import { styleUrl } from '../../../common/js/utils';
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ sHeader
|
|
|
+ },
|
|
|
+ setup() {
|
|
|
+ // 引入语言
|
|
|
+ const { t } = useI18n();
|
|
|
+ // 路由
|
|
|
+ const route = useRoute();
|
|
|
+ const router = useRouter();
|
|
|
+
|
|
|
+ const switchStates = ref([]);
|
|
|
+
|
|
|
+ const equipmentId = ref('');
|
|
|
+ const equipmentName = ref('');
|
|
|
+ const clientId = ref('');
|
|
|
+ const checked = ref(true);
|
|
|
+ const showCheckBtn = ref(true)
|
|
|
+
|
|
|
+ // 刚进页面
|
|
|
+ onMounted(() => {
|
|
|
+ // 加载样式
|
|
|
+ styleUrl('showGoods');
|
|
|
+ equipmentId.value = route.query.deviceId || "";
|
|
|
+ const name = route.query.name || "";
|
|
|
+ clientId.value = route.query.clientId || "";
|
|
|
+ // console.log("route.query.clientId>>>", route.query.clientId);
|
|
|
+ if (equipmentId) {
|
|
|
+ equipmentName.value = name;
|
|
|
+ }
|
|
|
+ getList(clientId.value);
|
|
|
+
|
|
|
+ });
|
|
|
+
|
|
|
+ // 获取清洗提醒开关状态
|
|
|
+ const getList = async (clientId) => { // 声明为异步函数
|
|
|
+ try {
|
|
|
+ const { data } = await getAlarmClean(clientId); // 使用await等待异步函数执行完毕并返回结果
|
|
|
+ // 处理获取到的data
|
|
|
+ console.log("data>>>", data);
|
|
|
+ if (data.data === null) {
|
|
|
+ showCheckBtn.value = false;
|
|
|
+ } else {
|
|
|
+ if (data.code === '00000') {
|
|
|
+ if (data.data.status === '0') {
|
|
|
+ checked.value = false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error('Error fetching data:', error);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ const updateStatus = (newValue) => {
|
|
|
+ const params = {
|
|
|
+ clientId: clientId.value,
|
|
|
+ status: newValue ? '1' : '0',
|
|
|
+ };
|
|
|
+ showConfirmDialog({
|
|
|
+ title: t('alramClean.tips'),
|
|
|
+ message: t('alramClean.content'),
|
|
|
+ }).then(async () => {
|
|
|
+ console.log("params.clientId>>>", params.clientId);
|
|
|
+ console.log("params.status>>>", params.status);
|
|
|
+ const { data } = await updateAlarmCleanStatus(params);
|
|
|
+ console.log("updateData>>>", data);
|
|
|
+ if (data.code) {
|
|
|
+ // checked.value = newValue;
|
|
|
+ showToast(t('alramClean.successfully'));
|
|
|
+ setTimeout(() => {
|
|
|
+ router.go(-1);
|
|
|
+ }, 1500);
|
|
|
+ } else {
|
|
|
+ showFailToast(data.message);
|
|
|
+ }
|
|
|
+ }).catch((error) => {
|
|
|
+ console.log(error);
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ return {
|
|
|
+ equipmentName,
|
|
|
+ switchStates,
|
|
|
+ checked,
|
|
|
+ updateStatus,
|
|
|
+ showCheckBtn
|
|
|
+ };
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped></style>
|
