af-mobile-client-vue3 1.3.12 → 1.3.14

package/src/views/component/XCellDetailView/index.vue

@@ -1,217 +1,217 @@
-<script setup lang="ts">
-import XCellDetail from '@af-mobile-client-vue3/components/data/XCellDetail/index.vue'
-import NormalDataLayout from '@af-mobile-client-vue3/components/layout/NormalDataLayout/index.vue'
-import TabBarLayout from '@af-mobile-client-vue3/components/layout/TabBarLayout/index.vue'
-import { remove } from '@af-mobile-client-vue3/services/api/common'
-import {
-  showConfirmDialog,
-  showFailToast,
-  showSuccessToast,
-  Cell as VanCell,
-  CellGroup as VanCellGroup,
-  Dialog as VanDialog,
-  Field as VanField,
-  Form as VanForm,
-  Grid as VanGrid,
-  GridItem as VanGridItem,
-  Popup as VanPopup,
-} from 'vant'
-import { onMounted, ref } from 'vue'
-import { useRoute } from 'vue-router'
-
-const options = ref([
-  { text: '微信', icon: 'wechat' },
-  { text: '微博', icon: 'weibo' },
-  { text: '微信', icon: 'wechat' },
-  { text: '微博', icon: 'weibo' },
-  { text: '微信', icon: 'wechat' },
-  { text: '微博', icon: 'weibo' },
-  { text: '微信', icon: 'wechat' },
-  { text: '微博', icon: 'weibo' },
-])
-
-const barList = ref([
-  { icon: 'edit', text: '编辑', method: 'editElement' },
-  { icon: 'delete-o', text: '删除', method: 'delElement' },
-  { icon: 'ellipsis', text: '更多', method: 'getMore' },
-])
-
-const serviceName = ref('af-system')
-
-const queryParamsName = ref('crud_oper_log_manage')
-
-const route = useRoute()
-
-const id = ref(-1)
-
-const showMore = ref(false)
-
-const showEdit = ref(false)
-
-const msg = ref({
-  info1: '',
-  info2: '',
-})
-
-const loading = ref(true)
-
-const detailContent = ref({
-  编号: '测试编号3.1415926...',
-  姓名: '测试人员',
-  部门: '测试部门',
-  完成日期: '测试时间 2024/4/16 16:59:12',
-  请求方式: '测试方法 POST',
-  请求ip: '测试ip 127.0.0.1',
-})
-
-const callbacks = {
-  editElement,
-  delElement,
-  getMore,
-}
-
-function editElement() {
-  showEdit.value = true
-}
-
-function doEdit() {
-  showEdit.value = false
-}
-function delElement() {
-  showConfirmDialog({
-    title: '提示',
-    message:
-      `确认删除---${id.value}---?`,
-    closeOnClickOverlay: true,
-  })
-    .then(() => {
-      const params = {
-        queryParamsName: queryParamsName.value,
-        idList: [id.value],
-      }
-      remove(params, serviceName)
-        .then((_res) => {
-          showSuccessToast('删除成功')
-          history.back()
-        })
-        .catch((_err) => {
-          showFailToast('删除失败')
-        })
-    })
-    .catch((err) => {
-      console.warn(err)
-    })
-}
-
-function getMore() {
-  showMore.value = true
-}
-
-onMounted(() => {
-  id.value = route.params.id as unknown as number
-  setTimeout(() => {
-    loading.value = false
-  }, 1000)
-})
-</script>
-
-<template>
-  <div id="XCellDetailView">
-    <NormalDataLayout title="详情" class="normal-body">
-      <template #layout_content>
-        <XCellDetail
-          title="测试标题"
-          describe="测试描述信息"
-          extra="12345"
-          :loading="loading"
-          :status-bar="{ icon: 'success', color: 'green' }"
-        >
-          <template #detailContent>
-            <div v-for="(value, key) in detailContent" :key="key" class="detail-content">
-              <div class="detail-content-title">
-                {{ key }}
-              </div>
-              <div class="detail-content-msg">
-                {{ value }}
-              </div>
-            </div>
-          </template>
-        </XCellDetail>
-      </template>
-    </NormalDataLayout>
-    <TabBarLayout :bar-list="barList" :callbacks="callbacks" />
-    <VanPopup
-      v-model:show="showMore"
-      class="pop-box"
-      :overlay-style="{ height: '92.5vh', top: '7.5vh' }"
-      round
-      position="bottom"
-    >
-      <div class="grid-box">
-        <VanGrid :gutter="10">
-          <VanGridItem v-for="(item, index) in options" :key="index" :icon="(item as any).icon" :text="(item as any).text" />
-        </VanGrid>
-      </div>
-      <VanCell class="cell" title="取消" @click="showMore = false" />
-    </VanPopup>
-    <VanDialog :show="showEdit" title="编辑信息" :close-on-click-overlay="true" @confirm="doEdit">
-      <VanForm>
-        <VanCellGroup class="cell-group">
-          <VanField
-            v-model="msg.info1"
-            name="信息一"
-            label="信息一"
-            placeholder="请填写信息一"
-            :rules="[{ required: true, message: '信息一不得为空' }]"
-          />
-          <VanField
-            v-model="msg.info2"
-            name="信息二"
-            label="信息二"
-            placeholder="请填写信息二"
-            :rules="[{ required: true, message: '信息二不得为空' }]"
-          />
-        </VanCellGroup>
-      </VanForm>
-    </VanDialog>
-  </div>
-</template>
-
-<style scoped lang="less">
-#XCellDetailView {
-  .normal-body {
-    height: 92vh;
-  }
-  .grid-box {
-    background-color: #f7f8fa;
-    margin-top: 2vh;
-    :deep(.van-grid-item__content) {
-      background-color: #f7f8fa;
-    }
-    :deep(.van-grid-item__content:hover) {
-      background-color: white;
-    }
-  }
-  .pop-box {
-    height: 28vh;
-    background-color: #f7f8fa;
-  }
-  .cell {
-    margin-top: 1vh;
-    text-align: center;
-  }
-  .cell-group {
-    margin-top: 2vh;
-    margin-bottom: 2vh;
-  }
-  .detail-content {
-    margin: 5px 0 0 0;
-    font-size: 15px;
-    .detail-content-title {
-      font-size: 13px;
-      margin-bottom: 5px;
-      color: var(--van-text-color-2);
-    }
-  }
-}
-</style>
+<script setup lang="ts">
+import XCellDetail from '@af-mobile-client-vue3/components/data/XCellDetail/index.vue'
+import NormalDataLayout from '@af-mobile-client-vue3/components/layout/NormalDataLayout/index.vue'
+import TabBarLayout from '@af-mobile-client-vue3/components/layout/TabBarLayout/index.vue'
+import { remove } from '@af-mobile-client-vue3/services/api/common'
+import {
+  showConfirmDialog,
+  showFailToast,
+  showSuccessToast,
+  Cell as VanCell,
+  CellGroup as VanCellGroup,
+  Dialog as VanDialog,
+  Field as VanField,
+  Form as VanForm,
+  Grid as VanGrid,
+  GridItem as VanGridItem,
+  Popup as VanPopup,
+} from 'vant'
+import { onMounted, ref } from 'vue'
+import { useRoute } from 'vue-router'
+
+const options = ref([
+  { text: '微信', icon: 'wechat' },
+  { text: '微博', icon: 'weibo' },
+  { text: '微信', icon: 'wechat' },
+  { text: '微博', icon: 'weibo' },
+  { text: '微信', icon: 'wechat' },
+  { text: '微博', icon: 'weibo' },
+  { text: '微信', icon: 'wechat' },
+  { text: '微博', icon: 'weibo' },
+])
+
+const barList = ref([
+  { icon: 'edit', text: '编辑', method: 'editElement' },
+  { icon: 'delete-o', text: '删除', method: 'delElement' },
+  { icon: 'ellipsis', text: '更多', method: 'getMore' },
+])
+
+const serviceName = ref('af-system')
+
+const queryParamsName = ref('crud_oper_log_manage')
+
+const route = useRoute()
+
+const id = ref(-1)
+
+const showMore = ref(false)
+
+const showEdit = ref(false)
+
+const msg = ref({
+  info1: '',
+  info2: '',
+})
+
+const loading = ref(true)
+
+const detailContent = ref({
+  编号: '测试编号3.1415926...',
+  姓名: '测试人员',
+  部门: '测试部门',
+  完成日期: '测试时间 2024/4/16 16:59:12',
+  请求方式: '测试方法 POST',
+  请求ip: '测试ip 127.0.0.1',
+})
+
+const callbacks = {
+  editElement,
+  delElement,
+  getMore,
+}
+
+function editElement() {
+  showEdit.value = true
+}
+
+function doEdit() {
+  showEdit.value = false
+}
+function delElement() {
+  showConfirmDialog({
+    title: '提示',
+    message:
+      `确认删除---${id.value}---?`,
+    closeOnClickOverlay: true,
+  })
+    .then(() => {
+      const params = {
+        queryParamsName: queryParamsName.value,
+        idList: [id.value],
+      }
+      remove(params, serviceName)
+        .then((_res) => {
+          showSuccessToast('删除成功')
+          history.back()
+        })
+        .catch((_err) => {
+          showFailToast('删除失败')
+        })
+    })
+    .catch((err) => {
+      console.warn(err)
+    })
+}
+
+function getMore() {
+  showMore.value = true
+}
+
+onMounted(() => {
+  id.value = route.params.id as unknown as number
+  setTimeout(() => {
+    loading.value = false
+  }, 1000)
+})
+</script>
+
+<template>
+  <div id="XCellDetailView">
+    <NormalDataLayout title="详情" class="normal-body">
+      <template #layout_content>
+        <XCellDetail
+          title="测试标题"
+          describe="测试描述信息"
+          extra="12345"
+          :loading="loading"
+          :status-bar="{ icon: 'success', color: 'green' }"
+        >
+          <template #detailContent>
+            <div v-for="(value, key) in detailContent" :key="key" class="detail-content">
+              <div class="detail-content-title">
+                {{ key }}
+              </div>
+              <div class="detail-content-msg">
+                {{ value }}
+              </div>
+            </div>
+          </template>
+        </XCellDetail>
+      </template>
+    </NormalDataLayout>
+    <TabBarLayout :bar-list="barList" :callbacks="callbacks" />
+    <VanPopup
+      v-model:show="showMore"
+      class="pop-box"
+      :overlay-style="{ height: '92.5vh', top: '7.5vh' }"
+      round
+      position="bottom"
+    >
+      <div class="grid-box">
+        <VanGrid :gutter="10">
+          <VanGridItem v-for="(item, index) in options" :key="index" :icon="(item as any).icon" :text="(item as any).text" />
+        </VanGrid>
+      </div>
+      <VanCell class="cell" title="取消" @click="showMore = false" />
+    </VanPopup>
+    <VanDialog :show="showEdit" title="编辑信息" :close-on-click-overlay="true" @confirm="doEdit">
+      <VanForm>
+        <VanCellGroup class="cell-group">
+          <VanField
+            v-model="msg.info1"
+            name="信息一"
+            label="信息一"
+            placeholder="请填写信息一"
+            :rules="[{ required: true, message: '信息一不得为空' }]"
+          />
+          <VanField
+            v-model="msg.info2"
+            name="信息二"
+            label="信息二"
+            placeholder="请填写信息二"
+            :rules="[{ required: true, message: '信息二不得为空' }]"
+          />
+        </VanCellGroup>
+      </VanForm>
+    </VanDialog>
+  </div>
+</template>
+
+<style scoped lang="less">
+#XCellDetailView {
+  .normal-body {
+    height: 92vh;
+  }
+  .grid-box {
+    background-color: #f7f8fa;
+    margin-top: 2vh;
+    :deep(.van-grid-item__content) {
+      background-color: #f7f8fa;
+    }
+    :deep(.van-grid-item__content:hover) {
+      background-color: white;
+    }
+  }
+  .pop-box {
+    height: 28vh;
+    background-color: #f7f8fa;
+  }
+  .cell {
+    margin-top: 1vh;
+    text-align: center;
+  }
+  .cell-group {
+    margin-top: 2vh;
+    margin-bottom: 2vh;
+  }
+  .detail-content {
+    margin: 5px 0 0 0;
+    font-size: 15px;
+    .detail-content-title {
+      font-size: 13px;
+      margin-bottom: 5px;
+      color: var(--van-text-color-2);
+    }
+  }
+}
+</style>