完成基本功能

src/api/svc/bill/index.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 充值
+export function cz(data) {
+    return request({
+        url: '/bill/info/cz',
+        method: 'post',
+        data: data
+    })
+}
+
+// 查询账单信息列表
+export function listInfo(query) {
+    return request({
+        url: '/bill/info/list',
+        method: 'get',
+        params: query
+    })
+}
+
+// 查询账单信息详细
+export function getInfo(id) {
+    return request({
+        url: '/bill/info/' + id,
+        method: 'get'
+    })
+}
+
+// 新增账单信息
+export function addInfo(data) {
+    return request({
+        url: '/bill/info',
+        method: 'post',
+        data: data
+    })
+}
+
+// 修改账单信息
+export function updateInfo(data) {
+    return request({
+        url: '/bill/info',
+        method: 'put',
+        data: data
+    })
+}
+
+// 删除账单信息
+export function delInfo(id) {
+    return request({
+        url: '/bill/info/' + id,
+        method: 'delete'
+    })
+}

src/api/svc/cg/index.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询采购信息列表
+export function listInfo(query) {
+    return request({
+        url: '/cg/info/list',
+        method: 'get',
+        params: query
+    })
+}
+
+// 查询采购信息详细
+export function getInfo(id) {
+    return request({
+        url: '/cg/info/' + id,
+        method: 'get'
+    })
+}
+
+// 新增采购信息
+export function addInfo(data) {
+    return request({
+        url: '/cg/info',
+        method: 'post',
+        data: data
+    })
+}
+
+// 修改采购信息
+export function updateInfo(data) {
+    return request({
+        url: '/cg/info',
+        method: 'put',
+        data: data
+    })
+}
+
+// 删除采购信息
+export function delInfo(id) {
+    return request({
+        url: '/cg/info/' + id,
+        method: 'delete'
+    })
+}

src/api/svc/deal/index.js

@@ -0,0 +1,51 @@
+import request from '@/utils/request'
+
+// 查询交易信息列表
+export function listInfo(query) {
+    return request({
+        url: '/deal/info/list',
+        method: 'get',
+        params: query
+    })
+}
+
+// 查询交易信息详细
+export function getInfo(id) {
+    return request({
+        url: '/deal/info/' + id,
+        method: 'get'
+    })
+}
+
+// 新增交易信息
+export function addInfo(data) {
+    return request({
+        url: '/deal/info',
+        method: 'post',
+        data: data
+    })
+}
+
+// 修改交易信息
+export function updateInfo(data) {
+    return request({
+        url: '/deal/info',
+        method: 'put',
+        data: data
+    })
+}
+
+// 删除交易信息
+export function delInfo(id) {
+    return request({
+        url: '/deal/info/' + id,
+        method: 'delete'
+    })
+}
+
+export function grye() {
+    return request({
+        url: '/deal/info/grye',
+        method: 'get'
+    })
+}

src/api/svc/file/index.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询文件信息列表
+export function listInfo(query) {
+    return request({
+        url: '/file/info/list',
+        method: 'get',
+        params: query
+    })
+}
+
+// 查询文件信息详细
+export function getInfo(id) {
+    return request({
+        url: '/file/info/' + id,
+        method: 'get'
+    })
+}
+
+// 新增文件信息
+export function addInfo(data) {
+    return request({
+        url: '/file/info',
+        method: 'post',
+        data: data
+    })
+}
+
+// 修改文件信息
+export function updateInfo(data) {
+    return request({
+        url: '/file/info',
+        method: 'put',
+        data: data
+    })
+}
+
+// 删除文件信息
+export function delInfo(id) {
+    return request({
+        url: '/file/info/' + id,
+        method: 'delete'
+    })
+}

src/api/svc/hd/index.js

@@ -43,6 +43,13 @@ export function delInfo(id) {
     })
 }
 
