|
|
@@ -45,6 +45,7 @@
|
|
|
fit
|
|
|
highlight-current-row
|
|
|
style="width: 100%;"
|
|
|
+ @row-click="handleFoodClick"
|
|
|
>
|
|
|
<el-table-column type="index" label="序号" align="center" fixed width="60px" />
|
|
|
<el-table-column label="名称" align="center" fixed width="200px">
|
|
|
@@ -178,6 +179,19 @@
|
|
|
</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
+
|
|
|
+ <el-dialog title="食物二维码" width="250" :visible.sync="foodQRDialogVisible">
|
|
|
+ <vue-qr
|
|
|
+ :text="foodQRParams.url"
|
|
|
+ :bgSrc="foodQRParams.bgImg"
|
|
|
+ :logoSrc="foodQRParams.logoImg"
|
|
|
+ :size="200"
|
|
|
+ :correctLevel="3"
|
|
|
+ colorDark="#000"
|
|
|
+ colorLight="#fff"
|
|
|
+ :dotScale="1"
|
|
|
+ ></vue-qr>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -188,12 +202,13 @@ import axios from 'axios'
|
|
|
import { getToken } from '@/utils/auth'
|
|
|
import { getFoodSourceByUrl } from '@/utils/food-utils'
|
|
|
import store from '@/store'
|
|
|
+import VueQr from 'vue-qr'
|
|
|
|
|
|
const foodTypes = { 0: '主材', 1: '辅材' }
|
|
|
|
|
|
export default {
|
|
|
name: 'FoodList',
|
|
|
- components: { Pagination },
|
|
|
+ components: { Pagination, VueQr },
|
|
|
filters: {
|
|
|
foodTypeFilter(value) {
|
|
|
return foodTypes[value]
|
|
|
@@ -218,7 +233,9 @@ export default {
|
|
|
uploadLoading: false,
|
|
|
copyDialogVisible: false,
|
|
|
params: {},
|
|
|
- foodSource: ''
|
|
|
+ foodSource: '',
|
|
|
+ foodQRDialogVisible: false,
|
|
|
+ foodQRParams: {}
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
@@ -326,6 +343,13 @@ export default {
|
|
|
},
|
|
|
canDelete(data) {
|
|
|
return store.getters.isAdmin || data && data.userId === store.getters.userId
|
|
|
+ },
|
|
|
+ handleFoodClick(row) {
|
|
|
+ this.foodQRParams = { url: process.env.VUE_APP_H5_URL + `/food/index.html?id=${row.id}`,
|
|
|
+ bgImg: row.mainImage ? row.mainImage : '',
|
|
|
+ logoImg: row.mainImage ? row.mainImage : ''
|
|
|
+ }
|
|
|
+ this.foodQRDialogVisible = true
|
|
|
}
|
|
|
}
|
|
|
}
|
