123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252 |
- <template>
- <!-- 远程做糖 -->
- <div class="sugarPage flex-col">
- <s-header :name="$t('device.remoteSugarMaking')" :noback="false"></s-header>
- <div class="box1 flex-col">
- <div class="block2 flex-row justify-between">
- <div class="block3 flex-col"></div>
- <span class="info2">{{ $t('device.equipmentName') }}:{{ deviceDetal ? deviceDetal.name : '' }}</span>
- </div>
- <div v-if="machineType === null || machineType === '0'">
- <van-field v-model="fieldValue" is-link readonly :label="$t('device.clickToSelectPattern')"
- :placeholder="$t('device.pleaseSelectAPattern')" @click="show = true" />
- <van-popup v-model:show="show" round position="bottom">
- <van-cascader v-model="cascaderValue" :title="$t('device.pleaseSelectAPattern')" :options="options"
- @close="show = false" @finish="onFinish">
- <template #option="{ option }">
- <div class="cascader-item">
- <van-image :src="option.imgUrl" width="55px" height="55px"></van-image>
- <div class="cascader-label">{{ option.value }}</div>
- </div>
- </template>
- </van-cascader>
- </van-popup>
- <div class="textRow o-pr-20">
- <span @click="pushToDaySugarList">{{ $t('device.todaysSugarList') }}>></span>
- </div>
- <div v-if="!doSugartData" class="block5 flex-col" @click="submitDoSugar"><span class="txt3">{{
- $t('device.submitToMakeSugar') }}</span></div>
- <van-button v-if="doSugartData" style="padding: 1em;" round type="primary" class="block5 flex-col"
- :disabled="doSugartType" @click="checkData()">{{ $t('device.viewResults') }}</van-button>
- </div>
- <div v-if="machineType === '1'">
- <van-field v-model="fieldValue" is-link readonly :label="$t('device.clickToSelectTaste')"
- :placeholder="$t('device.pleaseSelectTaste')" @click="show = true" />
- <van-popup v-model:show="show" round position="bottom">
- <van-cascader v-model="cascaderValue" :title="$t('device.pleaseSelectTaste')" :options="options"
- @close="show = false" @finish="onFinish">
- <template #option="{ option }">
- <div class="cascader-item">
- <van-image :src="option.imgUrl" width="55px" height="55px"></van-image>
- <div class="cascader-label">{{ option.value }}</div>
- </div>
- </template>
- </van-cascader>
- </van-popup>
- <div class="textRow o-pr-20">
- <span @click="pushToDaySugarList">{{ $t('device.todaysMakeList') }}>></span>
- </div>
- <div v-if="!doSugartData" class="block5 flex-col" @click="submitDoSugar"><span class="txt3">{{
- $t('device.submitToMakeSugar') }}</span></div>
- <van-button v-if="doSugartData" round type="primary" class="volumeChangeButton" :disabled="doSugartType"
- @click="checkData()">{{ $t('device.viewResults') }}</van-button>
- </div>
- <div v-if="machineType === '2'">
- <van-field v-model="fieldValue" is-link readonly :label="$t('device.clickToSelectTaste')"
- :placeholder="$t('device.pleaseSelectTaste')" @click="show = true" />
- <van-popup v-model:show="show" round position="bottom">
- <van-cascader v-model="cascaderValue" :title="$t('device.pleaseSelectTaste')" :options="options"
- @close="show = false" @finish="onFinish">
- <template #option="{ option }">
- <div class="cascader-item">
- <van-image :src="option.imgUrl" width="55px" height="55px"></van-image>
- <div class="cascader-label">{{ option.value }}</div>
- </div>
- </template>
- </van-cascader>
- </van-popup> -->
- <div class="textRow o-pr-20">
- <span @click="pushToDaySugarList">{{ $t('device.todaysMakeList') }}>></span>
- </div>
- <div v-if="!doSugartData" class="block5 flex-col" @click="submitDoSugar"><span class="txt3">{{
- $t('device.submitToMakeSugar') }}</span></div>
- <van-button v-if="doSugartData" round type="primary" class="volumeChangeButton" :disabled="doSugartType"
- @click="checkData()">{{ $t('device.viewResults') }}</van-button>
- </div>
- </div>
- </div>
- </template>
- <script>
- import { onMounted, ref } from 'vue';
- import sHeader from "@/components/SimpleHeader";
- import { useRoute, useRouter } from 'vue-router';
- import { getDeviceDetal, selectProducts, doSugar, selectSugarStatus } from '@/service/device'
- import { showFailToast, showSuccessToast, showToast } from 'vant';
- import { useI18n } from 'vue-i18n';
- import { styleUrl } from "../../common/js/utils";
- export default {
- setup() {
- const { t } = useI18n();
- const route = useRoute();
- const router = useRouter();
- const deviceId = route.query.deviceId;
- const machineType = route.query.machineType;
- const deviceDetal = ref(null);
- const show = ref(false);
- const fieldValue = ref('');
- const cascaderValue = ref('');
- const options = ref([]);
- const onFinish = ({ selectedOptions }) => {
- console.log('onFinish', selectedOptions);
- show.value = false;
- fieldValue.value = selectedOptions[0].value
- }
- const doSugartData = ref(null);
- const doSugartType = ref(true);
- // 初始化页面获取列表
- onMounted(async () => {
- styleUrl('doSugar')
- getDeviceDetalFun();
- });
- const showSugarPhoto = (no) => {
- return require(`../../assets/order/spunSugar/goods/${no}.png`);
- };
- // 获取设备列表数据
- const getDeviceDetalFun = async () => {
- const { data } = await getDeviceDetal({ id: deviceId });
- if (data.code === '00000') {
- deviceDetal.value = data.data;
- getProduct();
- } else { showFailToast(data.message); }
- }
- // 获取花形下拉列表
- const getProduct = async () => {
- const { data } = await selectProducts({ equipmentId: deviceId });
- if (data.code) {
- if (machineType != '2') {
- options.value = data.data.map(item => {
- return {
- text: item.productName,
- value: item.productName,
- imgUrl: showSugarPhoto(item.no),
- };
- })
- } else {
- // data.data.map(item => {
- // console.log("编号", item.no);
- // if (item.no == 'I01') {
- // return {
- // text: item.productName,
- // value: item.productName,
- // imgUrl: showSugarPhoto(item.no),
- // };
- // }
- // })
- data.data.forEach(item => {
- if (item.no == 'I01') {
- options.value.push(
- {
- text: item.productName,
- value: item.productName,
- imgUrl: showSugarPhoto(item.no),
- children: []
- }
- )
- }
- })
- data.data.forEach(item => {
- if (item.no.includes('J')) {
- options.value[0].children.push(
- {
- text: item.productName,
- value: item.productName,
- imgUrl: showSugarPhoto(item.no),
- children: [],
- }
- )
- }
- })
- data.data.forEach(item => {
- if (item.no.includes('C')) {
- options.value[0].children.forEach(item1 => {
- item1.children.push(
- {
- text: item.productName,
- value: item.productName,
- imgUrl: showSugarPhoto(item.no),
- }
- )
- })
- }
- })
- }
- } else { showFailToast(data.message); }
- // console.log(options.value);
- }
- const submitDoSugar = async () => {
- doSugartData.value = null;
- doSugartType.value = true;
- if (fieldValue.value === '') { showFailToast(t('device.pleaseSelectAPattern')); return; }
- const { data } = await doSugar({ equipmentId: deviceId, productName: fieldValue.value });
- if (data.code) {
- doSugartData.value = data.data;
- setTimeout(() => {
- doSugartType.value = false;
- }, 5000);
- } else { showFailToast(data.message); }
- }
- const checkData = async () => {
- const { data } = await selectSugarStatus({ no: doSugartData.value.no });
- if (data.code) {
- if (data.data == '1') {
- showToast(t('device.receiveInstruction'));
- } else {
- showSuccessToast(data.message);
- }
- doSugartData.value = null;
- doSugartType.value = true;
- } else {
- if (data.data == '0') {
- showToast(t('device.notUploadData'));
- } else if (data.data == '2') {
- showToast(t('device.machineException'));
- } else if (data.data == '3') {
- showToast(t('device.netException'));
- } else {
- showToast(data.message);
- }
- }
- };
- const pushToDaySugarList = async () => {
- router.push({ path: 'toDaySugarList', query: { deviceId: deviceId } })
- }
- return {
- deviceDetal,
- show,
- fieldValue,
- cascaderValue,
- options,
- onFinish,
- submitDoSugar,
- doSugartData,
- doSugartType,
- checkData,
- pushToDaySugarList,
- showSugarPhoto,
- machineType
- };
- },
- components: { sHeader },
- };
- </script>
- <style lang="less" scoped>
- @import "../../common/style/common";
- </style>
|