+export function hdUser(id) {
+    return request({
+        url: '/hd/info/user/' + id,
+        method: 'get'
+    })
+}
+
 export function verify(query) {
     return request({
         url: '/hd/info/user/verify',
@@ -102,4 +109,34 @@ export function grzdZf(data) {
         method: 'post',
         data: data
     })
+}
+
+export function grls() {
+    return request({
+        url: '/hd/info/user/grls',
+        method: 'get'
+    })
+}
+
+export function hdWqd(id) {
+    return request({
+        url: '/hd/info/user/wqd/' + id,
+        method: 'get'
+    })
+}
+
+export function bq(data) {
+    return request({
+        url: '/hd/info/user/bq',
+        method: 'post',
+        data: data
+    })
+}
+
+export function bqq(data) {
+    return request({
+        url: '/hd/info/user/bqq',
+        method: 'post',
+        data: data
+    })
 }

src/api/svc/zd/index.js

@@ -0,0 +1,37 @@
+import request from '@/utils/request'
+
+export function grzd() {
+    return request({
+        url: '/zd/info/grzd',
+        method: 'get'
+    })
+}
+
+export function grzdDetail(id) {
+    return request({
+        url: '/zd/info/grzd/' + id,
+        method: 'get'
+    })
+}
+
+export function updateZfzt() {
+    return request({
+        url: '/zd/info/zfzt',
+        method: 'put'
+    })
+}
+
+export function updateDealId(data) {
+    return request({
+        url: '/zd/info/deal',
+        method: 'put',
+        data: data
+    })
+}
+
+export function grzdHd(id) {
+    return request({
+        url: '/zd/info/grzd/hd/' + id,
+        method: 'get'
+    })
+}

src/components/Hd/Pay/index.vue

@@ -0,0 +1,163 @@
+<template>
+    <el-drawer v-model="isShow" direction="btt" :with-header="false" body-class="pay-body">
+        <div class="pay-main" v-if="status">
+            <div class="pay-item" v-for="payMethod in filterPayMethods"
+                @click="changeDialogTableVisible(payMethod.name)">{{
+                    payMethod.value }}</div>
+        </div>
+        <div class="pay-main" v-if="!status">
+            <div class="pay-item" @click="wczf">我已完成支付</div>
+            <div class="pay-item" @click="reset">我已取消支付</div>
+        </div>
+    </el-drawer>
+    <div v-if="showCode" @click="showCode = false"
+        style="z-index: 3000;width: 100%;height: 100%;position: absolute;display: flex; justify-content: center;background-color: var(--el-overlay-color-lighter);">
+        <div style="width: 70%;">
+            <div @click.stop="" style="margin-top: 10vh;background-color: #fff;padding: 10px;font-size: 12px;">
+                <div style="width: 100%;display: flex;justify-content: center;">
+                    <span>长按、截图或</span><el-link @click="downloadImage" type="primary"
+                        style="font-size: 12px;">点击下载</el-link><span>，保存图片</span>
+                </div>
+                <img style="width: 100%;" :src="imgSrc" alt="">
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import { addInfo } from "@/api/svc/deal/index.js"
+
+const { proxy } = getCurrentInstance()
+
+const props = defineProps({
+    complete: {
+        type: Function,
+        default: () => { }
+    },
+    disPayMethods: {
+        type: Array,
+        default: []
+    },
+    category: {
+        type: String
+    },
+    amount: {
+        type: Number,
+        default: undefined
+    }
+})
+
+const isShow = ref(false)
+const showCode = ref(false)
+const status = ref(true)
+const form = ref({})
+const imgSrc = ref({})
+const lx = ref('')
+
+const payMethods = ref([
+    {
+        name: '1',
+        value: '余额'
+    },
+    {
+        name: '2',
+        value: '微信'
+    },
+    {
+        name: '3',
+        value: '支付宝'
+    }
+])
+
+const filterPayMethods = computed(() => {
+    return payMethods.value.filter(item => !props.disPayMethods.includes(item.name));
+});
+
+function changeShow() {
+    isShow.value = true
+}
+
+function changeDialogTableVisible(name) {
+    lx.value = name
+    form.value.jyfs = lx.value
+    if (lx.value !== '1') {
+        imgSrc.value = getAssetUrl()
+        showCode.value = true
+        status.value = false
+    } else wczf()
+}
+
+function wczf() {
+    form.value.jylx = props.category
+    form.value.amount = props.amount
+    addInfo(form.value).then(res => {
+        form.value = res.data
+        props.complete()
+        if (form.value.jyfs === '1') proxy.$modal.msgSuccess('支付成功')
+        else proxy.$modal.msgSuccess('支付成功待确认')
+    })
+    reset()
+}
+
+function getDealId() {
+    return form.value.id
+}
+
+function reset() {
+    form.value = {}
+    status.value = true
+    isShow.value = false
+}
+
+function getAssetUrl() {
+    if ('2' === lx.value) return new URL('@/assets/images/wx.jpg', import.meta.url).href
+    else if ('3' === lx.value) return new URL('@/assets/images/zfb.jpg', import.meta.url).href
+}
+
+function downloadImage() {
+    const link = document.createElement('a')
+    link.href = getAssetUrl()
+    if ('2' === lx.value) link.download = '微信付款码.jpg'
+    else if ('3' === lx.value) link.download = '支付宝付款码.jpg'
+    document.body.appendChild(link)
+    link.click()
+    document.body.removeChild(link)
+}
+
+defineExpose({
+    changeShow, getDealId
+})
+</script>
+
+<style>
+.pay-main {
+    display: flex;
+    flex-direction: column;
+}
+
+.pay-item {
+    width: 100%;
+    margin-top: 10px;
+    padding: 10px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background-color: #FFF;
+}
+
+.pay-body {
+    padding: 0;
+    background-color: #efefef;
+}
+
+.pay-image {
+    background-color: #FFF;
+    padding: 20px;
+    position: absolute;
+    width: 100%;
+    top: 30vh;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+</style>

src/components/ImageUpload/index.vue

@@ -1,25 +1,13 @@
 <template>
   <div class="component-upload-image">
-    <el-upload
-      multiple
-      :disabled="disabled"
-      :action="uploadImgUrl"
-      list-type="picture-card"
-      :on-success="handleUploadSuccess"
-      :before-upload="handleBeforeUpload"
-      :data="data"
-      :limit="limit"
-      :on-error="handleUploadError"
-      :on-exceed="handleExceed"
-      ref="imageUpload"
-      :before-remove="handleDelete"
-      :show-file-list="true"
-      :headers="headers"
-      :file-list="fileList"
-      :on-preview="handlePictureCardPreview"
-      :class="{ hide: fileList.length >= limit }"
-    >
-      <el-icon class="avatar-uploader-icon"><plus /></el-icon>
+    <el-upload multiple :disabled="disabled" :action="uploadImgUrl" list-type="picture-card"
+      :on-success="handleUploadSuccess" :before-upload="handleBeforeUpload" :data="data" :limit="limit"
+      :on-error="handleUploadError" :on-exceed="handleExceed" ref="imageUpload" :before-remove="handleDelete"
+      :show-file-list="true" :headers="headers" :file-list="fileList" :on-preview="handlePictureCardPreview"
+      :class="{ hide: fileList.length >= limit }">
+      <el-icon class="avatar-uploader-icon">
+        <plus />
+      </el-icon>
     </el-upload>
     <!-- 上传提示 -->
     <div class="el-upload__tip" v-if="showTip && !disabled">
@@ -33,16 +21,8 @@
       的文件
     </div>
 
-    <el-dialog
-      v-model="dialogVisible"
-      title="预览"
-      width="800px"
-      append-to-body
-    >
-      <img
-        :src="dialogImageUrl"
-        style="display: block; max-width: 100%; margin: 0 auto"
-      />
+    <el-dialog v-model="dialogVisible" title="预览" width="800px" append-to-body>
+      <img :src="dialogImageUrl" style="display: block; max-width: 100%; margin: 0 auto" />
     </el-dialog>
   </div>
 </template>
@@ -115,11 +95,11 @@ watch(() => props.modelValue, val => {
     const list = Array.isArray(val) ? val : props.modelValue.split(",")
     // 然后将数组转为对象数组
     fileList.value = list.map(item => {
-      if (typeof item === "string") {
-        if (item.indexOf(baseUrl) === -1 && !isExternal(item)) {
-          item = { name: baseUrl + item, url: baseUrl + item }
+      if (typeof item.url === "string") {
+        if (item.url.indexOf(baseUrl) === -1 && !isExternal(item.url)) {
+          item = { name: baseUrl + item.name, url: baseUrl + item.url }
         } else {
-          item = { name: item, url: item }
+          item = { name: item.name, url: item.url }
         }
       }
       return item
@@ -128,7 +108,7 @@ watch(() => props.modelValue, val => {
     fileList.value = []
     return []
   }
-},{ deep: true, immediate: true })
+}, { deep: true, immediate: true })
 
 // 上传前loading加载
 function handleBeforeUpload(file) {
@@ -173,7 +153,7 @@ function handleExceed() {
 // 上传成功回调
 function handleUploadSuccess(res, file) {
   if (res.code === 200) {
-    uploadList.value.push({ name: res.fileName, url: res.fileName })
+    uploadList.value.push({ name: res.data.name, url: baseUrl + '/file/' + res.data.id })
     uploadedSuccessfully()
   } else {
     number.value--
@@ -249,10 +229,10 @@ onMounted(() => {
 <style scoped lang="scss">
 // .el-upload--picture-card 控制加号部分
 :deep(.hide .el-upload--picture-card) {
-    display: none;
+  display: none;
 }
 
 :deep(.el-upload.el-upload--picture-card.is-disabled) {
   display: none !important;
-} 
+}
 </style>

src/main.js

@@ -19,6 +19,7 @@ import plugins from './plugins' // plugins
 import { download } from '@/utils/request'
 
 // svg图标
+import '@/assets/iconfont/iconfont.js'
 import 'virtual:svg-icons-register'
 import SvgIcon from '@/components/SvgIcon'
 import elementIcons from '@/components/SvgIcon/svgicon'

src/router/index.js

@@ -82,6 +82,10 @@ export const constantRoutes = [
         path: 'zd/detail',
         component: () => import('@/views/hd/zd/detail/index'),
       },
+      {
+        path: 'cg',
+        component: () => import('@/views/hd/cg/index'),
+      },
       {
         path: 'wd',
         component: () => import('@/views/hd/wd/index'),

src/views/hd/cg/index.vue

@@ -0,0 +1,13 @@
+<template>
+    <div>
+        <ImagePreview :src="'/file/5'" width="100px" height="100px" />
+
+    </div>
+</template>
+
+<script setup>
+import ImagePreview from '@/components/ImagePreview/index.vue'
+
+</script>
+
+<style scoped></style>

src/views/hd/his/detail/index.vue

@@ -1,56 +1,162 @@
 <template>
-    <div class="his-main">
-        <el-form :model="form" label-width="auto" label-position="right">
-            <el-form-item label="活动日期">
-                <el-input v-model="form.hdrq" disabled />
-            </el-form-item>
-            <el-form-item label="球耗数量">
-                <el-input v-model="form.qhsl" />
-            </el-form-item>
-            <el-form-item label="总费用">
-                <el-input v-model="form.totalCost" />
-            </el-form-item>
-            <el-form-item class="btn">
-                <el-button type="primary" @click="submitForm()">
-                    提交
-                </el-button>
-            </el-form-item>
-        </el-form>
+    <div class="his" style="display: flex;flex-direction: column;width: 100%;align-items: center;">
+        <div class="common-item" style="justify-content: center;width: 80%;">
+            <el-text type="info" size="large">活动信息</el-text>
+        </div>
+        <div class="his-main">
+            <el-form :model="form" label-width="auto" label-position="right">
+                <el-form-item label="活动日期">
+                    <el-input v-model="form.hdrq" disabled />
+                </el-form-item>
+                <el-form-item label="球耗数量">
+                    <el-input v-model="form.qhsl" />
+                </el-form-item>
+                <el-form-item label="总费用">
+                    <el-input v-model="form.totalCost" />
+                </el-form-item>
+                <div v-if="showBtn" style="display: flex;justify-content: right;">
+                    <el-form-item class="btn" style="margin: 0;">
+                        <el-button type="primary" @click="submitForm()">
+                            提交
+                        </el-button>
+                    </el-form-item>
+                </div>
+            </el-form>
+        </div>
+        <div class="user-main" style="width: 80%;">
+            <div class="common-item" style="justify-content: center;">
+                <el-text type="info" size="large">活动签到</el-text>
+            </div>
+            <div v-for="user in userList" class="common-item">
+                <div style="display: flex; justify-content: space-between;width: 100%;align-items: center;">
+                    <span>{{ user.nickName }}</span>
+                    <el-popconfirm class="box-item" title="确认是否删除签到记录" width="180px" :hide-icon="true"
+                        @confirm="handlerDelete(user.userId)">
+                        <template #reference>
+                            <div
+                                style="width: 20px;height: 20px;border-radius: 20px;display: flex;justify-content: center;align-items: center;background-color: red;">
+                                <SvgIcon iconClass="guanbi" color="#FFF" className="close" />
+                            </div>
+                        </template>
+                    </el-popconfirm>
+                </div>
+            </div>
+            <div @click="handlerAdd" class="common-item" style="justify-content: center;">
+                <span style="user-select: none;">+</span>
+            </div>
+        </div>
+        <el-dialog v-model="showDialog" title="可帮签到人员" width="300">
+            <el-form>
+                <el-form-item label="姓名">
+                    <el-select v-model="bqUserId" placeholder="">
+                        <el-option v-for="user in kbqUserList" :label="user.nickName" :value="user.userId" />
+                    </el-select>
+                </el-form-item>
+            </el-form>
+            <template #footer>
+                <div class="dialog-footer">
+                    <el-button @click="showDialog = false">取消</el-button>
+                    <el-button type="primary" @click="handlerConfirm">
+                        确认
+                    </el-button>
+                </div>
+            </template>
+        </el-dialog>
     </div>
 </template>
 
 <script setup>
+import SvgIcon from '@/components/SvgIcon'
+
 import { onMounted } from 'vue';
-import { getInfo, updateInfo } from "@/api/svc/hd"
+import { getInfo, updateInfo, hdUser, hdWqd, bq, bqq } from "@/api/svc/hd"
 import { ref } from 'vue';
 
+const { proxy } = getCurrentInstance()
+
 const route = useRoute()
 
 const form = ref({})
+const showBtn = ref(false)
+const showDialog = ref(false)
+const userList = ref([])
+const kbqUserList = ref([])
+const bqUserId = ref(null)
 
 function submitForm() {
     updateInfo(form.value).then(res => {
-        console.log(res);
+        proxy.$modal.msgSuccess('提交成功')
+    })
+}
+
+function handlerDelete(userId) {
+    bqq({ userId, fid: route.query.id }).then(res => {
+        setUserList()
+    })
+}
+
+function handlerAdd() {
+    setKbqUserList()
+    showDialog.value = true
+}
+
+function handlerConfirm() {
+    bq({ userId: bqUserId.value, fid: route.query.id }).then(res => {
+        showDialog.value = false
+        setUserList()
+        bqUserId.value = null
+    })
+}
 
+function setKbqUserList() {
+    hdWqd(route.query.id).then(res => {
+        kbqUserList.value = res.data
+    })
+}
+
+function setUserList() {
+    hdUser(route.query.id).then(res => {
+        userList.value = res.data
     })
 }
 
 onMounted(() => {
     getInfo(route.query.id).then(res => {
         form.value = res.data
+        showBtn.value = !form.value.jszt
     })
+    setUserList()
+    setKbqUserList()
 })
 </script>
 
 <style scoped>
+.close {
+    font-size: 10px;
+}
+
 .his-main {
-    width: 100%;
+    width: 80%;
     display: flex;
     flex-direction: column;
     align-items: center;
+    background-color: #fff;
+    padding: 15px;
+    border-radius: 5px;
+    margin-top: 10px;
+}
+
+.el-form-item:last-child {
+    margin: 0;
 }
 
-.el-form-item {
+.common-item {
+    width: 100%;
+    background-color: #FFF;
+    border-radius: 5px;
+    margin: 0 auto;
     margin-top: 10px;
+    padding: 10px;
+    display: flex;
 }
 </style>

src/views/hd/his/index.vue

@@ -6,19 +6,12 @@
 </template>
 
 <script setup>
-import { his } from "@/api/svc/hd"
-import { onMounted, ref, watch } from "vue";
+import { grls } from "@/api/svc/hd"
+import { onMounted, ref } from "vue";
 
 const router = useRouter()
 const list = ref([])
 
-const params = ref({
-    pageNum: 1,
-    pageSize: 10,
-    orderByColumn: 'hdrq',
-    isAsc: 'desc'
-})
-
 function bgc(data) {
     if (data.totalCost) return '#67c23a';
     else return '#E6A23C';
@@ -28,19 +21,10 @@ function toDetail(id) {
     router.push({ path: '/hd/his/detail', query: { id } })
 }
 
-function handleData() {
-    his(params.value).then(res => {
-        list.value = res.rows
-    })
-}
-
-watch(list, (newVal, oldVal) => {
-    console.log(newVal);
-
-})
-
 onMounted(() => {
-    handleData()
+    grls().then(res => {
+        list.value = res.data
+    })
 })
 </script>
 

src/views/hd/index.vue

@@ -12,6 +12,7 @@
             <div class="sidebar-item"><router-link to="/hd/qd">签到</router-link></div>
             <div class="sidebar-item"><router-link to="/hd/his">历史</router-link></div>
             <div class="sidebar-item"><router-link to="/hd/zd">账单</router-link></div>
+            <!-- <div class="sidebar-item"><router-link to="/hd/cg">采购</router-link></div> -->
             <div class="sidebar-item"><router-link to="/hd/wd">我的</router-link></div>
         </div>
     </div>
@@ -25,6 +26,7 @@ const currentRouteTitle = computed(() => {
     if (path.includes('qd')) return '签到';
     if (path.includes('his')) return '历史';
     if (path.includes('zd')) return '账单';
+    if (path.includes('cg')) return '采购';
     if (path.includes('wd')) return '我的';
 })
 </script>
@@ -50,6 +52,7 @@ const currentRouteTitle = computed(() => {
     flex-grow: 1;
     display: flex;
     background-color: #efefef;
+    overflow: scroll;
 }
 
 .sidebar {

src/views/hd/wd/index.vue

@@ -10,25 +10,32 @@
                     <div>余额：￥{{ balance }}</div>
                 </div>
             </div>
-            <div class="info_1"><span>充值</span><span>></span></div>
+            <div class="info_1" @click="handleCz"><span>充值</span><span>></span></div>
         </div>
     </div>
+    <Pay ref="pay" :disPayMethods="['1']" :category="'1'"></Pay>
 </template>
 
 <script setup>
-import { getUserProfile } from '@/api/system/user.js'
-import { getBalance } from '@/api/svc/user'
+import Pay from '@/components/Hd/Pay/index'
+
+import { getUserProfile } from '@/api/system/user'
+import { grye } from '@/api/svc/deal'
 import { onMounted } from 'vue';
 
 const user = ref({})
-
 const balance = ref(0)
+const pay = ref()
+
+function handleCz() {
+    pay.value.changeShow()
+}
 
 onMounted(() => {
-    getUserProfile().then(res=>{
+    getUserProfile().then(res => {
         user.value = res.data
     })
-    getBalance().then(res=>{
+    grye().then(res => {
         balance.value = res.data
     })
 })
@@ -62,7 +69,7 @@ onMounted(() => {
     align-items: center;
 }
 
-.info_1{
+.info_1 {
     background-color: #FFF;
     margin-top: 10px;
     padding: 5px;

src/views/hd/zd/detail/index.vue

@@ -2,68 +2,92 @@
     <div class="zd-main">
         <div class="zd">
             <div>
-                <span>{{ zdmc }}</span>(<span>{{ rqfw }}</span>)
+                <span>已出账单</span>(<span>{{ rqfw }}</span>)
             </div>
-            <div class="zd-je">￥{{ form.je }}</div>
-            <el-button v-if="form.zfzt === '0' && form.czzt === '1'" style="align-self: flex-end;" type="primary" round
-                @click="handleZf">支付</el-button>
-            <el-button v-if="form.zfzt === '0' && form.czzt === '0'" style="align-self: flex-end;" type="info"
-                round>待出账</el-button>
-            <el-button v-if="form.zfzt === '1'" style="align-self: flex-end;" type="success" round>已支付</el-button>
+            <div class="zd-je">￥{{ form.money }}</div>
+            <el-button @click="handleZf" style="align-self: flex-end;" :type="btType" round>{{ btVal }}</el-button>
+        </div>
+        <div class="hd">
+            <div class="hd-item" v-for="hd in hdList" @click="toHdDetail(hd.id)">{{ hd.hdrq }}</div>
         </div>
     </div>
+    <Pay ref="pay" :category="'2'" :amount="form.money" :complete="wczf"></Pay>
 </template>
 
 <script setup>
+import Pay from "@/components/Hd/Pay/index.vue"
+
 import { computed, onMounted } from 'vue';
-import { grzdDetail, grzdZf } from "@/api/svc/hd"
+import { grzdDetail, updateDealId, grzdHd } from "@/api/svc/zd"
 
+const router = useRouter()
 const route = useRoute()
-
+const pay = ref()
 const form = ref({})
+const hdList = ref([])
 
-const rqfw = computed(() => {
-    return getFirstAndLastDayOfMonth().startDate + '-' + getFirstAndLastDayOfMonth().endDate
+const btVal = computed(() => {
+    if (form.value.zfzt === '1') return '已支付'
+    if (form.value.zfzt === '2') return '已支付待确认'
+    else return '支付'
+})
+
+const btType = computed(() => {
+    if (form.value.czzt === '0') return 'info'
+    else if (form.value.czzt === '1' && form.value.jezt === '0' && form.value.zfzt === '0') return 'info'
+    else if (form.value.czzt === '1' && form.value.jezt === '1' && form.value.zfzt === '0') return 'primary'
+    else if (form.value.zfzt === '1') return 'success'
 })
 
-const zdmc = computed(() => {
-    if (form.value.czzt === '0') return '未出账单'
-    if (form.value.czzt === '1') return '已出账单'
+const rqfw = computed(() => {
+    return getOneMonthAgo(form.value.zdrq) + '-' + form.value.zdrq
 })
 
 function handleZf() {
-    grzdZf({ ny: form.value.ny }).then(res => {
-        form.zfzt = '1'
-    })
+    if (form.value.zfzt === '0') pay.value.changeShow()
+}
+
+function wczf() {
+    const dealId = pay.value.getDealId()
+    console.log(dealId);
+
+    updateDealId({ zdId: route.query.id, dealId })
 }
 
-function getFirstAndLastDayOfMonth() {
-    // 获取当前日期
-    let date = new Date(route.query.ny);
+function getOneMonthAgo(dateInput) {
+    // 1. 转换为Date对象
+    const date = new Date(dateInput);
 
-    // 获取当前年份
-    let year = date.getFullYear();
+    // 2. 处理无效日期
+    if (isNaN(date)) return '无效日期';
 
-    // 获取当前月份（0-11）
-    let month = date.getMonth();
+    // 3. 复制原日期避免污染
+    const result = new Date(date);
 
-    // 获取当月第一天
-    let firstDay = new Date(year, month, 1);
+    // 4. 获取目标月份并减1月
+    result.setMonth(result.getMonth() - 1);
 
-    // 获取当月最后一天
-    let lastDay = new Date(year, month + 1, 0);
+    // 5. 处理跨月校正（如3月31日变成2月28日）
+    if (date.getDate() !== result.getDate()) {
+        // 回退到上个月最后一天
+        result.setDate(0);
+    }
 
-    // 格式化日期为 YYYY-MM-DD
-    let startDate = `${year}-${(month + 1).toString().padStart(2, '0')}-01`;
-    let endDate = `${year}-${(month + 1).toString().padStart(2, '0')}-${lastDay.getDate().toString().padStart(2, '0')}`;
+    // 6. 返回格式化字符串（按需调整格式）
+    return result.toISOString().split('T')[0];
+}
 
-    return { startDate, endDate };
+function toHdDetail(id) {
+    router.push({ path: '/hd/his/detail', query: { id } })
 }
 
 onMounted(() => {
-    grzdDetail(route.query.ny).then(res => {
+    grzdDetail(route.query.id).then(res => {
         form.value = res.data
     })
+    grzdHd(route.query.id).then(res => {
+        hdList.value = res.data
+    })
 })
 </script>
 
@@ -75,7 +99,19 @@ onMounted(() => {
 .zd {
     width: 80%;
     background-color: #FFF;
-    border-radius: 10px;
+    border-radius: 5px;
+    margin: 0 auto;
+    margin-top: 10px;
+    padding: 10px;
+    display: flex;
+    align-items: start;
+    flex-direction: column;
+}
+
+.hd-item {
+    width: 80%;
+    background-color: #FFF;
+    border-radius: 5px;
     margin: 0 auto;
     margin-top: 10px;
     padding: 10px;

src/views/hd/zd/index.vue

@@ -1,13 +1,13 @@
 <template>
     <ul class="list">
-        <li class="list-item" :style="{ backgroundColor: bgc(data) }" v-for="data in list" @click="toDetail(data.ny)">{{
-            data.ny }}
+        <li class="list-item" :style="{ backgroundColor: bgc(data) }" v-for="data in list" @click="toDetail(data.id)">
+            {{ data.zdrq }}
         </li>
     </ul>
 </template>
 
 <script setup>
-import { grzd } from "@/api/svc/hd"
+import { grzd } from "@/api/svc/zd"
 import { onMounted, ref, watch } from "vue";
 
 const router = useRouter()
@@ -21,19 +21,17 @@ const params = ref({
 })
 
 function bgc(data) {
-    if (data.zfzt === '1') return '#67c23a';
-    if (data.czzt === '0') return '#909399';
-    else if (data.czzt === '1' && data.fyzt === '0') return '#e6a23c';
-    else if (data.czzt === '1' && data.zfzt === '0' && data.fyzt === '1') return '#409eff';
+    if (data.zfzt === '0') return '#E6A23C'
+    else return '#67C23A'
 }
 
-function toDetail(ny) {
-    router.push({ path: '/hd/zd/detail', query: { ny } })
+function toDetail(id) {
+    router.push({ path: '/hd/zd/detail', query: { id } })
 }
 
 function handleData() {
     grzd(params.value).then(res => {
-        list.value = res.rows
+        list.value = res.data
     })
 }
 

src/views/login.vue

@@ -3,52 +3,28 @@
     <el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
       <h3 class="title">{{ title }}</h3>
       <el-form-item prop="username">
-        <el-input
-          v-model="loginForm.username"
-          type="text"
-          size="large"
-          auto-complete="off"
-          placeholder="账号"
-        >
+        <el-input v-model="loginForm.username" type="text" size="large" auto-complete="off" placeholder="账号">
           <template #prefix><svg-icon icon-class="user" class="el-input__icon input-icon" /></template>
         </el-input>
       </el-form-item>
       <el-form-item prop="password">
-        <el-input
-          v-model="loginForm.password"
-          type="password"
-          size="large"
-          auto-complete="off"
-          placeholder="密码"
-          @keyup.enter="handleLogin"
-        >
+        <el-input v-model="loginForm.password" type="password" size="large" auto-complete="off" placeholder="密码"
+          @keyup.enter="handleLogin">
           <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template>
         </el-input>
       </el-form-item>
       <el-form-item prop="code" v-if="captchaEnabled">
-        <el-input
-          v-model="loginForm.code"
-          size="large"
-          auto-complete="off"
-          placeholder="验证码"
-          style="width: 63%"
-          @keyup.enter="handleLogin"
-        >
+        <el-input v-model="loginForm.code" size="large" auto-complete="off" placeholder="验证码" style="width: 63%"
+          @keyup.enter="handleLogin">
           <template #prefix><svg-icon icon-class="validCode" class="el-input__icon input-icon" /></template>
         </el-input>
         <div class="login-code">
-          <img :src="codeUrl" @click="getCode" class="login-code-img"/>
+          <img :src="codeUrl" @click="getCode" class="login-code-img" />
         </div>
       </el-form-item>
       <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
       <el-form-item style="width:100%;">
-        <el-button
-          :loading="loading"
-          size="large"
-          type="primary"
-          style="width:100%;"
-          @click.prevent="handleLogin"
-        >
+        <el-button :loading="loading" size="large" type="primary" style="width:100%;" @click.prevent="handleLogin">
           <span v-if="!loading">登 录</span>
           <span v-else>登 录 中...</span>
         </el-button>
@@ -77,8 +53,8 @@ const router = useRouter()
 const { proxy } = getCurrentInstance()
 
 const loginForm = ref({
-  username: "admin",
-  password: "admin123",
+  username: "",
+  password: "",
   rememberMe: false,
   code: "",
   uuid: ""
@@ -95,11 +71,11 @@ const loading = ref(false)
 // 验证码开关
 const captchaEnabled = ref(true)
 // 注册开关
-const register = ref(false)
+const register = ref(true)
 const redirect = ref(undefined)
 
 watch(route, (newRoute) => {
-    redirect.value = newRoute.query && newRoute.query.redirect
+  redirect.value = newRoute.query && newRoute.query.redirect
 }, { immediate: true })
 
 function handleLogin() {
@@ -172,6 +148,7 @@ getCookie()
   background-image: url("../assets/images/login-background.jpg");
   background-size: cover;
 }
+
 .title {
   margin: 0px auto 30px auto;
   text-align: center;
@@ -184,32 +161,39 @@ getCookie()
   width: 400px;
   padding: 25px 25px 5px 25px;
   z-index: 1;
+
   .el-input {
     height: 40px;
+
     input {
       height: 40px;
     }
   }
+
   .input-icon {
     height: 39px;
     width: 14px;
     margin-left: 0px;
   }
 }
+
 .login-tip {
   font-size: 13px;
   text-align: center;
   color: #bfbfbf;
 }
+
 .login-code {
   width: 33%;
   height: 40px;
   float: right;
+
   img {
     cursor: pointer;
     vertical-align: middle;
   }
 }
+
 .el-login-footer {
   height: 40px;
   line-height: 40px;
@@ -222,6 +206,7 @@ getCookie()
   font-size: 12px;
   letter-spacing: 1px;
 }
+
 .login-code-img {
   height: 40px;
   padding-left: 12px;