临时提交

src/api/common.ts

@@ -48,6 +48,13 @@ class UsersApi extends ApiClient {
   getMyDeviceList(page: number) {
     return this.request({ url: '/myequipment/get/list', data: { p: page, c: 10 } })
   }
+  /** 获取设备详情 */
+  getDeviceDetail(equipmentId: string) {
+    return this.request({
+      method: 'GET',
+      url: `/myequipment/get/details/info/${equipmentId}`
+    })
+  }
 
   /** 添加新设备-PIN */
   addDevicePIN(pin: string) {

src/app.tsx

@@ -34,9 +34,10 @@ class App extends Component {
    */
   config: Config = {
     pages: [
+      'pages/home/tempaltes/index',
       'pages/home/device/index',
+      'pages/home/device/device_detail/index',
       'pages/system/wifi_list/index',
-      'pages/home/tempaltes/index',
       'pages/home/device/device_bind/index',
       'pages/home/user/index',
       'pages/home/device/my_device/index',

src/assets/styles/var.scss

@@ -6,7 +6,8 @@ $text-color: #323233;
 $input-color: #323233;
 $primary-color: #1989fa;
 $border-color: #ccc;
-$text-colot: #ccc;
+$text-color: #ccc;
+$primary-text-color: #333;
 
 @mixin border-bottom {
   border-style: solid;

src/pages/home/device/device_detail/index.scss

+@import '@styles/var.scss';
+
+.device-detail {
+  padding: 40px 40px 0;
+
+  @include eject(box-sizing, border-box);
+
+  &-item {
+    display: flex;
+    flex-direction: column;
+
+    .item-text {
+      padding: 20px 0;
+      color: $primary-text-color;
+    }
+  }
+}

src/pages/home/device/device_detail/index.tsx

+import api from '@/api/index'
+import { ComponentClass } from 'react'
+import Taro, { Component, Config } from '@tarojs/taro'
+import { View, Text, Input, Image, ScrollView, Button } from '@tarojs/components'
+
+import './index.scss'
+
+type PageStateProps = {}
+
+type PageDispatchProps = {}
+
+type PageOwnProps = {}
+
+interface IInfo {
+  filmId?: any
+  filmName?: any
+  clientId: string
+  equipmentId: string
+  clientSecret: string
+  equipmentUrl: string
+  equipmentName: string
+  equipmentState: string
+}
+
+type PageState = {
+  filmId?: any
+  filmName?: any
+  clientId: string
+  equipmentId: string
+  clientSecret: string
+  equipmentUrl: string
+  equipmentName: string
+  equipmentState: string
+}
+
+type IProps = PageStateProps & PageDispatchProps & PageOwnProps
+
+interface DeviceDetail {
+  props: IProps
+  state: PageState
+}
+
+class DeviceDetail extends Component {
+  config: Config = {
+    navigationBarTitleText: '设备详情'
+  }
+
+  private equipmentId: string
+
+  constructor(props: any) {
+    super(props)
+    this.equipmentId = this.$router.params.equipmentId || 'd73cc4ec13394a8ab5de7b8ce7f99fac'
+    // console.log(this.equipmentId)
+    this.state = {
+      clientId: '',
+      equipmentId: '',
+      clientSecret: '',
+      equipmentUrl: '',
+      equipmentName: '',
+      equipmentState: ''
+    }
+  }
+
+  componentWillMount() {
+    this.getData()
+  }
+
+  async getData() {
+    try {
+      const res = await api.common.getDeviceDetail(this.equipmentId)
+      const {
+        clientId,
+        equipmentId,
+        clientSecret,
+        equipmentUrl,
+        equipmentName,
+        equipmentState
+      } = res
+      this.setState({
+        clientId,
+        equipmentId,
+        clientSecret,
+        equipmentUrl,
+        equipmentName,
+        equipmentState
+      })
+      console.log({ res })
+    } catch (error) {
+      console.error(error)
+    }
+  }
+
+  render() {
+    const { equipmentName, equipmentUrl } = this.state
+    return (
+      <ScrollView className="device-detail" scrollY>
+        {/* <Text>hello world</Text> */}
+        <View className="device-detail-item">
+          <Text className="item-text">设备名称</Text>
+          <Input value={equipmentName} placeholder="请输入设备名称" />
+        </View>
+        <View className="device-detail-item">
+          <Text className="item-text">设备图片</Text>
+          <Image src={equipmentUrl} />
+        </View>
+        <View className="device-detail-item">
+          <Text className="item-text">屏幕板式</Text>
+          {/* <Image src="" /> */}
+        </View>
+        <View className="device-detail-item">
+          <Text className="item-text">屏幕分辨率</Text>
+          <Input placeholder="宽 * 高" />
+        </View>
+        <Button type="primary">确实</Button>
+      </ScrollView>
+    )
+  }
+}
+export default DeviceDetail as ComponentClass<PageOwnProps, PageState>

src/pages/home/device/device_list/index.tsx

@@ -113,6 +113,8 @@ class MyDevice extends Component {
     const { text } = info
     const { equipmentId } = item
     if (text === '编辑') {
+      // console.log('')
+      Taro.navigateTo({ url: `/pages/home/device/device_detail/index?equipmentId=${equipmentId}` })
     } else if (text === '删除') {
       Taro.showModal({ content: '确定要删除？' }).then(async ({ confirm }) => {
         if (confirm) {

src/pages/system/wifi_list/index.scss

@@ -26,7 +26,7 @@
     width: 100%;
     padding: 20px 0;
     font-size: 24px;
-    color: $text-colot;
+    color: $text-color;
     border: 0 solid $border-color;
     border-bottom-width: 1px;