lufaneng
/
lift-drawing-wechat
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1

Browse Source
main
Lufaneng 9 months ago
parent 7e2a9e7594
commit b5e5a0f56f
2 changed files with 295 additions and 255 deletions
Show Stats Download Patch File Download Diff File

3
pages.json
Unescape View File

@ -19,7 +19,8 @@
"path": "pages/index/index", "path": "pages/index/index",
"needLogin": true, "needLogin": true,
"style": { "style": {
"navigationBarTitleText": "电梯图纸生成平台" "navigationBarTitleText": "电梯图纸生成平台",
"enablePullDownRefresh":true
} }
}, },
{ {

547
pages/index/index.vue
Unescape View File

@ -15,45 +15,42 @@
<view class="section"> <view class="section">
<view class="section-title">选择图纸模板</view> <view class="section-title">选择图纸模板</view>
<uv-skeletons v-if="loading" :loading="loading" :skeleton="[{ <uv-skeletons v-if="loading" :loading="loading" :skeleton="[{
type: 'flex', type: 'flex',
num: 2, num: 2,
gap: '20rpx',
children: [{
type: 'custom',
num: 1,
gap: '20rpx', gap: '20rpx',
children:[{ style: 'width: 300rpx;height:200rpx;marginLeft: 10rpx;'
type: 'custom', }, {
num: 1, type: 'custom',
gap: '20rpx', num: 1,
style: 'width: 300rpx;height:200rpx;marginLeft: 10rpx;' gap: '20rpx',
},{ style: 'width: 300rpx;height:200rpx;marginLeft: 10rpx;'
type: 'custom', }]
num: 1, }]"></uv-skeletons>
gap: '20rpx',
style: 'width: 300rpx;height:200rpx;marginLeft: 10rpx;'
}]
}]"></uv-skeletons>
<view class="template-grid" v-else> <view class="template-grid" v-else>
<view class="template-item" :class="{ active: currentTemplate.id === item.id }" <view class="template-item" :class="{ active: currentTemplate.id === item.id }" @click="selectTemplate(item)" v-for="item in templateList" :key="item.id">
@click="selectTemplate(item)" v-for="item in templateList" :key="item.id"> <view class="tag" v-if="item.price_cents">¥ {{ item.price_cents / 100 }}</view>
<view class="tag" v-if="item.price_cents">¥ {{item.price_cents / 100}}</view> <view class="template-name">{{ item.name }}</view>
<view class="template-name">{{item.name}}</view> <view class="template-desc">{{ item.description }}</view>
<view class="template-desc">{{item.description}}</view>
</view> </view>
</view> </view>
</view> </view>
<!-- 设置参数 --> <!-- 设置参数 -->
<view class="section"> <view class="section" v-if="has_access">
<view class="section-title">设置参数</view> <view class="section-title">设置参数</view>
<uv-skeletons v-if="loading" :loading="loading" :skeleton="[{ <uv-skeletons v-if="loading" :loading="loading" :skeleton="[{
type: 'line', type: 'line',
num: 3, num: 3,
gap: '20rpx' gap: '20rpx'
}]"></uv-skeletons> }]"></uv-skeletons>
<view class="form" v-else> <view class="form" v-else>
<uv-form labelAlign="left" labelWidth="auto" labelPosition="left" :model="formField" :rules="rules" <uv-form labelAlign="left" labelWidth="auto" labelPosition="left" :model="formField" :rules="rules" ref="form">
ref="form"> <uv-form-item :prop="item.name" :label="item.name + '：'" v-for="item in (currentTemplate.params?.filter(item => item.enabled) || [])">
<uv-form-item :prop="item.key" :label="item.name + '：'" v-for="item in (currentTemplate.params?.filter(item => item.enabled) || [])"> <uv-input @click="openPicker(item)" :readonly="item.type === 'select'" :type="item.type === 'number' ? 'digit' : 'text'" v-model="item.value" color="#000" border="bottom" :placeholderStyle="{ color: '#666778' }" placeholder="请输入"></uv-input>
<uv-input :type="item.type === 'number' ? 'digit' : 'text'" v-model="item.value" color="#000"
border="bottom" :placeholderStyle="{ color: '#666778' }" placeholder="请输入"></uv-input>
</uv-form-item> </uv-form-item>
<!-- <uv-form-item prop="password" label="载重（kg）"> <!-- <uv-form-item prop="password" label="载重（kg）">
<uv-input <uv-input
@ -115,271 +112,313 @@
</view> </view>
</view> </view>
<view class="section" v-else>
<div class="status">状态：{{ currentTemplate.access_status }}</div>
<uv-button text="申请权限" color="#3F70FF"></uv-button>
</view>
<!-- 底部按钮 --> <!-- 底部按钮 -->
<view class="bottom-actions"> <view class="bottom-actions">
<uv-button :loading="generating" @click="() => modalRef.open()" text="生成图纸" color="#3F70FF"></uv-button> <uv-button :loading="generating" @click="modalRefOpen" text="生成图纸" color="#3F70FF"></uv-button>
<uv-button @click="viewHistory" text="查看记录"></uv-button> <uv-button @click="viewHistory" text="查看记录"></uv-button>
</view> </view>
<uv-modal ref="modalRef" showCancelButton content='确定生成图纸？' @confirm="confirmGenerate"></uv-modal> <uv-modal ref="modalRef" showCancelButton content='确定生成图纸？' @confirm="confirmGenerate"></uv-modal>
<uv-picker ref="picker" :columns="columns" @confirm="confirm"></uv-picker>
</view> </view>
</template> </template>
<script setup> <script setup>
import { import {
ref, ref,
onMounted onMounted
} from "vue"; } from "vue";
import { import {
onShow, onShow,
onLoad, onLoad,
onShareAppMessage, onShareAppMessage,
onShareTimeline, onShareTimeline,
onReachBottom, onReachBottom,
} from "@dcloudio/uni-app"; onPullDownRefresh
import { } from "@dcloudio/uni-app";
useAuthStore, import {
useUserStore useAuthStore,
} from "@/store"; useUserStore
import RPC from "@/utils/request"; } from "@/store";
import { import RPC from "@/utils/request";
usePermission import {
} from "@/hooks/usePermission"; usePermission
} from "@/hooks/usePermission";
const authStore = useAuthStore();
const userStore = useUserStore(); const authStore = useAuthStore();
const loading = ref(false) const userStore = useUserStore();
const loading = ref(false)
const generating = ref(false);
const modalRef = ref(null) const has_access = ref(false)
const confirmGenerate = () => { const applyRef = ref(null)
const params = {}
currentTemplate.value.params?.filter(item => item.enabled).forEach(item => { const modalRefOpen = () => {
params[item.name] = item.value if(!has_access.value) {
}) uni.showToast({
RPC.post('/template_create_task', {template_id:currentTemplate.value.id,template_data:params}).then(() => { title: "模板无权限使用",
icon: "error",
uni.showToast({ });
title: "图纸开始生成", return
icon: "success",
});
setTimeout(() => {
uni.navigateTo({
url: "/pagesA/generate-record/generate-record",
});
}, 1000)
modalRef.value.close()
})
}
const templateList = ref([])
const currentTemplate = ref({})
const getList = () => {
loading.value = true
RPC.post('/template/list', {
page: 1,
limit: -1
}).then(res => {
templateList.value = (res.rows || []).filter(item => item.enabled)
currentTemplate.value = templateList.value[0] ? JSON.parse(JSON.stringify(templateList.value[0])) : {}
}).finally(() => {
loading.value = false
})
} }
getList() modalRef.value.open()
}
// 选择模板 const currentParams = ref(null)
const selectTemplate = (item) => { const openPicker = item => {
currentTemplate.value = JSON.parse(JSON.stringify(item)); console.log(item)
}; if (item.type !== 'select') return
currentParams.value = item
columns.value = [item.options.split(',')]
picker.value.open()
}
const picker = ref(null)
const columns = ref([[]])
const confirm = val => {
console.log(val)
currentParams.value.value = val.value[0]
}
const form = ref(null); const generating = ref(false);
const formField = ref({ const modalRef = ref(null)
phone: "", const confirmGenerate = () => {
password: "", const params = {}
}); currentTemplate.value.params?.filter(item => item.enabled).forEach(item => {
const rules = ref({ params[item.name] = item.value
// 'phone': { })
// required: true, RPC.post('/template_create_task', { template_id: currentTemplate.value.id, template_data: params }).then(() => {
// message: '请填写手机号',
// trigger: ['blur', 'change']
// },
// 'password': {
// required: true,
// message: '请填写验证码',
// trigger: ['blur', 'change']
// }
});
// 查看历史记录 uni.showToast({
const viewHistory = () => { title: "图纸开始生成",
uni.navigateTo({ icon: "success",
url: "/pagesA/generate-record/generate-record",
}); });
}; setTimeout(() => {
uni.navigateTo({
url: "/pagesA/generate-record/generate-record",
});
}, 1000)
modalRef.value.close()
})
}
const templateList = ref([])
const currentTemplate = ref({})
const getList = () => {
loading.value = true
RPC.post('/template/list_with_access', {
page: 1,
limit: -1
}).then(res => {
templateList.value = (res.rows || []).filter(item => item.enabled)
currentTemplate.value = templateList.value[0] ? JSON.parse(JSON.stringify(templateList.value[0])) : {}
}).finally(() => {
loading.value = false
})
}
// 分享给朋友 // 选择模板
onShareAppMessage((data) => { const selectTemplate = (item) => {
console.log("🚀 ~ onShareAppMessage ~ data:", data); currentTemplate.value = JSON.parse(JSON.stringify(item));
return { has_access.value = currentTemplate.value.has_access
title: "电梯图纸生成平台", };
path: "/pages/index/index",
};
});
// 分享到朋友圈 const form = ref(null);
onShareTimeline((data) => { const formField = ref({
console.log("🚀 ~ onShareTimeline ~ data:", data); phone: "",
return { password: "",
title: "电梯图纸生成平台", });
query: "a=1&b=2", const rules = ref({
}; // 'phone': {
}); // required: true,
// message: '请填写手机号',
// trigger: ['blur', 'change']
// },
// 'password': {
// required: true,
// message: '请填写验证码',
// trigger: ['blur', 'change']
// }
});
onLoad(() => { // 查看历史记录
console.log("index-onLoad"); const viewHistory = () => {
}); uni.navigateTo({
onShow(async () => { url: "/pagesA/generate-record/generate-record",
console.log("test page onShow");
const hasPermission = await usePermission();
console.log(hasPermission ? "已登录" : "跳转登录");
// 以下开始写业务逻辑...
if (!hasPermission) {
authStore.signOut();
uni.$uv.route("/pages/login/login");
}
}); });
};
// 分享给朋友
onShareAppMessage((data) => {
console.log("🚀 ~ onShareAppMessage ~ data:", data);
return {
title: "电梯图纸生成平台",
path: "/pages/index/index",
};
});
// 分享到朋友圈
onShareTimeline((data) => {
console.log("🚀 ~ onShareTimeline ~ data:", data);
return {
title: "电梯图纸生成平台",
query: "a=1&b=2",
};
});
onLoad(() => {
console.log("index-onLoad");
});
onShow(async () => {
getList()
console.log("test page onShow");
const hasPermission = await usePermission();
console.log(hasPermission ? "已登录" : "跳转登录");
// 以下开始写业务逻辑...
if (!hasPermission) {
authStore.signOut();
uni.$uv.route("/pages/login/login");
}
});
onPullDownRefresh(() => {
getList()
uni.stopPullDownRefresh();
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.container { .container {
font-size: 14px; font-size: 14px;
min-height: 100vh; min-height: 100vh;
background-color: #f8f8f8; background-color: #f8f8f8;
padding-bottom: 52px; padding-bottom: 52px;
/* #ifdef H5 */ /* #ifdef H5 */
padding-bottom: 102px; padding-bottom: 102px;
/* H5环境下需要更多空间 (50px按钮 + 50px tabBar + 2px间距) */ /* H5环境下需要更多空间 (50px按钮 + 50px tabBar + 2px间距) */
/* #endif */ /* #endif */
}
.header-section {
position: relative;
height: 200px;
overflow: hidden;
.header-image {
width: 100%;
height: 100%;
} }
.header-section { .header-overlay {
position: relative; position: absolute;
height: 200px; top: 50%;
overflow: hidden; right: 0;
background: rgba(0, 0, 0, 0.5);
color: white;
width: 70%;
transform: translate(0, -50%);
padding: 20px 10px;
.header-image { .header-title {
width: 100%; font-size: 16px;
height: 100%; font-weight: bold;
margin-bottom: 8px;
color: #bd9e85;
}
.header-subtitle {
font-size: 12px;
} }
}
}
.section {
margin: 16px;
background: white;
border-radius: 12px;
padding: 16px;
.header-overlay { .section-title {
font-size: 16px;
font-weight: bold;
color: #333;
margin-bottom: 16px;
}
}
.template-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
max-height: 200px;
overflow-y: auto;
.template-item {
border: 1px solid #e5e5e5;
border-radius: 8px;
padding: 16px 12px;
text-align: center;
transition: all 0.3s;
position: relative;
.tag {
position: absolute; position: absolute;
top: 50%; top: 0px;
right: 0; left: 0;
background: rgba(0, 0, 0, 0.5); padding: 2px 8px;
border-radius: 0 0 10px 0;
font-size: 10px;
color: white; color: white;
width: 70%; background: #00caef;
transform: translate(0, -50%);
padding: 20px 10px;
.header-title {
font-size: 16px;
font-weight: bold;
margin-bottom: 8px;
color: #bd9e85;
}
.header-subtitle {
font-size: 12px;
}
} }
}
.section { &.active {
margin: 16px; border-color: #4285f4;
background: white; background-color: #f0f7ff;
border-radius: 12px; }
padding: 16px;
.section-title { .template-name {
font-size: 16px; font-size: 14px;
font-weight: bold; font-weight: 500;
color: #333; color: #333;
margin-bottom: 16px; margin: 8px 0 4px;
} }
}
.template-grid { .template-desc {
display: grid; font-size: 12px;
grid-template-columns: 1fr 1fr; color: #999;
gap: 12px;
max-height: 200px;
overflow-y: auto;
.template-item {
border: 1px solid #e5e5e5;
border-radius: 8px;
padding: 16px 12px;
text-align: center;
transition: all 0.3s;
position: relative;
.tag {
position: absolute;
top: 0px;
left: 0;
padding: 2px 8px;
border-radius: 0 0 10px 0;
font-size: 10px;
color: white;
background: #00caef;
}
&.active {
border-color: #4285f4;
background-color: #f0f7ff;
}
.template-name {
font-size: 14px;
font-weight: 500;
color: #333;
margin: 8px 0 4px;
}
.template-desc {
font-size: 12px;
color: #999;
}
} }
} }
}
.bottom-actions { .bottom-actions {
z-index: 999; z-index: 999;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
left: 0; left: 0;
background: #fff; background: #fff;
height: 50px; height: 50px;
border-top: 1px solid #e5e5e5; border-top: 1px solid #e5e5e5;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 12px; gap: 12px;
justify-content: space-between; justify-content: space-between;
padding: 0 16px; padding: 0 16px;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
/* #ifdef H5 */ /* #ifdef H5 */
bottom: 50px; bottom: 50px;
/* H5环境下给tabBar留出空间 */ /* H5环境下给tabBar留出空间 */
/* #endif */ /* #endif */
} }
</style> </style>
<style lang="scss"> <style lang="scss">
.bottom-actions { .bottom-actions {
.uv-button-wrapper { .uv-button-wrapper {
width: 48%; width: 48%;
}
} }
}
</style> </style>
Write Preview
Loading…
Cancel
Save